Comprendre les métriques de performance de Lighthouse - Conseils SEO de Semalt



Les mesures de performance Lighthouse sont quelque chose que vous êtes susceptible de rencontrer lorsque vous discutez des aspects techniques du référencement. Vous vous demandez peut-être en quoi consiste ce test ou comment exécuter le test sur les performances de votre site Web. Vous pourriez aussi être ici parce que vous voulez découvrir ce qu'est Lighthouse.

Nous utilisons ce test de mesure de performance dans notre tentative de rendre tous les chiffres relatifs à votre site verts. Voici tout ce que vous devez savoir sur Lighthouse.

Qu'est-ce que le phare

Lightroom est un outil d'audit open source utilisé pour produire des scores standardisés dans cinq domaines clés, à savoir:
  • Performance
  • Application Web progressive
  • SEO
  • Les meilleures pratiques
  • Accessibilité
Pour cet article, le nom "Lighthouse" sera utilisé pour désigner une série de tests, ne vous trompez donc pas en lisant.

Lighthouse exécute des tests de performances à l'aide de données de laboratoire, également appelées données émulées. Il s'agit des données de performance d'un site collectées dans un environnement artificiel avec des périphériques et des paramètres réseau prédéfinis. Les données de performances sont importantes car elles fournissent les informations nécessaires pour déboguer les problèmes de performances. L'expérience sur la machine locale dans un environnement contrôlé est conçue pour imiter l'expérience d'utilisateurs réels.

Mise à jour vers Lighthouse

Le 5 mai 2020, le projet Chromium a annoncé son ensemble de trois métriques que l'open source soutenu par Google pourrait utiliser pour mesurer les performances. Les métriques étaient appelées Web Vitals. Ils font partie de l'initiative de Google, conçue pour fournir des conseils collectifs aux experts SEO lors de la recherche de signaux de qualité.

Ces métriques sont conçues pour mesurer les performances Web d'une manière centrée sur l'utilisateur. En seulement deux semaines après son lancement initial, Lighthouse V6 a lancé sa version modifiée avec Web Core Vitals comme objectif principal de cette mise à jour.

En juillet 2020, nous avons vu la métrique de Lighthouse v6 être adoptée dans de nombreux produits Google avec la sortie de Chrome 84. Le panneau Chrome DevTools Audit a également été renommé Lighthouse. La métrique Lighthouse a également été référencée par PageSpeed ​​Insights et Google Search Console.

Aujourd'hui, Web Core Vitals représente plus de la moitié du score total de performance pondéré de Lighthouse. De manière générale, les pages commencent à avoir un impact minimal, avec environ 83,32% des tests effectués montrant un passage de dix points ou moins au V6.

Ce que vous devez savoir avant d'exécuter le test de performance à l'aide de Lighthouse

Choisir la bonne méthodologie

La méthodologie que vous choisissez pour marcher avec les choses. Les audits Lighthouse sont configurés pour analyser une page à la fois. Mais le fait est qu'un score de page unique n'est pas la représentation des performances de l'ensemble de votre site, et ce n'est pas parce que votre page d'accueil se charge rapidement que votre site se charge aussi rapidement.

La meilleure façon d'obtenir une estimation globale des performances d'un site est de tester plusieurs types de pages au sein de votre site. Ici, nous identifions d'abord les principaux types de sites, modèles et points de conversion des visiteurs (ils se réfèrent aux pages d'inscription, d'abonnement et de paiement).

Avant de passer à l'étape d'optimisation de notre analyse, nous exécutons Lighthouse sur chacune des pages d'échantillons sélectionnées au hasard et enregistrons les données collectées. À partir de ces données, nous pouvons maintenant créer une liste de tâches basée sur les améliorations les plus urgentes aux moins urgentes. Pour éviter la perte de données, nous enregistrons les résultats JSON et nous nous appuyons sur la visionneuse Lighthouse chaque fois que nous avons besoin d'informations détaillées sur les résultats.

Récupérer le backlog avec un excellent retour sur investissement

Au fil des ans, une chose que nous avons apprise avec certitude est que l'obtention des ressources nécessaires à l'action SEO n'est pas simple. Avoir un référencement interne n'est pas vraiment utile car ils sont souvent détruits par la difficulté à obtenir un ticket en retard. D'après notre expérience, nous savons que la meilleure façon de graisser les engrenages est de prioriser les initiatives de performance, ce qui se traduit par d'excellents chiffres qui soutiennent l'investissement effectué au service SEO.

Les données qui arrivent à la fin du mois, les feuilles de compte deviendront les signes dollar qui justifient et récompensent nos efforts de développement. La réalisation de ce test est importante car, ce faisant, vous risquez d'avoir plusieurs zones marquées, en particulier lorsque c'est la première fois. C'est bon. Vous pouvez consulter le calculateur de score Lighthouse pour voir quels changements auront les plus gros effets.

Comment exécuter un test de phare

C'est le cas de nombreux chemins menant à une rivière. Cependant, il existe certains chemins qui se révèlent être plus faciles ou plus importants à utiliser. Eh bien, si vous espérez intégrer le test SEO dans le processus de réalisation, vous devriez probablement être mis à jour sur NPM.

Avez-vous moins de 5 minutes avant que l'on vous demande de faire face au tableau? Ces rapports individuels devraient vous donner les munitions dont vous avez besoin pour les convaincre que votre SEO va très bien. Quelle que soit la méthode d'exécution que vous choisissez, le mobile est excellent, sauf si vous avez un cas d'utilisation spécial pour le bureau.

1. Chrome Devtools

Nous testons chaque page individuellement à l'aide du panneau Chrome DevTools Lighthouse. Ce rapport est essentiel car il émule une expérience utilisateur en utilisant le navigateur même en mode incognito ou avec le cache du navigateur désactivé.

Notre façon particulière d'aborder cela est de créer un profil Chrome pour le test, mais de le garder local. Cela signifie qu'aucune synchronisation n'est activée, aucune sauvegarde de mot de passe ou aucune association à un compte Google existant. Nous n'installons pas non plus d'extensions pour l'utilisateur.

Lorsque vous êtes prêt, voici comment tester Lighthouse à l'aide de DevTools
  1. Exécutez une instance de navigation privée sur Chrome.
  2. Accédez au panneau Réseau dans DevTools et cochez la case pour désactiver le cache. Vous pouvez le faire avec Ctrl + Maj + I sous Windows et Linux ou Commande + Option + I sur Mac.
  3. Accédez au panneau Lighthouse et cliquez sur générer un rapport.
  4. Enregistrez le fichier une fois généré.
Quels sont les avantages de l'exécution de Lighthouse depuis Devtools?

Comme nous l'avons mentionné précédemment, il existe de nombreuses façons d'exécuter l'analyse des phares. Cela signifie également que chaque méthode a ses avantages et ses inconvénients.

L'avantage de cette méthode est que
  • Vous pouvez tester les versions locales et découvrir quelles pages sont authentiques.
  • Les rapports enregistrés peuvent être comparés à l'outil Lighthouse CI Diff.
Inconvénients de l'exécution de Lighthouse depuis DevTools
  • Vous ne pouvez créer qu'un seul rapport à la fois.
  • Vous devrez enregistrer chaque rapport manuellement.

2. Lors du test continu des mêmes pages

Supposons que vous aimiez tester les mêmes pages à plusieurs reprises, Web. dev est le choix idéal. C'est similaire à l'utilisation de DevTools uniquement que vous n'avez pas besoin de désactiver toutes ces extensions de pointe. Cette méthode est fondamentalement simple. Tout ce que vous avez à faire est:
  1. Visitez web.dev/measure/
  2. Connectez-vous avec votre compte Google.
  3. Saisissez l'URL de la page que vous souhaitez auditer.
  4. Cliquez sur exécuter l'audit.
Avantages de l'exécution de Lighthouse à partir du Web. dev
  • Il capture la chronologie astucieuse des résultats de la page.
  • Les utilisateurs ont des liens rapides sur les guides pour améliorer les problèmes.
  • Les rapports peuvent être comparés à l'aide de l'outil Lighthouse CI Diff.
Inconvénients de l'exécution de Lighthouse à partir du Web. dev
  • Vous ne pouvez effectuer qu'une seule analyse et avoir un rapport à la fois.
  • Vous devez avoir un enregistrement des URL que vous avez suivies au fil du temps pour éviter de refaire la même URL sans le vouloir.

La ligne de commande Node pour Lighthouse

Lorsque vous cherchez à tester à grande échelle, la ligne de commande du nœud est l'approche préférée. Voici un guide sur ce qu'il faut faire:
  • Installez npm: pour les utilisateurs de mc, il serait sage d'utiliser homebrew afin d'éviter les problèmes de dépendance stupides.
  • Installez le module phare en saisissant simplement ce code: "npm install -g phare".
  • Vous exécutez ensuite un seul texte en utilisant "phare <url>".
  • Exécutez des tests sur des listes d'utilisations en exécutant le test par programme.
Avantages de l'exécution de Lighthouse depuis Node
  • Vous pouvez exécuter plusieurs rapports à la fois.
  • Vous pouvez le programmer pour suivre automatiquement les changements au fil du temps.
Inconvénients de l'exécution de Lighthouse depuis Node
  • Vous devez avoir une idée de la façon de coder.
  • Sa mise en place demande du temps.

Conclusion

La complexité des mesures de performance est un indicateur des défis auxquels chaque site est confronté. Nous nous appuyons sur des mesures de performance comme proxy pour l'expérience utilisateur. Cela nous permet de suivre le chemin d'un utilisateur et de voir ce qu'il voit, d'expérimenter ce qu'il vit chez les autres pour créer des sites plus réactifs.

Certains autres outils tels que l'outil de test Mon site et What does My Site Cost by Google peuvent également être utiles. Nous utilisons ces outils pour faire la conversion et des arguments centrés sur le client pour l'importance de la performance dans un site.

J'espère qu'une fois que votre projet aura gagné du terrain, nous pourrons expliquer ce que la performance métrique unique de votre phare signifie à votre équipe d'ingénieurs qualifiés et collaboratifs.

Intéressé par le référencement? Consultez nos autres articles sur le Blog Semalt.

mass gmail