Safari pour iOS inclut une console de débogage facultative pour aider les développeurs Web à rechercher et à résoudre les problèmes liés aux pages Web sur iPhone et iPad.

Mieux encore, avec les dernières versions d'iOS, il utilise en fait le même inspecteur Web que Safari sur le bureau, ce qui signifie que si vous connectez l'iPhone ou l'iPad à l'ordinateur, vous pouvez utiliser directement les outils de débogage de Safari. avec votre appareil iOS ou iPadOS

Les anciennes versions d'iOS ont également cette fonctionnalité, et bien qu'elles ne soient pas aussi complètes que les outils de débogage et de développement de Safari pour ordinateur de bureau, elles sont toujours utiles et faciles à activer ou à désactiver sur l'iPhone et l'iPad.

Apprenons à activer cette fonctionnalité sur les nouvelles et les anciennes versions d'iOS, et apprenons également ce qui est différent entre les versions.

Comment activer et utiliser Web Inspector dans Safari pour iPhone et iPad

Sur les versions modernes d'iOS et d'iPadOS, voici comment fonctionne l'inspecteur Web de Safari :

1. Ouvrez Paramètres > Safari > Avancé puis appuyez sur pour activer "Web Inspector"
2. Connectez l'iPhone ou l'iPad à un Mac, puis allez dans Safari et activez le menu développeur si vous ne l'avez pas encore fait en allant dans Safari > Préférences > Avancé > Afficher la barre de menu Développer
3. Déroulez la barre de menu "Développer" et trouvez l'iPhone ou l'iPad, puis ouvrez la page Web que vous souhaitez déboguer
4. Safari Web Inspector s'ouvrira et vous pourrez déboguer et inspecter les éléments Web de l'appareil iOS ou IPadOS directement dans Safari sur Mac

Maintenant, lorsque vous naviguez sur l'iPhone ou l'iPad, vous constaterez que l'inspecteur Web de Safari sur Mac sera mis à jour.

Vous pouvez accéder à la console de débogage via l'onglet Console de l'inspecteur Web, et vous pouvez accéder au débogueur via l'onglet Débogueur. Et bien sûr, les outils d'inspection Web habituels pour les éléments, les ressources, le réseau, etc. sont également disponibles.

Vous pouvez également utiliser une astuce Afficher la source pour iOS et iPadOS lorsque vous êtes en déplacement, si nécessaire également.

Comment activer la console de débogage sur les anciennes versions d'iOS

Si vous avez une ancienne version d'iOS sur un ancien iPhone ou iPad, toute l'expérience de débogage est sur l'appareil et vous n'avez pas la possibilité de le connecter à Safari sur un Mac. Néanmoins, cela reste très utile, voici comment cela fonctionne :

1. Lancez "Paramètres" et appuyez sur "Safari"
2. Appuyez sur "Avancé"
3. Faites glisser "Console de débogage" sur ON

Une fois activé, appuyez sur la console de débogage en haut de n'importe quel écran Safari pour voir les erreurs de page Web.

La liste par défaut affiche toutes les erreurs, mais vous pouvez accéder à des erreurs HTML, JavaScript et CSS plus spécifiques en les appuyant individuellement.

Un autre outil utile pour les développeurs Web mobiles est Firebug Lite pour iOS, qui utilise un bookmarklet javascript pour charger une version plus simple de l'outil de développement populaire Firebug. Cette fonctionnalité est probablement la plus utile pour les anciennes versions d'iOS, car les nouvelles versions ont de nouvelles fonctionnalités.

Utilisez-vous des outils de développement Web pour iPhone ou iPad ? Partagez avec nous des conseils, astuces, applications ou techniques dans les commentaires ci-dessous.