Safari – Menu développement

Par -

Liens commerciaux

Voilà une petite astuce fort sympathique trouvée grâce au très bon blog Pomme Happy, le menu développement de Safari, très pratique pour les développeurs web.

Tout d’abord comment l’activer ?

Après avoir lancé Safari, cliquez dans la barre de menu sur Safari>Préférences, puis rendez-vous dans l’onglet Avancées et cochez la case en bas de la fenêtre : “Afficher le menu Développement dans la barre des menus” puis quittez les préférences de Safari.

Liens commerciaux

Vous avez à présent ce menu supplémentaire dans votre barre des menus de Safari, mais que vous permet de faire ce menu ?

Et bien voici les quelques fonctions qu’il ajoute à Safari :

  • Sélection d’un agent d’utilisateur :
    c’est à dire, simuler l’affichage d’un site en fonction du type de navigateur et de sa version : par exemple, j’ai installé sur ce blog un thème spécifique pour les utilisateurs d’iPhone, si vous cliquez sur “Agent d’utilisateur > Mobile Safari 1.1.3 – iPhone“, le site va détecter que vous venez d’y accéder à partir d’un iPhone et il va donc afficher le site avec le thème iPhone.
  • Un inspecteur web :
    Celui-ci va vous afficher dans une fenêtre supplémentaire, tous les détails des éléments qui composent la page web actuellement affichée : Le code de la page, les feuilles de style css associées et leur contenu, les images chargée dans la page, les scripts (javascripts ou autres) liés à la page, une console vous permettant de détecter les erreurs de code présent dans la page web et un onglet Network, vous affichant l’ordre de chargement des éléments de le page, leur type (feuilles de styles, images etc..) et leur temps de chargement.
  • Désactivation de différents éléments chargés par la page :
    Vous pouvez à l’aide de ces différents menus désactiver au choix certains éléments de la page, comme le javascript, les feuilles de style, le chargement des images, les caches, et d’autres petites choses que je n’ai pas encore bien assimilées.

Bon vous l’aurez compris, ce menu ajoute à Safari des fonctions que l’on peut retrouver également sur Firefox avec le plugin webdevelopper Toolbar ou autres et permettent d’étendre les possibilités du navigateur web by Apple.

Administrateur et rédacteur chez BDM

4 commentaires to Safari – Menu développement

  1. Merci pour cet article qui vient de me dépanner!
    Après 6 ans sur un MB Pro de 2006, je viens de passer au Retina (je ne pourrai plus jamais faire du montage vidéo avec l’ancien!) et plutôt que faire une migration je repars à zéro pour avoir de bonnes bases… je n’imaginais pas tout ce qu’il faut reconfigurer :-/

  2. Merci; très bon article pour ce qui s’intéresse à la programmation. Je voulais installer d’autres navigateurs pour tester les codes et scripts etc.. Mais tout est la! Merci encore.

  3. Bonjour,
    je viens d’installer le menu Développement pour tester mon site Web car il refuse de s’afficher correctement sur iPhone SAFARI. Je suis en IOS 9.1 et c’est la seule plateforme qui pose problème.
    J’avais cru lire qu’en connectant l’iPhone sur mon ordi par cable je pourrais utiliser l’iPhone comme “agent utilisateur” et ainsi déboguer mon site.
    Mais je ne vois absolument pas mon iPhone dans ce menu Développement.
    Avez-vous une idée ?
    Merci,
    Stéphane

Laisser un commentaire

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

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.