Google publie une vidéo sur l’amélioration de l’expérience des pages grâce à la modification cumulative de la mise en page (CLS)

Cumulative Layout Shift (CLS) est une mesure clé de votre score d'expérience de page. Cette vidéo est une excellente introduction à CLS.
SIA Team
October 20, 2021

Hier, sur la chaîne YouTube Search Central de Google, une vidéo intitulée “How to Improve Cumulative Layout Shift for a Better Page Experience” a été publiée.

Cumulative Layout Shift – ou CLS, comme je l’appellerai désormais – fait partie de Page Experience, une mesure globale qui sous-tend la mise à jour Page Experience.

En gros, Google souhaite que chaque page de votre site offre une bonne expérience utilisateur, ou expérience de la page.

(Cela dit, l’expérience utilisateur, en tant que concept, est plus large que l’expérience de la page, ce qui signifie qu’elle peut inclure des éléments qui ne font pas partie de l’expérience de la page. Mais cela dépasse le cadre de cette actualité).

Qu’est-ce que CLS ?

La meilleure façon de le décrire, comme indiqué au début de la vidéo, est d’utiliser une expérience que vous avez certainement vécue :

Vous accédez à une page Web (généralement sur un appareil mobile) et, lorsque vous commencez à lire (ou à regarder), des éléments de la page changent.

Cela peut être un peu déstabilisant, car supposons que vous étiez sur le point de cliquer sur quelque chose, mais ensuite… le lien se déplace.

La mise en page s’est déplacée, et le déplacement cumulé de la mise en page est… oui… CLS.

CLS est une mesure au niveau de la page, donc chaque page de votre site peut avoir un score CLS différent.

Vous vous demandez peut-être si le processus d’amélioration de CLS peut être fastidieux, car vous pouvez vouloir améliorer le CLS de plus d’une page.

Oui, c’est vrai, et c’est pourquoi je pense que l’approche la plus efficace en termes de temps consiste à utiliser une plateforme (comme un thème WordPress léger et bien codé si vous utilisez WordPress) qui optimise plusieurs aspects techniques de votre site.

De cette façon, le CLS de chaque page est aussi optimisé que possible (compte tenu de ce qu’il a à faire).

Cette vidéo donne un certain nombre de conseils et de procédures utiles pour minimiser (et, espérons-le, éliminer) le NSI.

Qu’est-ce qu’un bon score CLS ? (0…ou, au moins, viser 0,1)

Idéalement, 0, mais, comme mentionné dans la vidéo, c’est 0,1 : “…un bon chiffre à viser est [pour] 75% ou plus des vues d’une page, a un CLS de 0,1 ou moins. Si vous êtes en dessous de ça, vous vous en sortez bien.”

Donc, en d’autres termes, 0.1.

Il suffit de viser un taux constant de 0,1 ou moins, et cela devrait (espérons-le) être suffisant.

Comment éliminer ou (plus vraisemblablement, réduire) le CLS ?

Pour être sûr, la vidéo est une source d’information plus détaillée et plus complète sur ce sujet, mais j’ai une certaine compréhension technique du HTML, et j’aimerais donc vous donner quelques conseils :

Premièrement, déterminez votre score CLS

Tout d’abord, tout comme lorsque vous visez des objectifs dans la vie, vous devez savoir où vous êtes maintenant si vous voulez arriver quelque part.

De même, vous devez connaître votre score CLS actuel.

Le CLS peut être mesuré sur le terrain et en laboratoire. Les outils de mesure sur le terrain sont ceux qui mesurent selon l’expérience d’un utilisateur réel, tandis que les outils de laboratoire mesurent dans un environnement synthétique.

Les outils énumérés ci-dessous ont été trouvés à l’adresse suivante : https://web.dev/cls/#how-to-measure-cls.

Outils de terrain

Outils de laboratoire

Ensuite, considérez vos options

Allez-vous décider de vous débarrasser des publicités interstitielles, des bannières ou de tout autre élément susceptible d’affecter la mise en page de votre ou vos pages (ces éléments peuvent entraîner un décalage de la mise en page, surtout s’ils se chargent après le chargement initial de la mise en page) ?

Avez-vous réfléchi aux conseils donnés dans la vidéo et dressé une liste de la manière dont vous (et votre équipe, le cas échéant) souhaiteriez aborder la question ?

Troisièmement, jouez !

Créez une page de test (vous voudrez peut-être la désindexer, puisqu’il ne s’agit que d’une page de test) et jouez. Essayez certaines choses, et voyez ce que vous trouvez.

Prenez des mesures itératives pour voir comment vous progressez.

Quatrièmement, agissez et décidez

Vous avez dressé une liste d’options, puis vous avez fait quelques expériences. Maintenant, il est temps de passer à l’action.

Oui, cela peut sembler intimidant, mais si votre site comporte de nombreuses pages, commencez par améliorer celles qui sont les plus importantes.

Vous pouvez également améliorer votre processus de création de contenu, de sorte que, dorénavant, vos nouveaux contenus auront de meilleurs scores CLS.

Je vous souhaite beaucoup de succès.

Source : Chaîne YouTube Google Search Central