Au début d’Internet, les moteurs de recherche se contentaient de parcourir le World Wide Web pour trouver les mots-clés saisis. Cela produisait souvent des résultats insatisfaisants, et de brillants «spécialistes SEO» ont tenté de duper les moteurs de recherche au moyen d’innombrables ruses.
Google a réagi alors en développant différents algorithmes toujours plus complexes, conçus non seulement pour explorer le Web à la recherche des mots-clés, mais également pour contrôler la pertinence des sites. En outre, le géant du Net a procédé à des améliorations constantes afin de refléter encore plus précisément le comportement de lecture des internautes: les algorithmes se sont adaptés aux habitudes des utilisatrices et utilisateurs.
Les éléments déterminants dans l’analyse des sites Web sont toujours les contenus, ainsi que leur qualité et, surtout, leur pertinence. Aujourd’hui encore, les sites au design attrayant, régulièrement actualisés, qui contiennent des titres accrocheurs, des textes parfaitement rédigés et riches en informations, des images, des vidéos et des possibilités d’interaction gardent l’avantage par rapport aux sites «faits maison» ou désuets.
Mais de nouveaux critères ne cessent de s’ajouter. Certes, les sites doivent permettre aux internautes de trouver l’information importante pour eux, mais ils doivent aussi être suffisamment bien conçus d’un point de vue technique pour que les contenus s’affichent vite et impeccablement, tant sur les ordinateurs de bureau que sur les mobiles. Autrement dit, l’expérience utilisateur ou, en anglais, la «user experience» (UX) compte de plus en plus comme l’un des principaux critères de classement d’un site en tête des résultats.
Core Web Vitals: la qualité technique traduite en chiffres
À l’été 2021, Google a lancé la «Page Experience Update», une mise à jour qui a introduit une nouvelle approche d’analyse des sites Web et dont l’impact commence à se faire réellement sentir depuis quelques mois. Les Core Web Vitals sont une composante clé de cette mise à jour: à travers plusieurs critères, il s’agit de mesurer la qualité de l’expérience utilisateur dans les toutes premières secondes de visite d’un site. Google calcule les scores obtenus sur toutes les plateformes possibles (ordinateur de bureau, tablette, smartphone, etc.), puis en tire une moyenne. Un site doit en effet garantir la meilleure expérience utilisateur possible à tous les internautes.
Les Core Web Vitals comprennent les trois principales métriques suivantes:
Largest Contentful Paint (temps de chargement)
Le «Largest Contentful Paint» (LCP) mesure le temps nécessaire pour que l’élément le plus important en taille s’affiche à l’écran. La valeur ne porte pas sur la quantité de données, mais sur la visibilité réelle de l’élément de contenu dans le navigateur. Cet élément correspond généralement à du texte, des images ou une vidéo. Google a fixé la valeur LCP optimale à 2,5 secondes à partir du début du chargement de la page. Les plus gros éléments étant bien souvent chargés en dernier, le LCP constitue un critère d’analyse fiable.
Auparavant, Google utilisait principalement le «First Contentful Paint» (FCP) pour mesurer le temps de chargement. Mais cette valeur tenait compte uniquement du temps nécessaire à l’affichage du premier bloc de contenu d’une page. Désormais, Google considère à la fois le FCP et le tout récent LCP pour évaluer la qualité globale de l’expérience de chargement. En cas de problème avec la métrique LCP, Google continue à se référer au FCP pour pouvoir établir un diagnostic détaillé.
Google avait également introduit la valeur «First Meaningful Paint» (FMP), soit le temps nécessaire à l’affichage du premier bloc «significatif», mais la tentative s’est avérée trop complexe et donc inutilisable. FMP dépendait des réglages spécifiques du navigateur et ne permettait donc pas d’établir une mesure standard. À l’usage, cette métrique est apparue également trop sensible aux légères variations du temps de chargement d’une page. Les résultats des tests étaient tout simplement trop incohérents pour fournir une indication fiable.
First Input Delay (interactivité)
L’indicateur «First Input Delay» (FID) mesure le temps écoulé entre le moment où un utilisateur interagit pour la première fois avec une page, et le moment où le navigateur répond. Trop souvent, nous voyons le contenu de la page s’afficher, mais les éléments d’interaction comme les champs de connexion ou les liens ne fonctionnement pas encore. Cela n’est pas forcément dû au serveur qui héberge le site: lorsqu’une page demande l’exécution simultanée d’un trop grand nombre de tâches par le navigateur, par exemple parce qu’elle contient de gros fichiers JavaScript, certains processus peuvent être ralentis. Google exige donc que l’action de l’internaute sur la page entraîne une réponse visible et efficace en un dixième de seconde maximum.
Remarque importante:
Le First Input Delay (FID) a été remplacé le 12 mars 2024 par l’Interaction to Next Paint (INP) en tant que Core Web Vital.
Pour tous les autres outils tels que PageSpeed Insights et CrUX, il y aura une phase de configuration de six mois à partir de cette date, afin que les développeurs puissent mettre à jour leur code. Vous trouverez de plus amples informations ici.
Cumulative Layout Shift (stabilité visuelle)
Les éléments d’une page bougent pendant le chargement? Nous avons tous fait l’expérience de ce phénomène, en particulier sur les portails d’actualité lors de l’affichage de publicités. Une page qui se charge rapidement est une bonne chose, mais si elle contient un élément qui met plus de temps à s’afficher, cela peut entraîner le décalage de certains éléments de mise en page (les «layout shifts»). Ces mouvements sont perturbants et surtout agaçants, car il arrive que l’internaute clique sur un élément de la page, mais juste un peu trop tard, et atterrisse alors sur un autre site qui ne l’intéresse pas du tout. Google mesure les décalages de mise en page avec l’indicateur Cumulative Layout Shift (CLS) et enregistre instantanément les déplacements de tout élément de la page. Cet indicateur tient compte non seulement de la fréquence et de l’impact visible des décalages sur la page, mais également de la distance parcourue par les éléments instables.
Comment faire pour mesurer les Core Web Vitals de mon site?
Pour réaliser un audit des Core Web Vitals de votre propre site, il suffit d’utiliser la Search Console de Google ou la toute dernière version du navigateur navigateur Google Chrome. Lancez l’affichage du site Web souhaité puis, dans le menu de navigation en haut de la page, sélectionnez Afficher > Options pour les développeurs > Outils de développement. Dans la fenêtre qui apparaît, sélectionnez Lighthouse et cliquez sur le bouton Générer un rapport.
Google propose également d’autres outils de développement pour analyser les Core Web Vitals, comme PageSpeed Insights ou Measure page quality. Les utilisateurs chevronnés peuvent s’en servir afin d’analyser et d’optimiser leur propre site Web.
| Temps de chargement (LCP) |
Interactivité (FID) |
Stabilité visuelle (CLS) |
|
|---|---|---|---|
| PageSpeed Insights | ✓ | ✓ | ✓ |
| Rapport Chrome UX | ✓ | ✓ | ✓ |
| Search Console | ✓ | ✓ | ✓ |
| Chrome DevTools | ✓ | Total blocking time | ✓ |
| Lighthouse | ✓ | Total blocking time | ✓ |
| Extension Web Vitals | ✓ | ✓ | ✓ |
Google met à disposition les outils nécessaires pour surveiller les Core Web Vitals. Tableau élaboré d’après: web.dev.
Comment améliorer les Core Web Vitals?
Pour optimiser les valeurs des Core Web Vitals, il est préférable de posséder certaines compétences techniques. Malgré tout, vous pouvez agir sur certains aspects, comme la compression des images, même si vous êtes relativement novice dans la gestion de site Web. Découvrez ci-après les principaux conseils pour améliorer les valeurs des Core Web Vitals:
LCP: charger plus rapidement les éléments volumineux
- En choisissant d’utiliser un framework plutôt que de lourdes pages HTML, vous maîtrisez davantage le temps d’affichage des différents éléments.
- Misez sur un service d’hébergement Web offrant une infrastructure rapide comme Hostpoint.
- N’abusez pas du code JavaScript.
- Les images «légères» sont plus rapides à charger. Cela vaut la peine de compresser les photos et de les enregistrer dans des formats d’image récents comme WebP. La mise en cache au niveau du serveur et du navigateur permet d’accélérer l’affichage des pages.
- Faites en sorte que les images situées en dehors de la première zone d’affichage visible (premier «viewport») ne se chargent qu’au moment où l’internaute fait défiler l’écran jusqu’à leur niveau (technique du «lazy loading», ou chargement paresseux en français). Généralement, la valeur LCP s’en trouve déjà nettement améliorée.
FID: priorité à l’interactivité
- Tout est plus rapide si vous divisez les tâches longues: pendant l’exécution d’un script JavaScript, le navigateur ne traite pas d’autres tâches. Dans tous les cas, évitez absolument les délais de traitement supérieurs à 50 millisecondes.
- Affectez une priorité supérieure au chargement des éléments de code interactifs. De cette façon, l’utilisateur n’aura pas besoin d’attendre trop longtemps pour agir.
- Laissez un «Web Worker» travailler en arrière-plan pour exécuter les tâches complexes.
CLS: pas de contenus instables dans la page
- Spécifiez les dimensions des images intégrées dans le code HTML source du site. Cela permet au navigateur de réserver l’espace adéquat dès le moment où il charge la mise en page.
- Évitez si possible d’utiliser des bannières publicitaires, des contenus intégrés et des iFrames sans indication de dimension.
- Utilisez des espaces réservés pour les contenus dynamiques et les annonces publicitaires.
- La fonctionnalité de préchargement «Preload» évite au navigateur d’avoir à charger les fichiers de police au moment où l’internaute accède à la page. Elle permet de charger les polices au préalable comme des éléments HTML.
- Définissez des polices «Fallback»: en attendant de charger la police paramétrée dans le site Web, le navigateur lui substitue une police système. Choisissez une police système dont les caractéristiques visuelles se rapprochent le plus possible de la police définitive afin que le décalage de mise en page soit minime (le score CLS sera d’autant plus réduit). Ainsi, pour une police Sérif, vous ne devez donc pas définir une police Sans sérif en tant que Fallback (et inversement).
Google propose en outre toutes sortes de conseils pour optimiser les Web Core Vitals. Vous pouvez les consulter sur https://web.dev/optimize-lcp, https://web.dev/optimize-fid et https://web.dev/optimize-cls.
Quid des autres facteurs de classement?
Attention: les indicateurs Core Web Vitals ne sauraient remplacer tous les autres facteurs qui impactent également le classement d’un site dans la liste des résultats de recherche. De nature complémentaire, les Core Web Vitals se rapportent principalement à la vitesse de chargement d’un site. Les critères ci-après restent déterminants eux aussi:
- Optimisation pour les appareils mobiles: un site qui s’ouvre sur un téléphone portable comme une simple version réduite de l’original pour ordinateur part d’emblée avec un handicap dans Google, surtout si son contenu ne tient pas dans l’écran et n’est donc visible qu’en partie.
- HTTPS: pour Google, une connexion non sécurisée entre le navigateur de l’internaute et le serveur Web (http au lieu de https) justifie de reléguer le site à un rang inférieur dans le classement. Les clients de Hostpoint peuvent activer le certificat FreeSSL gratuit de Let’s Encrypt.
- Pas d’interstitiels envahissants: les «Interstitials», ces fenêtres publicitaires qui s’affichent de manière intempestive, interrompant la consultation du site, sont pénibles pour l’internaute, mais aussi pour Google. En revanche, les pop-ups destinés à informer sur les cookies, à demander confirmation de l’âge de l’internaute et à d’autres réglages similaires ne constituent pas des facteurs négatifs.
L’essentiel du SEO grâce à rankingCoach
Si vous ne voulez/pouvez pas rentrer dans le détail des Core Web Vitals, des solutions existent pour vous simplifier la tâche. Les critères SEO essentiels et classiques n’ont pas énormément changé. Et la bonne nouvelle, en particulier pour les débutants, c’est qu’il existe des utilitaires efficaces et des boîtes à outils complètes, comme rankingCoach de Hostpoint. Ainsi équipés, même les novices peuvent tester le classement d’un site Web par les moteurs de recherche selon les critères de Google. Vous avez également à votre disposition des conseils et des astuces utiles qui vous permettront d’optimiser le classement de votre propre site. L’outil rankingCoach propose des listes de tâches, des tutoriels et des vidéos pour vous aider à faire apparaître votre site dans les toutes premières occurrences de recherche Google.
