Lighthouse est un outil populaire pour déterminer le temps de chargement d'un site Web et d'autres mesures Web pertinentes. Il est possible que cela soit dû au fait que Google est le moteur de recherche le plus populaire au monde. Mais qu'est-ce que Lighthouse exactement ? Quel est le secret pour le faire fonctionner pour vous ? Nous allons vous expliquer comment il fonctionne et ce que vous pouvez faire avec les informations qu'il vous fournit.
Réponse sous 24hrs
Lighthouse est un outil de test Web gratuit qui évalue les performances et la qualité d'un site Web. Il propose ensuite des recommandations sur la manière d'améliorer la qualité du site.
Vous pouvez utiliser cet outil de différentes manières :
- Chrome DevTools
- Extension Chrome
- Module Node
Une fois que vous aurez donné une URL à l'outil automatisé, il exécutera plusieurs audits de pages et produira un rapport contenant des informations sur le fonctionnement de la page. Vous pouvez ensuite utiliser les résultats pour trouver des moyens d'améliorer votre site Web.
Les développeurs ne sont pas les seuls à pouvoir utiliser Lighthouse. Toute personne possédant un site Web et souhaitant en savoir plus sur son fonctionnement et sur ce qu'elle peut faire pour l'améliorer peut utiliser cet outil.
Lighthouse vérifie une page Web et établit des rapports sur cinq catégories :
- Performances
- Accessibilité
- Référencement
- Meilleures pratiques
- Progressive Web App (PWA)
Il attribue aux sites un score de 1 à 100 et simule des connexions 3G. Google ajuste fréquemment ses critères de classement, les scores peuvent donc changer. Une bonne raison de se tenir au courant des mises à jour de Lighthouse.
Comme indiqué précédemment, il existe plusieurs façons d'utiliser Google Lighthouse. Nous allons vous présenter les deux méthodes les plus simples.
Comme son nom l'indique, vous avez besoin de Google Chrome. Naviguez jusqu'à la page que vous voulez vérifier. Cliquez avec le bouton droit de la souris sur la page et sélectionnez inspecter. Recherchez Lighthouse dans la barre d'outils (vous devrez peut-être cliquer sur les deux flèches à l'extrémité de la barre d'outils). Sélectionnez le modus, le dispositif et les catégories que vous souhaitez auditer.
- Ajoutez cette extension Chrome à votre navigateur.
- Redémarrez votre navigateur.
- Naviguez jusqu'à la page que vous souhaitez auditer.
- Cliquez sur le symbole du phare ou sur le menu déroulant de vos extensions.
- Générer un rapport
Comme indiqué précédemment, le rapport Lighthouse vous propose cinq catégories différentes. La plus importante pour nous est la performance, mais nous allons également parler des quatre autres catégories.
Lighthouse vérifie la vitesse de chargement d'une page ou d'une application Web et le temps nécessaire à un utilisateur pour voir et utiliser son contenu.
Lighthouse peut déterminer la performance d'un site Web à l'aide de six indicateurs Web :
Première peinture de contenu (FCP)
Dès que le premier élément de contenu du DOM est rendu par le navigateur, l'utilisateur reçoit la première indication que la page est vraiment en train de se charger.
Temps d'interactivité (TTI)
Le temps d'interactivité mesure le temps qu'il faut à un site Web pour devenir interactif et répondre aux entrées de l'utilisateur.
Indice de vitesse (IS)
L'indice de vitesse mesure la rapidité avec laquelle le contenu d'une page Web se charge et est visible. Il évalue la rapidité avec laquelle le contenu de l'utilisateur est affiché pendant le chargement de la page.
Temps de blocage total (TBT)
Le temps de blocage total compte le temps écoulé entre le First Contentful Paint (FCP) et le Time to Interactive (TTI) lorsque le thread principal a été bloqué suffisamment longtemps pour empêcher la réactivité des entrées.
Largest Contentful Paint (LCP) (peinture la plus importante)
L'indicateur Largest Contentful Paint mesure la vitesse de chargement du contenu principal d'un site Web. LCP mesure le temps écoulé entre le moment où l'utilisateur charge la page et celui où la plus grande image ou le plus grand bloc de texte est rendu dans la fenêtre d'affichage.
Déplacement cumulatif de la mise en page (CLS)
Le décalage cumulatif de la mise en page mesure la fréquence à laquelle les éléments Web se déplacent de manière inattendue pendant le rendu d'une page. Cette mesure est ensuite transformée en un score qui additionne tous les décalages de mise en page de votre page.
Opportunités
Cette section propose des conseils sur la manière d'augmenter les performances de votre site Web en améliorant les 6 paramètres.
Lighthouse vous aide à trouver les améliorations dont votre site Web pourrait avoir besoin et vous propose des suggestions sur la manière d'y parvenir.
Chaque site Web est différent et, pour cette raison, présente des opportunités différentes. Nous en avons répertorié quelques-unes ci-dessous :
- Réduire le JavaScript inutilisé
- Éliminer les ressources qui bloquent le rendu
- Supprimer les CSS inutilisés
- Dimensionner correctement les images
- Report des images hors écran
- Réduire le temps de réponse initial du serveur
- Évitez de servir les anciens JavaScript aux navigateurs modernes
- Utilisez HTTP/2
- Minimisez les CSS / Minimisez le JavaScript
Diagnostics
Cette section explique comment une page répond aux meilleures pratiques de développement Web.
Cette section identifie les pratiques recommandées que vous n'avez pas adoptées sur votre site Web et suggère des changements.
Comme les opportunités, les diagnostics vous fournissent également une liste utile pour la page auditée :
- Éviter les énormes charges utiles du réseau
- Éviter une taille excessive du DOM
- Minimiser le travail du thread principal
- Réduire le temps d'exécution du JavaScript
- Servir les actifs statiques avec une politique de cache efficace
Audits réussis
Plus vous en avez passé, mieux c'est. Les audits réussis vous indiquent les audits auxquels la page Web a été soumise. Par exemple, servez les images au format next-gen.
Cette catégorie mesure la facilité avec laquelle les utilisateurs peuvent accéder au contenu d'une page et s'y déplacer. L'accessibilité est un facteur très important pour un site web, car nous voulons que le web soit accessible à tous. Les personnes handicapées qui utilisent une technologie d'assistance pour commander quelque chose en ligne ne peuvent le faire que sur un site web qui a réussi l'audit (la plupart du temps). L'audit d'accessibilité est le plus complet et il n'y a pas d'intermédiaire. Sur les quelque 50 points contrôlés, un seul est accepté ou refusé. Comme l'audit de performance, il vous donne également une liste des sites qui ont réussi. Google vous fournit une liste de critères à vérifier pour réussir l'audit d'accessibilité.
Cette catégorie du rapport Lighthouse indique à Google si les développeurs Web respectent les normes de Google. Cet élément garantit que les développeurs Web utilisent les meilleures pratiques de développement Web sécurisé.
Ces vérifications vous indiquent où le code de votre application Web pourrait être plus sain en général.
- La page n'a pas le doctype HTML, ce qui déclenche le mode "quirks"
- Des erreurs de navigation ont été enregistrées dans la console
- Affiche des images avec un rapport d'aspect incorrect
- N'utilise pas le protocole HTTPS
L'audit des meilleures pratiques vous fournit également quelques conseils en matière de vitesse de navigation, comme nous l'aimons.
- N'utilise pas HTTP/2 pour toutes ses ressources
- Utilise document.write()
- Utilise des listeners passifs pour améliorer les performances de défilement
L'audit SEO de Lighthouse vérifie essentiellement si les moteurs de recherche peuvent comprendre le contenu de votre page Web et ce que vous pourriez faire pour l'optimiser.
Lighthouse vérifie si la page peut être explorée et indexée par les moteurs de recherche. Il vérifie également si la page est adaptée aux mobiles, car un grand nombre de recherches Google sont effectuées sur des appareils mobiles. Une liste de quelques points dans les vérifications :
- Le document n'a pas d'élément title
- Le document n'a pas de méta-description
- robots.txt n'est pas valide
- Le document n'a pas de balise meta name=viewport avec largeur ou échelle initiale
Cette catégorie vérifie si une application web peut être utilisée avec différents navigateurs. Cela signifie que votre application Web doit fonctionner sur tous les navigateurs. Comme pour les 4 autres audits, Google vous fournit une liste de contrôle qui vous donne un aperçu des performances de votre application Web.
Si vous commencez à mesurer votre site web, vous vous retrouverez bientôt au Lighthouse de Google. Les données de laboratoire utilisées par Lighthouse sont composées (environnement fixe). Notre agence SEO utilise Google Lighthouse car c'est un outil très puissant.Si vous souhaitez vérifier rapidement les performances de votre site Web et obtenir quelques résultats faciles à obtenir. Mais si vous voulez améliorer votre site Web du point de vue de l'expérience utilisateur, vous aurez besoin de données réelles sur les utilisateurs, car ce sont eux qui convertissent.
Réponse sous 24hrs
