Nouveaux critères Google : Core Web Vitals
Publié: 2020-12-01Mis à jour en mai 2021
Dans le marketing SEO, les entreprises, les blogs, les sites Web et les plateformes en ligne se font concurrence quotidiennement. Le haut de la liste de Google est l'endroit où ils veulent être.
Parmi les innombrables annonces sur Google, 90 % des sites répertoriés n'arrivent jamais en première page. Les 10% qui le font sont les publicités payantes, les graphiques de connaissances et une dizaine de listes organiques. La circulation entre eux est inégale. Moins de 3% des internautes arrivent aux résultats sur les pages de suivi.
Jusqu'à présent, les principaux mécanismes de marketing SEO influençant ont été les titres, le contenu, les balises de titre, les mots-clés, les descriptions d'images, les liens internes, les backlinks, etc. requis.
Core Web Vitals est en passe de devenir une composante déterminante des agences de référencement technique aux États-Unis . On peut également s'attendre à ce qu'il redéfinisse les résultats de recherche et il est susceptible de le faire. Alors que le marketing SEO traditionnel englobe essentiellement la pertinence, la distance et la proéminence, Core Web Vitals renforcera la valeur.
Table des matières
- Que sont les Core Web Vitals ?
- Les trois éléments de Core Web Vitals
- La plus grande peinture de contenu
- Premier délai d'entrée
- Changement de mise en page cumulé
- Métriques vitales Web de base
- Outils d'analyse de base Web Vitals
- Pourquoi l'optimisation de Core Web Vitals est-elle importante ?
- Conclusion
Que sont les Core Web Vitals ?
Les Core Web Vitals sont un ensemble distinct de mesures déterminant l'expérience utilisateur (UX) sur les sites Web. Ce dernier intègre trois mesures différentes de la vitesse de page et de l'interaction du nœud client. Le cumul de ces facteurs figurera dans un système de notation qui détermine la priorité qu'une page reçoit en tant que référencement.
Les trois éléments de Core Web Vitals
La plus grande peinture de contenu
Largest Contentful Paint (LCP) est une mesure créée par Google pour garantir la satisfaction des utilisateurs. Ce paramètre se concentre davantage sur les performances que sur la présentation. Si la page met trop de temps à se charger et que l'internaute s'en va, cela est jugé insatisfaisant.
Le temps de chargement de la page Web et les facteurs d'expérience Google tels que les balises d'image et les vignettes vidéo déterminent la note LCP. Les images d'arrière-plan avec CSS et des éléments de texte tels que des paragraphes, des en-têtes et des listes sont également surveillés pour la fluidité.
Causes d'un LCP médiocre
Temps de réponse du serveur lent
La vitesse de rendu d'un site Web dépend du temps de réaction d'un serveur. Plus le serveur est lent, plus il faudra de temps pour afficher quoi que ce soit sur l'écran d'un appareil.
La solution principale ici est d'optimiser votre serveur. La mise en cache des actifs et la mise en cache des fichiers HTML en premier accélèrent les processus de service. De plus, il est conseillé d'acheminer les utilisateurs vers un CDN à proximité. En établissant des connexions tierces tôt, la latence devient minimale, ce qui est important pour les sites Web réactifs mobiles.
Blocage du rendu CSS et JavaScript.
Les navigateurs fournissent du contenu en analysant les balises HTML dans une arborescence DOM. Si l'analyseur rencontre des feuilles de style externes, il s'arrête. Les scripts et les feuilles de style externes retardent la distribution des ressources de blocage, FCP et finalement LCP.
CSS et Java sont robustes et peuvent perdre « beaucoup de poids » grâce à la déférence, à la minimisation et à la minification. Les logiciels disponibles pour le compactage Java incluent UglifyJS2, Closure Compiler et YUI Compressor. CSSnano, UNCSS et CSSO sont tous des mécanismes capables de compresser CSS. Le temps d'optimisation du chargement s'améliorera avec le déploiement de ces outils.
Mauvais temps de chargement des ressources
Alors que l'augmentation de l'activité CSS et JavaScript produit de mauvais résultats, d'autres composants s'avèrent tout aussi problématiques. Les éléments affectant négativement LCP sont < image >, < img > et < video > et les composants de niveau bloc contenant des nœuds de texte.
L'optimisation et la compression des fichiers image et texte seront ici utiles. En préchargeant les ressources nécessaires et en mettant en cache les actifs, tout en utilisant un agent de service différent, le temps nécessaire est réduit.
Rendu final utilisateur
Les sites qui effectuent la majeure partie de leur rendu côté client perdent une bonne partie du contrôle. L'inconvénient de cette option devient évident avec l'utilisation de gros bundles JavaScript. Dans la plupart des cas, le contenu ne s'affiche pas tant que JavaScript n'a pas terminé son rendu ; cela compromettra les cotes LCP.
La minimisation de JavaScript est cruciale et le rendu côté serveur est préférable à celui côté utilisateur. Une autre solution est le pré-rendu qui aidera au moment de l'optimisation du chargement.
Premier délai d'entrée
Le premier délai d'entrée (FID) mesure le temps entre l'interaction initiale de l'utilisateur et le moment où le navigateur répond. C'est un facteur crucial pour savoir si le client quittera le site ou non. Les retards se produisent généralement lorsque le thread principal d'un navigateur est occupé.
Les fichiers JavaScript chargés par les applications locales sont généralement responsables des problèmes de FID. Ce qui se passe, c'est que les navigateurs tentent d'analyser et d'exécuter, mais une latence se produit, entraînant une absence de réponse sur les appareils finaux. Une note FID faible peut indiquer que le site ou la page en question est inutilisable.
Causes d'un mauvais FID
Javascript
Généralement, lorsque le thread principal est occupé, le navigateur ne peut pas répondre aux interactions. L'exécution lourde de JavaScript aggrave ce problème en imposant des retards sur la vitesse de chargement.
En divisant les tâches longues, vous pouvez réduire l'arriéré. De plus, limiter l'exécution de JavaScript devrait améliorer la réactivité. L'utilisation d'un web worker est également utile. Ce sont tous des moyens d'optimiser les mesures du site Web pour l'interaction.
Changement de mise en page cumulé
La métrique Cumulative Layout Shift (CLS) mesure la stabilité de la conception d'une page Web. Il fonctionne pour garantir que les interactions avec les clients se déroulent aussi naturellement que possible. Les internautes subissent souvent des interruptions ou des sauts lors de la visualisation du contenu d'un site. Par conséquent, cela conduit à une rupture de concentration et crée une mauvaise expérience.
L'inconvénient est le résultat d'une mauvaise conception. Les effets prévalent sur les sites Web réactifs mobiles et les navigateurs de bureau.
Le manque d'éléments de conception corrects provoque une instabilité visuelle. Ce dernier a tendance à forcer des changements de mise en page soudains, ce qui oblige souvent l'utilisateur à cliquer par inadvertance sur un contenu indésirable. Des exemples typiques sont les sites avec des publicités pop-up.
Les nouveaux designs, même s'ils sont correctement structurés, peuvent également ralentir les pages Web. L'algorithme de Google compense en autorisant une omission de 500 ms avant de commencer son processus de calcul.
Causes courantes du SLC
Images sans dimensions
L'exclusion des attributs de largeur et de hauteur pour la vidéo et les images se traduira par un classement faible. Beaucoup de gens ne réservent pas d'espace pour les médias, ce qui entraîne des sauts et des changements.
La solution ici est simple; incluez toujours la largeur et la hauteur. L'autre option est les boîtes de rapport d'aspect CSS. Ils sont pratiques pour la réservation d'espace sur les sites Web. C'est particulièrement utile sur les sites qui hébergent des publicités.
Annonces, intégrations et iframes sans dimensions
Les publicités contribuent largement au problème. Les réseaux publicitaires optent pour le dimensionnement dynamique par opposition à la variante statique, qui augmente le trafic vers les sites Web. Malheureusement, cela se fait au détriment de l'expérience de bureau ou mobile.
Certains widgets permettent d'intégrer des éléments tels que des vidéos, des cartes et du contenu de médias sociaux dans la page Web. Le problème ici est que le site n'a souvent aucune idée de la taille exacte ou de la composition de l'intégration. En ne réservant pas d'espace, l'instabilité devient apparente une fois la page chargée.
Le pré-calcul des besoins spatiaux nécessaires pour un encastrement ou un repli du site évite le péril de CLS. Les outils de développement de navigateur sont pratiques pour obtenir la hauteur et la largeur du résultat. Après avoir établi cela, l'iframe s'adaptera automatiquement à l'espace réservé à chaque chargement de la page.
Contenu injecté dynamiquement
Les éléments nouvellement insérés sur d'anciens supports sont également ce qui crée des changements de mise en page. Des exemples typiques de ceux-ci sont les bannières d'appel à l'action. Non seulement ils bloquent l'interaction, mais ils irritent plutôt qu'ils ne convainquent.
Encore une fois, réservez de l'espace. De plus, les concepteurs de sites peuvent ajouter un squelette d'interface utilisateur. Ce dernier est un espace réservé qui empêchera le texte de migrer lors du chargement de l'image.
Polices Web causant FOIT/FOUT
Le téléchargement et le rendu des polices de caractères Web sont essentiels à un Flash of Unstyled Text (FOUT). Dans ce cas, un nouveau style remplace l'impression de secours.
Une conséquence supplémentaire est Flash of Invisible Text (FOIT) qui masque la police jusqu'à ce qu'un nouveau cas soit disponible.
L'API de chargement de police réduit le temps nécessaire pour obtenir les styles de lettrage nécessaires, minimisant ou éliminant ainsi l'occurrence de FOUT et FOIT.
Métriques vitales Web de base
Comme indiqué, les trois éléments Core Web Vital ont des mesures individuelles. Chacun classé selon différentes normes de temps.
- Une bonne cote LCP est inférieure à 2,5 s. Google accordera la clémence pour tout ce qui a moins de 4 ans, mais cela signifie toujours qu'il y a place à l'amélioration.
- L'unité de mesure du FID est la milliseconde et si le temps entre l'entrée de l'utilisateur et la réaction de la page Web est inférieur à 100, c'est l'idéal. Une métrique de 300 ms est acceptable, mais elle laisse entrevoir des problèmes à venir. Tout ce qui dépasse 300 ms entraîne la relégation de la liste Web.
- La lecture idéale pour CLS est zéro. Les algorithmes de Google accepteront 0,1, mais comme l'acceptabilité maximale est de 0,25, cela crée une trop petite marge de flexibilité. Les administrateurs du site Web peuvent également viser la perfection complète.
Outils d'analyse de base Web Vitals
- Web Vitals For Chrome est comme n'importe quelle autre extension, et certains pourraient ne pas être à l'aise avec cette option en raison de problèmes de confidentialité.
- Page Speed Insight est une interface simple vous permettant de basculer entre les options de bureau et mobiles. Les résultats des PC et des appareils intelligents diffèrent quel que soit le logiciel d'analyse que vous utilisez. Ce qui précède produit des données de terrain d'utilisateurs réels de Google sur 28 jours.
- Les outils de développement Chrome et les conceptions de Lighthouse leur permettent de surveiller LCP et CLS. Malheureusement, le même logiciel n'est pas capable de mesurer le FID, mais pour cela, il existe le TBT.
Au fur et à mesure que Core Web Vitals prolifère, de plus en plus d'outils de surveillance feront leur apparition.
Pourquoi l'optimisation de Core Web Vitals est-elle importante ?
La mise à jour principale de Google est prévue pour mai 2021. Cela signifie qu'à partir de ce moment-là, les signaux SEO habituels ne seront plus suffisants pour maintenir un classement élevé sur Google.
C'est une implémentation d'un standard prônant une UX de qualité. Les sites en phase avec les nouveaux critères ne seront pas impactés. Les pages Web qui ne se sont pas ajustées en ressentiront certainement les effets, malgré l'efficacité de leur référencement. Les listes avec des Core Web Vitals faibles chuteront dans le classement, laissant la place aux entités conformes.
Conclusion
En établissant une nouvelle réglementation dans le marketing SEO, Google ouvre la voie à l'amélioration. La norme Core Web Vital est la première, et bien d'autres suivront certainement. Ces mesures créent une plate-forme pour qu'une nouvelle ère d'Internet fusionne avec d'autres technologies parfaitement émergentes. De plus, vous pouvez utiliser ces conseils pour augmenter la vitesse de chargement de votre site Web.