Site responsive : prévisualiser votre site Web sur des appareils de différentes tailles
Chaque concepteur Web doit s’assurer que le site Web est compatible avec toutes les tailles d’Ă©cran. Il est connu que chaque appareil comme l’ordinateur portable, le tĂ©lĂ©phone mobile et la tablette a ses propres spĂ©cifications d’Ă©cran par dĂ©faut. Ainsi, le concepteur Web doit prendre en compte toutes les tailles d’appareils lors de la conception d’un site Web, sinon le site Web pourrait Ă©chouer et sembler maladroit sur les appareils incompatibles.
Compte tenu du problème, il est toujours important de vĂ©rifier et de s’assurer que le site Web fonctionne correctement sur tous les appareils. Pour rĂ©soudre ce problème, Google a introduit l’un des outils d’Ă©mulation d’Ă©cran en ligne qui aident non seulement les concepteurs mais Ă©galement les propriĂ©taires de sites Ă vĂ©rifier la compatibilitĂ© des tailles. L’outil est nommĂ© Resizer qui est gratuit pour tous et votre site sera prĂ©visualisĂ© sur toutes sortes d’appareils.
Il est important de noter que cela ne fonctionne que pour les sites Web dĂ©jĂ dĂ©veloppĂ©s et dĂ©ployĂ©s. Il prĂ©visualise uniquement les sites Web qui sont hĂ©bergĂ©s sur un serveur Web. S’il y a un problème avec le chargement de la page, il signale une erreur.
Voyons comment ce Resizer de Google aide à prévisualiser notre site sur tous les appareils.
Voici la séquence étape par étape
- Tout d’abord, allez sur la page Web design.google.com/resizer
- Maintenant, il vous amènera à la page où le champ de recherche et trois icônes (ordinateur portable, tablette, téléphone portable) sont affichés
- Assurez-vous de saisir l’adresse de votre site Web. Par exemple, dans cet article, j’ai saisi https://astuces-informatique.com
- Maintenant, cliquez sur l’icĂ´ne Ordinateur portable pour voir l’aperçu sur les appareils de la taille d’un ordinateur portable
- Cliquez sur l’icĂ´ne Tablette pour prĂ©visualiser le site Web sur la taille d’Ă©cran de la tablette
- Enfin, cliquez sur l’icĂ´ne du tĂ©lĂ©phone mobile pour prĂ©visualiser le site
À chaque étape de la prévisualisation, assurez-vous que les composants et les éléments du site Web ne sont pas égarés. Si quelque chose est mal placé, envoyez le test pour résoudre le problème.
Avez-vous utilisé une alternative similaire à Google Resizer ?