Tutoriel Vidéo Inspecter sur iOS

Après le tutoriel pour inspecter sur android je me suis demandé si il était possible d'inspecter sur un périphérique iOS.

Tout d'abord il vous faut un appareil fonctionnant avec ios, mais aussi un mac.

Activer l'inspecteur de code sur Safari

Branchez simplement votre iPhone à votre mac via le câble USB et activez le mode développeur dans safari.

  • Safari (dans la barre de menu)
  • Préférences (ou faites simplement la combinaison clavier : ⌘,)
  • Ensuite rendez-vous dans l'onglet Avancées
  • Cochez la case Afficher le menu Développement dans la barre des menus.

Safari développeur tool

Sur iOS

Sur votre iDevice, il faut aussi activer l'inspecteur.

  • Réglages
  • Safari
  • Descendez tout en bas et allez dans l'onglet Avancé
  • Activez Inspecteur web.

Paramètres avancés de safari ios

Inspecter iOS depuis Safari

Tout d'abord rendez-vous sur le site à inspecter via votre iDevice.
Ensuite consultez l'onglet Développement de Safari sur votre mac, Cliquez sur le nom de votre appareil et sélectionnez le site à inspecter.

Sélection du site à inspecter

Et voilà le résultat :

Inspecteur de code

Pourquoi ?

On peut se demander pourquoi utiliser l'inspecteur natif plutôt que l'inspecteur en mode responsive de notre navigateur. Les navigateurs mobiles ne réagissent pas forcément comme les navigateurs de nos ordinateurs. Il est donc essentiel d'être capable d'inspecter sur le périphérique cible.