On parle de « cumulative layout shift » ou CLS quand un ou plusieurs éléments se déplacent sur une page web en cours de chargement. Le phénomène, impactant négativement l’expérience utilisateur, fait partie des paramètres pris en compte dans le classement Google.
Le CLS et le LCP, deux critères au cœur du classement Google
Pour diverses raisons, il arrive que certains éléments se déplacent sur une page web. Leur déplacement est provoqué notamment par le chargement de polices, d’images, de vidéos ou encore de formulaires de contacts. En tous les cas, le CLS est source de désagrément pour l’internaute.
S’il est important d’améliorer le score CLS pour une meilleure expérience utilisateur, on peut en dire autant pour le « largest contentful paint » ou LCP. On parle ici de la vitesse à laquelle les divers éléments, notamment les plus grands, s’affichent sur une page web. La lenteur de leur chargement peut être due à la lenteur du temps de réponse du serveur, au blocage du rendu par JavaScript et CSS ou encore au chargement de ressources volumineuses. Il s’agit en tout cas d’un problème qu’il convient de résoudre pour optimisation le parcours de navigation de l’internaute.
Les causes fréquentes d’un mauvais score CLS
On a déjà identifié un certain nombre de facteurs conduisant à un décalage de mise en page. On pense notamment aux images mal dimensionnées ou au contenu dynamique mais aussi à des publicités Google ou encore à certaines polices utilisées sur le web. Ces éléments impactants permettent d’identifier les différentes pistes pour améliorer le score CLS.
Les pistes pour améliorer son score CLS
Les images sont importantes pour illustrer les articles. Encore faut-il que leur chargement ne nuise pas à l’expérience de navigation du lecteur. Aussi est-il recommandé de publier des images dont les dimensions de hauteur e de largeur sont celles qui sont inscrites dans le code HTML. Le même rapport largeur-hauteur doit en outre être utilisé avec les images dynamiques.
Google y met aussi du sien pour améliorer le score CLS d’un site web. Le moteur de recherche s’efforce en effet de ne pas envahir une page web avec ses publicités, plaçant celles-ci sur des espaces déterminés. Encore faut-il que l’élément « division du document » soit correctement paramétré.
La publication de contenu dynamique (un lien vers une vidéo YouTube par exemple) permet par ailleurs de susciter l’intérêt de l’internaute. Il faut cependant veiller à ce que cet élément spécifique soit correctement balisé pour réduire au mieux le CLS.
