Web

Site responsive : prévisualiser votre site Web sur des appareils de différentes tailles


tester-site-web-responsive

 

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

  1. Tout d’abord, allez sur la page Web design.google.com/resizer
  2. 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
  3. Assurez-vous de saisir l’adresse de votre site Web. Par exemple, dans cet article, j’ai saisi https://astuces-informatique.com
  4. Maintenant, cliquez sur l’icĂ´ne Ordinateur portable pour voir l’aperçu sur les appareils de la taille d’un ordinateur portable
  5. Cliquez sur l’icĂ´ne Tablette pour prĂ©visualiser le site Web sur la taille d’Ă©cran de la tablette
  6. Enfin, cliquez sur l’icĂ´ne du tĂ©lĂ©phone mobile pour prĂ©visualiser le site
Ă€ lire aussi  Comment installer un plugin Wordpress ?

tester-site-responsive

À 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 ?


Articles similaires

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Bouton retour en haut de la page