Testeur et Analyseur de CLS Gratuit

Cumulative Layout Shift mesure l'ampleur des décalages inattendus du contenu de la page pendant le chargement. Plus la valeur est basse, mieux c'est.

Moins de 0,1 est Bon. De 0,1 à 0,25 nécessite des améliorations. Plus de 0,25 est Médiocre.

Oui, entièrement gratuit.

Absolument. Le CLS Tester & Analyzer traite tout côté client, dans votre navigateur. Aucune donnée n'est envoyée ni stockée sur un serveur. Votre contenu reste privé sur votre appareil à tout moment.

Oui, le CLS Tester & Analyzer est entièrement responsive et fonctionne sur les smartphones et les tablettes. Vous pouvez l'utiliser sur n'importe quel appareil doté d'un navigateur web moderne, sans aucun téléchargement d'application.

Aucun compte ni inscription n'est nécessaire. Ouvrez simplement le CLS Tester & Analyzer dans votre navigateur et commencez à l'utiliser immédiatement. Il n'y a ni barrière d'inscription ni restriction d'utilisation.

Oui, le CLS Tester & Analyzer est conçu selon les directives et les bonnes pratiques actuelles de Google Search. Nous mettons régulièrement l'outil à jour pour refléter les évolutions des exigences des moteurs de recherche.

Saisissez simplement votre contenu dans le champ prévu, ajustez les paramètres selon vos préférences, et l'outil le traitera instantanément. Vous pouvez ensuite copier le résultat dans votre presse-papiers ou le télécharger.

Le CLS Tester & Analyzer fonctionne dans tous les navigateurs modernes, dont Chrome, Firefox, Safari, Edge et Opera. Pour une expérience optimale, utilisez la dernière version de votre navigateur préféré.

Le CLS n'est pas une mesure de temps mais un score qui additionne chaque décalage de mise en page inattendu survenu pendant le cycle de vie d'une page. Chaque décalage est noté selon deux facteurs multipliés entre eux : la fraction d'impact, c'est-à-dire la portion du viewport visible qui a bougé, et la fraction de distance, c'est-à-dire l'ampleur du déplacement des éléments par rapport au viewport. Un décalage qui pousse un large bloc de contenu sur une grande distance obtient un score bien plus élevé qu'un léger mouvement. Le navigateur additionne ensuite tous ces décalages inattendus pour produire un chiffre final unique. Point important : les mouvements survenant dans les 500 millisecondes environ suivant un clic ou un tap de l'utilisateur sont exclus, car ils sont généralement intentionnels. Cet outil reproduit exactement cette logique, en ignorant les décalages marqués comme liés à une saisie et en ne totalisant que les décalages inattendus. Ouvrez-le sur n'importe quelle page pour voir le total évoluer en direct dans votre navigateur.

Les outils de labo mesurent un seul chargement de page sur un seul appareil, dans des conditions contrôlées, tandis que les outils de terrain comme le Chrome User Experience Report font la moyenne de nombreuses visites réelles sur différents écrans, réseaux et comportements. Cette différence explique pourquoi votre chiffre de labo et votre chiffre de terrain coïncident rarement. Une page peut sembler stable lors d'un test synthétique isolé tout en continuant à bouger pour des visiteurs sur des connexions lentes ou des écrans plus petits, où les images et publicités à chargement tardif se comportent différemment. Pour valider les Core Web Vitals, Google observe le 75e centile du CLS réel des utilisateurs, mobile et ordinateur confondus, qui doit se situer à 0.1 ou en dessous. La mesure en direct de cet outil reflète votre propre appareil, la taille de votre écran et votre réseau à cet instant précis ; elle se comporte donc comme un échantillon de terrain unique plutôt que comme une moyenne de labo. Lancez-la plusieurs fois pour observer comment les conditions font varier le résultat.

Un CLS élevé s'explique presque toujours par quelques causes récurrentes. Les images et iframes sans attributs width et height explicites, ou sans aspect-ratio CSS, obligent la page à se réorganiser une fois chargées. Les emplacements publicitaires qui apparaissent sans espace réservé repoussent brutalement le contenu vers le bas. Le contenu injecté au-dessus d'éléments existants, comme des bannières ou des notifications, pousse tout ce qui se trouve en dessous. Et les polices web qui s'appliquent tardivement peuvent reformater des paragraphes entiers de texte. La solution fiable consiste à réserver l'espace à l'avance pour tout élément qui se charge de façon asynchrone, afin que la mise en page n'ait jamais à sauter pour s'y adapter. Pour les mouvements que vous souhaitez conserver, animez avec transform et opacity plutôt qu'avec des propriétés qui déclenchent un recalcul complet de la mise en page. Cet outil liste ces schémas ainsi que leurs solutions : collez ou mesurez votre score, puis utilisez ces conseils pour cibler précisément les décalages qui pénalisent votre page.

Au chargement de la page, l'analyseur attache un PerformanceObserver aux événements layout-shift et demande les entrées mises en tampon (buffered entries). Ce détail de mise en tampon compte : il permet de capter les décalages dès le tout début du chargement, et pas seulement à partir du moment où le script de mesure a démarré, si bien que rien de précoce n'est manqué. À mesure que les décalages surviennent, l'outil lit la Layout Instability API en direct, la même interface navigateur que les outils de Google eux-mêmes utilisent, et maintient un total en cours arrondi à trois décimales à côté d'un badge d'évaluation. Comme la valeur provient directement de votre appareil réel, de la taille de votre écran et de votre réseau à cet instant, elle reflète des conditions authentiques plutôt qu'une simulation idéalisée. Aucun crawl ni aller-retour serveur n'est impliqué ; tout se passe localement. Ouvrez l'outil sur la page que vous souhaitez évaluer et regardez le score, ainsi que son évaluation Bon, À améliorer ou Faible, se mettre à jour au fur et à mesure que la mise en page se stabilise.

La mesure dans le navigateur ne lit que la page actuellement ouverte, car elle écoute les événements layout-shift en direct sur ce document. Elle ne crawle ni ne récupère elle-même une URL distante. Pour analyser un autre site, vous avez ici deux options. D'abord, utilisez l'analyseur de score manuel : saisissez une valeur comprise entre 0.0 et 1.0 provenant d'un rapport que vous avez déjà, et l'outil vous indique instantanément si elle est Bonne, À améliorer ou Faible selon les seuils de Google. Ensuite, collez une URL dans le champ dédié et l'outil vous redirige vers PageSpeed Insights de Google, en ouvrant ce rapport dans un nouvel onglet, où vous obtenez à la fois les données de labo et les données de terrain réelles. Donc, même s'il ne scanne pas directement les pages externes, il vous offre une évaluation rapide et un accès en un clic à des données plus approfondies. Essayez l'analyseur de score pour interpréter n'importe quel chiffre que vous avez déjà.