Nous avions déjà abordé la question du Cumulative Layout Shift en détail dans cet article sur le CLS., mais laissez-vous vous faire un second résumé de cette metric.

Le CLS mesure les temps de décalage des blocs de mise en page lors du chargement du site ou d’interaction avec les éléments de la page.
La valeur fournie par la Search Console et PageSpeed Insights (efficace pour mesurer cette metric) correspond au total des délais de tous les décalages constatés sur l’ensemble de la page.
Un score de zéro signifie qu’il n’y a aucun décalage au moment du chargement et c’est ce résultat que vous devriez viser !
Les problèmes de CLS ne sont pas à prendre à la légère, car le fait d’avoir des éléments qui se décalent au chargement fourni une mauvaise expérience utilisateur et peut causer des problèmes sérieux, comme le fait de cliquer par erreur sur un mauvais bouton.
Comme toujours, le groupe d’URLs CLS montré dans les rapports de la console concerne le CLS moyen de 75% des visites des URLs du groupe.
L’outil de test « PageSpeed Insights » fonctionne bien pour vous aider à trouver des recommandations pour résoudre les problèmes de CLS, puisque vous pourrez lancer des tests à chaque modification de votre page et que le CLS ne dépend pas vraiment des vitesses de connexion réseau des visiteurs qui pourraient consulter votre site depuis l’étranger ou via une connexion lente sur mobile.
Pour aller plus loin, ne manquez surtout pas cette astuce publiée dans notre Centre d’aide :
Vous y trouverez un bout de JavaScript à ajouter à votre site afin d’éviter les changements de mise en page importants lors du chargement initial du site.
Ensuite, si vous ne parvenez pas à trouver la raison d’une valeur élevée, essayez d’interagir avec la page pour voir comment cela affecte la mise en page, et donc comment cela peut créer du CLS lors des premières interactions.

Si vous désirez éliminer tous les avertissements présents dans les Signaux Web essentiels de votre console Google Search, et faire passer votre score PageSpeed au vert, ne manquez pas notre guide complet :

Originaire de Belgique, Nicolas Laruelle est entrepreneur sur Internet depuis octobre 2009. Il a réalisé ses études supérieures à la Haute École de la Province de Liège. Après 7 années en tant que directeur technique de l’agence digitale Kim Communication Limited, il a officiellement fondé EasyHoster en février 2017. Plus tard, en mars 2021, offrir des solutions d’hébergement innovantes est devenu son projet principal. Depuis, EasyHoster s’est professionnalisé et a continué à croître pour atteindre la petite notoriété qu’on lui connaît aujourd’hui. De son côté, Nicolas Laruelle utilise son temps libre pour poster sur différents blogs : PROduNum, Mister WP et bien sûr, le blog EasyHoster.