Le média des professionnels du digital
Le média des professionnels du digital

Google lance Resizer, un outil interactif pour tester un site sur plusieurs écrans

Thomas Coëffé, le 26 février 2016

L’équipe dédiée au design chez Google vient de lancer un nouvel outil : Resizer. Il s’agit d’un outil interactif pour tester l’apparence d’un site sur plusieurs écrans.

google-resizer

Il s’agit résolument d’un outil simpliste pour tester le rendu d’un site sous toute résolution. Pour commencer, il suffit d’indiquer l’adresse URL du site à tester. Il s’affiche alors en trois résolutions classiques sur desktop, tablette et mobile.

Tester l’affichage du site sur ordinateur

Pour aller plus loin, vous pouvez cliquer sur les icônes « desktop » ou « mobile » en haut à droite. Le premier permet de tester l’affichage du site sur un écran d’ordinateur. En haut, une règle permet de choisir la résolution de l’écran, de 480 pixels de large à 1600 pixels de large.

google-resizer-desktop

Tester l’affichage du site sur mobile

Le deuxième icône permet, en toute logique, de tester l’affichage du site sur tablette et mobile. Cela fonctionne de la même manière : une règle permet d’ajuster la résolution de l’écran, de 360 pixels de large à 1024 pixels. Cet outil permet de vérifier le rendu du site sur mobile en mode portrait, sur mobile en mode paysage, sur tablette en mode portrait et sur tablette en mode paysage.

google-resizer-mobile

Dans les deux cas, le site testé est parfaitement opérationnel : vous pouvez donc naviguer de page en page pour tester l’affichage de tout votre site sur tous les écrans. Pour utiliser l’outil, rendez-vous sur g.co/design/resizer.

Recevez nos meilleurs articles
Commentaires
  1. Jason Rouet dit :

    Mouais, autant faire évoluer la console de Google Chrome plutôt que de créer un énième produit qui faire du resizing.
    Bon il faut avouer qu’il est bien foutu et rapide mais est-ce vraiment utile et pratique lorsque l’on dev sur du responsive design ?

Laisser un commentaire

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