Google Resizer, un outil gratuit pour tester un site responsive !

Google vient de lancer Google Resizer, un tout nouvel outil en ligne gratuit permettant à n’importe quel internaute, sans avoir à se connecter, de tester l’affichage de n’importe quel site internet sur toutes les résolutions d’écrans PC, tablettes et mobiles.

Pour tester les sites adaptables aux différents écrans, il y avait jusqu’à présent 2 possibilités principales :

• en passant par la fonctionnalité « inspecter l’élément » très connue des développeurs (accessible via un clic droit => « Inspecter » sur Google Chrome ou via un CTRL + SHIFT + M puis CTRL + SHIFT + I),
• en disposant de nombreux terminaux avec des résolutions différentes pour pouvoir correctement tester en live.

Désormais, avec la mise en ligne du nouvel outil Google Resizer, n’importe quel internaute pourra tester l’adaptabilité d’un site internet en fonction des différentes définitions d’écrans (PC, smartphone et tablette).

Google Resizer permet de tester n’importe quelle page d’un site internet, il est ainsi possible de tester la page d’accueil mais aussi n’importe quelle page profonde.

Cet nouvel outil Resizer vient en complément, sans le remplacer, de l’outil de test de compatibilité mobile lancé il y a déjà quelque temps par Google.

Comment utiliser Google Resizer ?

Pour commencer, voici l’URL d’accès de l’outil : https://design.google.com/resizer/

Après avoir entré l’URL du site ou de la page à tester dans la barre supérieure de Google Resizer, l’outil chargera automatiquement le site internet sous plusieurs résolutions (PC portable, tablette tactile au format paysage et smartphone) :

Cet affichage est interactif, il est ainsi possible de scroller sur les différents terminaux pour avoir un aperçu rapide de l’adaptabilité du site internet testé.

Pour tester le site dans le détail, l’outil propose ensuite deux icônes distincts en haut à droite. Le premier icône permet de tester un site avec les principales résolutions d’écrans des ordinateurs, le second est dédié aux terminaux mobiles (smartphones et tablettes).

Une fois le premier icône ou le second cliqué, une barre horizontale permet de sélectionner la résolution à tester. Un simple clic sur « 1280 », « 960 » ou « 840 » par exemple modifiera l’aperçu du site internet à la résolution sélectionnée.

L’outil Google Resizer en action :

Rien de mieux qu’un petit Gif animé pour vous présenter la fonctionnalité de manière plus interactive.

En résumé, ce nouvel outil Google Resizer est une version allégée et simplifiée de l’outil similaire accessible depuis la fonctionnalité « Inspecter l’élément » sur Google Chrome. L’outil Resizer ne permet par exemple pas de sélectionner un modèle de smartphone en particulier pour tester la fonctionnalité responsive d’un site, ce que permet l’autre fonctionnalité accessible via « inspecter l’élément ».

L’alternative à Google Resizer :

Pour ceux qui souhaitent accéder à l’autre fonctionnalité que je mentionne dans cet article, voici la procédure à suivre :

• Rendez-vous sur n’importe quelle page à tester avec Google Chrome
• Faites un clic droit => « inspecter » (ou CTRL + SHIFT + I)
• Cliquez ensuite sur le petit icône de téléphone en haut à droite pour basculer sur l’outil de test de compatibilité mobile / tablette intégré à Chrome (ou faites un CTRL + SHIFT + M)
• Sélectionnez en haut à gauche le terminal à tester puis faites un F5 pour rafraîchir la page et avoir un aperçu du rendu de la page sur ce terminal
• Pour plus de confort d’utilisation, passer en mode plein écran en appuyant sur la touche F11 de votre clavier

Voici ce à quoi l’outil ressemble une fois la procédure suivie et l’affichage configuré pour tester LEPTIDIGITAL sur un iPhone 6 :

Une fonctionnalité similaire existe également sur Mozilla Firefox, elle aussi accessible via un clic droit puis « Inspecter l’élément ». L’outil Mozilla est accessible pour sa part sur la droite de la console s’affichant une fois la manipulation précédente réalisée, via un icone carré placé à côté de l’icône de roue dentée :

Vincent Brossas

Fondateur de LEPTIDIGITAL et consultant SEO senior (à mes heures perdues), je suis un grand passionné de marketing digital et de SEO. Avant d’être indépendant à 100 %, j’ai travaillé en tant qu’SEO manager et responsable e-commerce pour différentes sociétés (Altice Media, Infopro Digital, Voyage Privé, Groupe ERAM). (Sur le plan perso, je suis un grand curieux hyperactif aussi passionné par l’IA, la photographie et les voyages !). PS : Si vous souhaitez me contactez, privilégiez LinkedIn ou Instagram. Pour me contacter : [email protected]

www.leptidigital.fr