SEO & Akquisition

CLS: Definition, Berechnung und Korrektur

Guillaume Sallé

Leiter Analytics-Content & Glossar

Aktualisiert am February 22, 2026

Kurzdefinition

Der CLS (Cumulative Layout Shift) ist eine Core-Web-Vitals-Metrik, die die visuelle Instabilität einer Webseite während des Ladens misst, also die Summe unerwarteter Layoutverschiebungen. Der CLS gilt als gut, wenn er unter 0,1 liegt, verbesserungswürdig zwischen 0,1 und 0,25 und schlecht über 0,25. Der CLS quantifiziert das frustrierende Erlebnis, bei dem Seitenelemente während des Ladens 'springen' und versehentliche Klicks verursachen.

Wie es funktioniert

Der CLS (Cumulative Layout Shift) misst, wie stark sich sichtbare Elemente einer Seite während des Ladens unerwartet verschieben. Jede Layoutverschiebung wird berechnet, indem der Anteil der betroffenen Fläche (Anteil des sichtbaren Bereichs) mit dem Anteil der zurückgelegten Distanz (relative Verschiebungsdistanz) multipliziert wird. Der CLS-Score ist die Summe aller Verschiebungen in 5-sekündigen Session-Fenstern. Offizielle Google-Schwellenwerte: gut (grün) unter 0,1, verbesserungswürdig (orange) zwischen 0,1 und 0,25, schlecht (rot) über 0,25. Konkretes Beispiel: Ein Nutzer liest einen Artikel und drückt auf 'In den Warenkorb', aber im Klickmoment fügt sich eine Werbung über dem Button ein – sein Klick landet auf der Werbung. Das ist ein typischer Layout Shift. Häufige Ursachen sind Bilder und Videos ohne explizite Dimensionen (width/height), dynamisch geladene Werbung, Embeds oder iFrames, Schriftarten, die ein FOUT (Flash of Unstyled Text) verursachen, und per JavaScript über bestehendem Inhalt eingefügte Elemente.

Warum es wichtig ist

Ein hoher CLS-Score erzeugt eine frustrierende User Experience: versehentliche Klicks, Verlust der Leseposition, Eindruck von Seiteninstabilität. Diese Frustration übersetzt sich direkt in höhere Absprungraten und niedrigere Conversion-Raten. Google hat den CLS in die Core Web Vitals aufgenommen, da er einer der von Nutzern am häufigsten genannten Abbruchgründe ist. Ein guter CLS trägt zudem zur wahrgenommenen Qualität und Professionalität der Site bei.

Wie verbessern oder nutzen

Um den CLS zu korrigieren: Definieren Sie immer explizite `width`- und `height`-Attribute auf Ihren Bildern und Videos, damit der Browser den Platz vor dem Laden reserviert. Verwenden Sie `min-height` für Werbe- und Embed-Bereiche. Laden Sie Schriften vor und verwenden Sie `font-display: swap`, um typografische Verschiebungen zu vermeiden. Vermeiden Sie es, Inhalt per JavaScript über bestehendem sichtbaren Inhalt einzufügen. Auditieren Sie Layout Shifts im Performance-Tab der Chrome DevTools oder mit PageSpeed Insights.

Mit Sublim

Mit Sublim können Sie Ihre CLS-Scores pro Seite in Echtzeit mit Conversion- und Absprungraten korrelieren. So priorisieren Sie die Korrektur stark frequentierter Seiten, auf denen ein hoher CLS tatsächlich Kunden kostet, statt blind zu arbeiten. Alle Daten werden cookielos und vollständig DSGVO-konform erhoben.

Häufig gestellte Fragen

Wie identifiziert man die für einen schlechten CLS verantwortlichen Elemente?

Das präziseste Tool ist der Performance-Tab der Chrome DevTools: Aktivieren Sie die Aufzeichnung beim Seitenladen und suchen Sie nach 'Layout Shift'-Events. PageSpeed Insights und die Web Vitals Debugger Chrome Extension ermöglichen es ebenfalls, sich bewegende Elemente visuell zu identifizieren. Die CSS-Eigenschaft `content-visibility` kann ebenfalls bei der Problemisolation helfen.

Beeinflussen CSS-Animationen den CLS?

Nicht zwangsläufig. Google schliesst Verschiebungen aus der CLS-Berechnung aus, die durch Nutzerinteraktionen (Klicks, Tastatureingaben) innerhalb von 500 ms nach der Interaktion entstehen. CSS-Animationen mit `transform` statt mit Layout-Eigenschaften (top, left, margin) beeinflussen den CLS ebenfalls nicht, da sie keine Layoutneuberechnung auslösen.

Reicht ein guter CLS allein für ein gutes Google-Ranking?

Der CLS ist eine der drei Core-Web-Vitals-Metriken (zusammen mit LCP und INP), die ein Page-Experience-Signal darstellen. Ein guter CLS allein reicht nicht: Alle drei Metriken müssen im grünen Bereich liegen, damit das Signal positiv ist. Zudem bleiben Inhalt und Domain-Autorität im Gesamtranking dominant.