2021
25/Mai

LCP ou Largest Contentful Paint

Dans le but de fournir à ses utilisateurs des résultats de recherche toujours plus pertinents, Google améliore sans cesse son algorithme de classement des sites web par des mises à jour. Parmi les plus grandes mises à jour effectuées par le moteur de recherche, nous pouvons citer celles qui concernent l’expérience utilisateur. Désormais, Google base ses critères sur des signaux liés à l’expérience utilisateur, dont le temps de chargement LCP ou Largest Contentful Paint.

                     

LCP ou Largest Contentful Paint : Définition

Le LCP ou Largest Contentful Paint désigne le temps nécessaire pour l’affichage du contenu principal apparaissant à l’écran à l’arrivée de la page. Il ne s’agit cependant pas du temps de chargement de l’intégralité de la page. Le LCP appartient aux Core Web Vitals de Google qui représentent des mesures de performances très importantes en matière d’expérience utilisateur. Quand cette métrique est de bonne qualité, cela est également le signe d’un contenu de page pertinent. Et dans le domaine du SEO, du contenu pertinent contribue à faire gagner quelques places à un site Internet dans les SERPs.

Une métrique qui vient compléter les lacunes des anciennes utilisées

La mesure de la vitesse d’affichage du rendu à l’écran sur un navigateur est un sujet qui a toujours préoccupé les développeurs. C’est la raison pour laquelle des métriques ont été utilisées par le passé pour leur permettre de connaître la performance de leur site. Auparavant, c’étaient les métriques comme load ou DOMContentLoaded qui ont été utilisées. Bien qu’existant toujours aujourd’hui, ces mesures de performances ne sont plus suffisantes. Celles-ci ne reflètent pas ce que l’internaute voit à l’écran.

En outre, d’autres mesures de performances plus récentes qui se focalisent sur l’utilisateur à l’instar du First Contentful Pain ou FCP. Par contre, celui-ci n’enregistre que le commencement du chargement. Par conséquent, dans le cas où une page affiche un indicateur de chargement, le FCP ne va pas représenter ce que l’utilisateur voit en vrai à l’écran.

Auparavant également, Google a conseillé l’utilisation du First Meaningful Paint, mais aussi du Speed Index qui est disponible dans les métriques webperf de Lighthouse. Par contre, il ne permet pas non plus l’identification à tout moment du chargement du contenu principal.

Google est donc parti du constat que le moyen idéal d’évaluer le temps d’affichage du contenu d’une page c’est lors du moment de rendu du plus grand élément de celle-ci. C’est de cette manière qu’est venue l’idée du Largest Contentful Paint par l’entreprise de Mountain View.

Comment reconnaître un bon Largest Contentful Paint ?

Le Largest Contentful Paint se mesure en seconde. Pour Google, un bon LCP fait moins de 2, 5 secondes. Tandis qu’un mauvais LCP fait plus de 4 secondes. Dans cette mesure, le moteur de recherche tient compte du chargement des images, des vidéos, mais aussi du texte.

À l’heure où la plupart des internautes sont sur mobile, la notion du LCP est très importante pour les professionnels du Web. En effet, les utilisateurs d’appareils mobiles ne sont pas toujours en possession d’une bonne connexion internet pour un affichage optimal du contenu de la page qu’ils consultent. Or, il existe encore aujourd’hui plusieurs sites qui présentent un LCP supérieur à 4 secondes, ce qui fait perdre beaucoup de trafic. Par conséquent, quand un site présente un LCP entre 2,5 et 4 secondes, une amélioration de page s’impose. Surtout avec la sortie prochaine de la mise à jour Core Web Vitals qui aura beaucoup d’influence sur la qualité et le référencement de site. Pour améliorer le Largest Contenful Paint, il faut optimiser le chemin de rendu critique, le CSS, les images, les web Fonts et le JavaScript du côté des clients.

Les éléments pris en compte pour le calcul du Largest Contentful Paint ?

Les éléments qui sont pris en compte pour calculer le LCP sont les suivants :

  • Les éléments images ou <img> ;
  • Les éléments images contenus dans un élément <svg> ;
  • Les éléments vidéos ou <video> ;
  • Les éléments avec une image de fond à partir de la fonction URL() ;
  • Les éléments Block-level qui contient des text nodes ou des éléments text inline dépendants.

À noter que Google limite de manière intentionnelle certains éléments qui sont pris en compte dans le calcul LCP pour faire simple. Les autres éléments s’ajouteront alors au fur et à mesure comme <svg>, <video>, etc.

Les outils pour mesurer le Largest Contentful Paint

Il existe plusieurs moyens de mesurer le Largest Contentful Paint. Généralement, ces données peuvent s’évaluer de deux manières : par les outils Lab et par les outils Field.

Les outils Lab sont les outils qui servent à simuler le chargement d’une page dans un environnement cohérent et contrôlé. Parmi les plus connus, nous pouvons citer Chrome DevTools, Lighthouse, et WebPageTest.

Les outils Field, quant à eux, se reposent sur l’expérience de véritables utilisateurs qui chargent et qui interagissent avec la page Web. Pour ce faire, il faut utiliser des programmes qui permettent un monitoring en temps réel tel que Chrome User Experience Report, PageSpeed Insights ou Search Console (Core Web Vitals report).

Ces deux outils présentent tous deux leurs avantages et aucun d’entre eux ne se montre meilleur que l’autre. Il est d’ailleurs recommandé d’utiliser les deux approches pour la garantie de meilleures performances.

Sinon, le LCP est également mesurable à partir du JavaScript comme les autres mesures de performances. Il s’agit d’ailleurs d’une façon plus rapide d’effectuer cette mesure grâce aux web-vitals JavaScript. Par contre, pour une mesure manuelle, cette démarche demande l’utilisation de l’API Largest Contentful Paint.

 

Si cet article vous a plu, nous vous invitons à découvrir notre agence de Référencement et à télécharger notre livre blanc « Placez le Search Engine Marketing au cœur de votre Stratégie d’Acquisition »

Ranja Randriambelo

Posté par

Ayant 8 années d'expériences dans le marketing, j'ai débuté en tant que téléconseillère pour chargée

Ranja Randriambelo

Contact Search Engine Marketing (SEM) :

Gabriel Dabi-Schwebel

gds@1min30.com
06 73 55 17 36





Commenter

Dépassez les objectifs de votre investissement Hubspot !
Rejoignez notre communauté et donnez-vous les moyens de réussir