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.

cls good improve poor

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 :

Comment résoudre facilement et définitivement les problèmes de CLS grâce à un bout de code JavaScript →

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.

Déterminez vous-même si EasyHoster est le meilleur hébergeur Web pour l'hébergement de votre site WordPress ou autre ! (vidéo)

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 :

Comment obtenir un score de 100/100 sur PageSpeed Mobile (même sans WP Rocket), le guide ultime →

Le site WordPress speed.easyhoster.net ➚ permet de tester le potentiel des solutions d'Hébergement Web EasyHoster.