# CLS (Cumulative Layout Shift)

> Le CLS (Cumulative Layout Shift), ou décalage cumulé de mise en page, est l'un des trois Core Web Vitals de Google. Il mesure la stabilité visuelle d'une page en quantifiant l'ampleur des déplacements inattendus des éléments visibles pendant le chargement et la navigation. Concrètement, le CLS calcule un score sans unité en multipliant la fraction de l'écran affectée par le décalage (impact fraction) par la distance parcourue par les éléments (distance fraction). Un score inférieur ou égal à 0,1 est considéré comme bon, entre 0,1 et 0,25 il nécessite des améliorations, et au-delà de 0,25 il est jugé médiocre. Les causes fréquentes sont les images et iframes sans dimensions déclarées, les polices web qui provoquent un reflow, les bannières ou publicités injectées dynamiquement, et les contenus insérés au-dessus de la zone visible. Un CLS élevé dégrade l'expérience utilisateur et constitue un signal de classement pris en compte par Google dans son évaluation de la qualité des pages.

[source]: https://luwiz.io/glossaire/cls

---

Le CLS fait partie des indicateurs que Google surveille pour évaluer la qualité réelle d'une page du point de vue de l'utilisateur. Contrairement à la vitesse pure, il mesure une frustration concrète : les éléments qui bougent juste au moment où l'on s'apprête à cliquer.

## Comment ça marche

Le score CLS s'obtient en additionnant les scores de chaque décalage de mise en page inattendu survenu pendant toute la durée de vie de la page. Chaque décalage individuel est le produit de deux valeurs : l'impact fraction (la part de la fenêtre d'affichage touchée par le mouvement) et la distance fraction (la distance maximale parcourue par un élément, rapportée à la dimension de l'écran). Google ne comptabilise que les décalages non provoqués par une interaction de l'utilisateur dans les 500 millisecondes : un changement déclenché par un clic volontaire n'est donc pas pénalisé.

<Callout label="À retenir">Un CLS ≤ 0,1 est l'objectif. Au-delà de 0,25, la page est considérée comme instable et le SEO en pâtit.</Callout>

## Les causes les plus fréquentes

Quatre coupables reviennent presque systématiquement : les images et iframes sans attributs de dimension, qui forcent le navigateur à recalculer la mise en page une fois le média chargé ; les polices web tardives, qui provoquent un FOIT ou un FOUT ; les contenus injectés dynamiquement (bannières cookies, publicités, recommandations) ; et les animations qui modifient des propriétés déclenchant un reflow plutôt que d'utiliser `transform`.

## Pourquoi c'est important pour le SEO

Le CLS est un facteur de classement officiel au sein des [Core Web Vitals](/glossaire/core-web-vitals). Une page instable augmente le taux de rebond et nuit aux conversions, deux signaux indirects que les moteurs interprètent. Chez LUWIZ, nous traitons le CLS en parallèle du [LCP](/glossaire/lcp) et de l'INP, car ces trois métriques se mesurent sur le terrain via les données réelles d'utilisateurs (CrUX) et conditionnent l'évaluation globale d'une URL. Stabiliser la mise en page, c'est offrir une expérience prévisible et protéger durablement son positionnement.
