Tout comprendre sur le Core Web Vitals

Temps de lecture : 6 minutes

Par Alexandre Montenon, content manager SEO et formateur en rédaction web depuis 2011.

Google ne cesse d’innover dans sa démarche d’améliorer l’expérience utilisateur (UX), mais aussi la vitesse de chargement des différents sites internet. Toutefois, ce n’est pas une initiative nouvelle.

En effet, c’est un effort continuel que le géant américain réalise. Core Web Vitals s’affiche comme la dernière nouveauté de Google sur la longue liste de ces fameuses initiatives.

Les CWV vise à élaborer des critères unifiés et simples au sujet de ce qu’est une bonne expérience web. Je t’explique tout ci-dessous !

Core Web Vitals

3 types de Core Web Vitals à connaître

Avec l’invention des CWV, Google a voulu rendre plus accessible aux personnes avec peu de connaissances techniques, l’identification des soucis au niveau de l’expérience utilisateur (UX).

Les problèmes d’ordre de l’optimisation de la performance Web Front-End Optimization ou WPO devraient également être résolus grâce aux CWV. Par ailleurs, toute agence de référencement naturel devrait savoir le principe des Core Web Vitals qui repose sur 3 indicateurs :

Largest Contentful Paint ou LCP

Cet indicateur mesure entre autres le temps de chargement du contenu d’une page. Il marque l’instant précis où l’élément le plus massif du contenu au-dessus du pli est chargé entièrement. D’une manière générale, un bon LCP dure environ 2,5 secondes. Afin d’optimiser le LCP d’un site web, voici quelques indications dont l’application pourra être utile :

ø Le passage à un serveur plus rapide : il est à souligner que plus le serveur met du temps à lire les divers éléments sur l’écran, plus les secondes mesurées par le LCP augmentent. Un chargement en premier des pages HTML mises en cache peut être une bonne initiative pour gérer les réponses du serveur.

ø La désactivation de certaines balises HTML : il est tout à fait possible qu’au sein de l’arbre DOM (Document Object Model), il y ait des blocages. Ces derniers sont décelés par les algorithmes qui analysent le site web de manière générale.

ø La compression des images : ces dernières seront chargées en mode lazy-loading afin de pallier au problème de lenteur du chargement des différentes ressources volumineuses. L’activation de la mise en cache pour les utilisateurs qui ont déjà visités la page web est également une bonne idée.

ø La suppression des JavaScript critiques ainsi que les techniques de pré-rendu : cela réglera de façon intéressante le souci de l’utilisateur qui devra attendre l’entière chargement du contenu avant de réaliser n’importe quelle action sur le site web. Ce problème est rencontré sur les sites développés avec une logique JavaScript qui se base sur le rendu orienté utilisateur.

First Input Delay ou FID

L’indicateur FID est basé sur le framework Response Animation Idle Load ou RAIL. Il mesure notamment la réactivité d’une page Web. Cette notion de réactivité est en fait le temps qui s’écoule entre l’instant où l’utilisateur réalise une action comme un clic et le moment où le navigateur réagit à cette interaction.

On juge de l’excellence d’un FID lorsque ce dernier est égal à au moins 0,1 seconde. Ce qui équivaut à 100 millisecondes. Dans le but d’atteindre un tel résultat, il est vivement recommandé de na pas faire usage du script JS indépendant des autres scripts, répondant au nom de Web Worker.

Ce script en question s’exécute généralement en arrière-plan d’une page HTML.

Cumulative Layout Shift ou CLS

CLS qui veut dire « décalage cumulatif de mise en page », est un indicateur qui sert notamment à mesurer la satabilité visuelle au sein d’un site web. En pratique, les éléments qui figurent sur une page se déplacent au fur et à mesure que le contenu de la page en question se charge.

Cette situation représente en général une expérience lassante pour l’utilisateur. Le phénomène incite le plus souvent ce dernier à cliquer n’importe où. Ce qui peut conduire à des sélection à de;mauvais endroits sur la page.

Toute cela participera à rendre l’expérience utilisateur encore plus pesante et désagréable. Ce n’est certainement pas ce que Google, et même les propriétaires de site, désirent.

Le CLS reprend notamment les mesures déjà faites par d’autres outils comme PageSpeed Insights qu sujet des éléments du temps de chargement des pages comme le content-paint ou encore le Time-to-interactive.

Ce qui différencie le travail du CLS c’est qu’il quntifie l’ampleur et aussi la fréquence avec laquelle ces éléments en question s’activent sur une page web. Le score enregistré par le CLS varie notamment entre 0 et 1. 0 indique une absence de déplacement, tandis que 1 équivaut à la quantité maximale de déplacement.

Les principaux objectifs de la mesure CLS est d’aider les concepteurs de sites Web à améliorer le référencement naturel de leur œuvre, mais également l’expérience utilisateur. En somme, on peut tout à fait dire qu’un site présentant un faible CLS est un site « agréable ».

L’importance des CWV pour les utilisateurs et aussi pour Google

Les Core Web Vitals sont partis pour être des indicateurs de premier choix pour aider Google à rendre l’expérience utilisateur plaisante. Cela encouragera les internautes à continuer à utiliser le célèbre moteur de recherche.

L’amélioration de la performance Web Front-End Optimization est aussi de l’ordre des bénéfices de l’usage de ces fameux CWV.

D’autre part, en ce qui concerne l’importance de ces indicateurs pour les utilisateurs, on peut tout à fait distinguer le fait que ces derniers auront le plaisir de profiter pleinement de leur navigation.

Grâce à des paramètres nettement améliorés, les internautes vivront un surf des plus agréables. Enfin, les propriétaires de sites Web pourront également tirer un certain bénéfice de l’usage des CWV. Ils pourront aisément profiter d’une fidélisation de leurs visiteurs par le biais de cette fameuse amélioration de l’UX.

Comment mesurer les Core Web Vitals ?

Afin de mesurer les Core Web Vitals, il sera question de l’usage de certains outils. Ces derniers permettront entre autres de voir les données d’un site web. Parmi les outils à connaître, on peut distinguer :

ø Pagespeed Insights: il propose une analyse des pages présentant des problèmes ayant une incidence négative sur les signaux Web essentiels.

ø Chrome DevTools : une nouvelle section de cet onglet offre la possibilité de déceler les changements de mise en page inattendus.

ø Google Search Console : un nouveau rapport « signaux web essentiels » est proposé par la Search Console afin de permettre l’identification des groupes de pages qui demandent une attention particulière.