Ico JavaScript
Ico CSS
Ico HTML
Ico mooTools
Ico PHP
Ico Astuces

Le débugger de Chrome

Date 02/05/2015
Ico Astuces
Comms 0 commentaire

Un outil très pratique à utiliser pour les rendus visuels de vos sites web, c'est le débugger de Google Chrome.


En effet ce navigateur dispose d'un outil de débuggage complet qui inclus un moteur de rendu émulant les user-agents et les différentes tailles d'écrans des smartphones, tablettes et autres résolutions d'écran PC classiques.


Pour se faire, il vous suffit d'ouvrir votre site web à tester sous Chrome, d'appuyer sur la touche F12 pour afficher le débugger et ensuite cliquer sur le bouton "Toggle device mode" (icône de téléphone mobile).

Ensuite dans le menu déroulant "Device" vous pouvez choisir parmi les appareils prédéfinis ou émuler un débit théorique (la 3G par exemple pour se rendre compte du délai de chargement d'une page).


Dans la case intitulée "UA" on peut même forcer le user-agent avec une chaine libre qui permet par exemple de tester le rendu du site sur iPhone 6 :


Mozilla/6.0
 (iPhone; CPU iPhone OS 8_0 like Mac OS X) AppleWebKit/536.26 (KHTML, 
like Gecko) Version/8.0 Mobile/10A5376e Safari/8536.25


Vous trouverez en suivant ce lien une liste exhaustive et à jour des différents user-agents possibles.



Vous avez aimé ce billet ?

 

Vous aimerez peut être...
> Tester et debugger IE7/8 via IE9/IE10
> Les dégradés en CSS3
> Héberger et lier sa propre police personnalisée
> ComboBox pour envoi de fichiers
> ComboxBox de choix d'images
 

Mot-clefs de ce billet...
chrome debugger iphone mobile user vous

Commentaires


Aucun commentaire...


Ajouter un commentaire


La validation des commentaires se fait automatiquement, suite à la validation d'un « captcha » qui permet de filtrer le spam. La publication de votre commentaire se fera ensuite automatiquement. L'administrateur du blog se réserve toutefois le droit de supprimer votre commentaire après publication s'il contrevient à nos condition d'utilisation ou s'il est considéré comme spam.

Auteur
Email
 
(facultatif et caché)
Site web
 
(facultatif)
Message

Ico Valider


MP  Mighty Productions
> Blogs
> Partage de codes sources - PHP / JS / mooTools
> Astuces
> Le débugger de Chrome
 
RSS       Mentions légales       Comms  Haut de la page  
◄ ►