Lighthouse dans Chrome : audit mobile avec DevTools ou l'extension

Pour lancer un audit Lighthouse mobile dans Chrome, ouvrez DevTools, sélectionnez le panneau Lighthouse, réglez Device sur Mobile, choisissez les catégories voulues (Performance, Accessibility, Best practices, SEO) et cliquez sur Analyze page load. Lighthouse recharge la page sur un téléphone milieu de gamme émulé, avec une connexion bridée, et produit un rapport avec des scores de 0 à 100 et une liste de problèmes à corriger. Lancez-le en navigation privée, car les autres extensions peuvent fausser les résultats.

C’est aussi Lighthouse que Google a recommandé pour remplacer son test d’optimisation mobile ; voir les alternatives au test d’optimisation mobile.

Pas à pas dans Chrome DevTools

1. Ouvrez la page dans une fenêtre de navigation privée (Ctrl + Maj + N ou Cmd + Maj + N). Les extensions n’y tournent pas par défaut.
2. Ouvrez DevTools (F12 ou Cmd + Option + I) et sélectionnez Lighthouse. S’il n’apparaît pas, cherchez-le derrière la flèche >>.
3. Choisissez le Mode :
   • Navigation (par défaut) : audite un nouveau chargement de page. À utiliser la plupart du temps.
   • Timespan : enregistre pendant que vous interagissez, utile pour mesurer un menu ou un formulaire.
   • Snapshot : audite la page dans son état actuel, par exemple avec une modale ouverte.
4. Réglez Device sur Mobile.
5. Sélectionnez les Categories utiles.
6. Cliquez sur Analyze page load et patientez 30 à 60 secondes.

Lighthouse fonctionne sur toute page que Chrome peut ouvrir, y compris localhost et les pages derrière un identifiant, que les outils en ligne ne peuvent pas atteindre.

L’extension Lighthouse pour Chrome

Lighthouse existe aussi sous forme d’extension sur le Chrome Web Store : installez-la, ouvrez la page, cliquez sur l’icône Lighthouse et choisissez Generate report. La documentation de Google recommande le panneau DevTools sauf raison particulière, car DevTools peut auditer les sites locaux et les pages protégées, ce que l’extension ne sait pas faire. En pratique, l’extension est pratique pour auditer en un clic une page publique sans ouvrir DevTools ; pour le reste, suivez les étapes ci-dessus.

Lancer Lighthouse en ligne de commande

Pour des exécutions reproductibles ou en CI, utilisez la CLI Node :

npx lighthouse https://example.com --view

La CLI audite en mode mobile par défaut. Ajoutez --preset=desktop pour l’ordinateur, --only-categories=performance,seo pour limiter les catégories et --output=json pour traiter les résultats dans un script. PageSpeed Insights fait tourner le même moteur sur les serveurs de Google pour les URL publiques.

Lire le rapport

Chaque catégorie reçoit un score : 90 à 100 est bon (vert), 50 à 89 est à améliorer (orange), 0 à 49 est mauvais (rouge).

Performance repose sur des métriques de laboratoire : First Contentful Paint, Largest Contentful Paint, Total Blocking Time, Cumulative Layout Shift et Speed Index. Sous le score, Insights et Diagnostics listent des corrections concrètes : images trop lourdes, image LCP découverte trop tard, ressources bloquant le rendu. Depuis Lighthouse 13 (octobre 2025), les anciens audits de performance sont regroupés dans ces insights, les mêmes que dans le panneau Performance de DevTools.

Accessibility lance des contrôles automatiques : contraste des couleurs, libellés et textes alternatifs manquants, ordre des titres, réglages de zoom du viewport, taille des zones tactiles, entre autres.

Best practices couvre le HTTPS, les erreurs du navigateur dans la console, les API obsolètes et les proportions des images.

SEO vérifie les bases : un titre et une meta description, une page indexable avec un code de statut correct, des liens explorables au texte explicite, les textes alternatifs, un robots.txt valide, les balises hreflang et canonical. Lighthouse 13 a supprimé l’ancien audit de taille de police lisible et déplacé le contrôle du viewport dans les insights de performance. Réussir ces contrôles ne garantit pas un bon classement ; cela signifie seulement que rien de basique ne fait obstacle.

Pourquoi les scores mobiles sont plus bas et varient d’un test à l’autre

Le mode mobile simule un téléphone et un réseau plus lents : une page notée 95 sur ordinateur peut obtenir 60 sur mobile. Cet écart est voulu : il reflète l’expérience de nombreux visiteurs réels.

Les scores changent aussi d’une exécution à l’autre, parfois de 5 à 10 points, selon le réseau, le temps de réponse du serveur et l’activité en arrière-plan de votre ordinateur. Pour obtenir un chiffre fiable :

• lancez l’audit trois à cinq fois et retenez la médiane ;
• fermez les autres onglets et applications gourmands ;
• comparez ce qui est comparable (même réglage d’appareil, même page, même machine).

Pour la vitesse, Lighthouse est un test de laboratoire. Ce sont les données de terrain d’utilisateurs réels, dans PageSpeed Insights ou la Search Console, qui reflètent vos visiteurs. La différence est expliquée dans le guide du test de vitesse mobile.

Quoi corriger en premier

1. Tout ce qui est rouge en Accessibility et SEO. Ce sont souvent des corrections rapides : libellés, textes alternatifs, contraste, meta description absente, robot bloqué.
2. La plus grosse opportunité sur le LCP. Souvent une image d’en-tête trop lourde, chargée en lazy load ou découverte tard.
3. Les tâches JavaScript longues. Les scripts tiers sont souvent en cause ; voyez ce qui peut être différé ou supprimé.
4. Les décalages de mise en page. Indiquez les dimensions des images, contenus intégrés et emplacements publicitaires.

Lighthouse liste les problèmes, mais ne montre pas l’apparence de la page sur un téléphone. Complétez-le par un contrôle visuel dans un affichage mobile : le mode appareil de DevTools, ou Mobile View Extension, qui recharge la page à la taille d’un vrai téléphone avec un user agent mobile. Parcourez ensuite la checklist de test d’un site mobile pour ce que les audits automatiques ne peuvent pas juger, comme la navigation et les formulaires.

Questions fréquentes

Comment lancer Lighthouse en mode mobile dans Chrome ?

Ouvrez DevTools, allez dans le panneau Lighthouse, réglez Device sur Mobile, choisissez les catégories et cliquez sur Analyze page load. Utilisez une fenêtre de navigation privée pour des résultats plus propres.

Qu’est-ce qu’un bon score Lighthouse mobile ?

90 ou plus est considéré comme bon. Pour la performance, visez surtout des Core Web Vitals au vert dans les données d’utilisateurs réels ; le score de laboratoire sert à repérer les problèmes.

Lighthouse et PageSpeed Insights, est-ce la même chose ?

PageSpeed Insights exécute Lighthouse sur les serveurs de Google et ajoute, quand elles existent, les données d’utilisateurs réels du Chrome User Experience Report. Lighthouse dans DevTools tourne sur votre ordinateur et peut tester des pages locales et privées.