Zum Inhalt springen

Beta — Entwurfsstand. Prüfordnung und Hinweistexte sind noch nicht rechtlich freigegeben; es werden derzeit keine verbindlichen Siegel ausgestellt.

Prüfpunkt cwv-clsReaktion, Stabilität und Messung

Was ist CLS und warum verspringen Inhalte beim Laden einer Website?

CLS (Cumulative Layout Shift) misst, wie stark die Inhalte einer Seite während des Ladens verspringen — Google bewertet einen Wert bis 0,1 als gut, über 0,25 als schlecht. Jeder kennt den Effekt: Man will auf einen Link tippen, im letzten Moment schiebt ein nachladendes Bild alles nach unten, und der Finger landet auf der Werbung daneben. Genau diese Sprünge zählt der CLS zusammen.

Layoutsprünge kosten Vertrauen und führen zu Fehlklicks

Ein Versprung passiert, wenn ein Element seinen Platz erst beansprucht, nachdem die Seite schon dargestellt ist: Ein Bild lädt ohne reservierte Fläche, ein Werbebanner schiebt sich zwischen Überschrift und Text, eine nachgeladene Schrift ändert die Zeilenhöhe. Für Besucher fühlt sich das an, als hätte die Seite einen Wackelkontakt. Die praktische Folge sind Fehlklicks: Der Finger zielt auf „Abbrechen“ und trifft „Kaufen“, weil sich die Schaltflächen im letzten Moment verschoben haben. Der CLS summiert alle diese Verschiebungen über den Seitenaufbau zu einer einzigen Zahl — je größer die verschobene Fläche und je weiter der Sprung, desto höher der Wert.

Die Google-Schwellen: 0,1 gut, ab 0,25 schlecht

Anders als die Zeit-Messwerte hat der CLS keine Einheit — er ist eine Verhältniszahl aus verschobener Fläche und Sprungweite. Bis 0,1 gilt er als gut, bis 0,25 als verbesserungswürdig, darüber als schlecht. Eine Seite, deren Inhalte gar nicht springen, erreicht 0. Der Prüfservice übernimmt diese offiziellen Google-Schwellen unverändert und misst Mobil und Desktop getrennt, denn auf dem schmalen Telefonbildschirm wirkt sich derselbe Versprung stärker aus: Was am Desktop eine kleine Verschiebung ist, schiebt am Telefon den halben sichtbaren Bereich weg.

So misst der Prüfservice die Layoutstabilität

Der Prüfservice ruft für jede geprüfte Seite die PageSpeed-Messung von Google ab. Sie liefert den CLS aus zwei Quellen: aus den Felddaten echter Besucher der letzten 28 Tage, sofern die Seite genug Aufrufe hat, und aus einer Labormessung unter festgelegten Bedingungen. Liegen Felddaten vor, haben sie Vorrang — sie zeigen, was tatsächlichen Besuchern passiert, samt langsamer Verbindungen und älterer Geräte. Jeder Wert über der Schwelle steht als Befund im Bericht, mit gemessenem Wert, Quelle der Messung und dem Zielwert 0,1 daneben, sodass Ihre Agentur gezielt nachbessern kann.

So gehen Sie es an

  1. Laden Sie Ihre Startseite am Mobiltelefon und beobachten Sie die ersten Sekunden: Rutscht der Text nach unten, sobald Bilder oder Banner erscheinen?
  2. Bitten Sie Ihre Agentur, für jedes Bild und jedes Video feste Breiten- und Höhenangaben zu hinterlegen, damit der Platz von Anfang an reserviert ist.
  3. Lassen Sie Werbeflächen und Einbettungen einen festen Rahmen bekommen, der auch dann stehen bleibt, wenn der Inhalt später oder gar nicht eintrifft.
  4. Verlangen Sie, dass Hinweisbanner — etwa zu Cookies oder Aktionen — über der Seite schweben oder von Anfang an eingeplant sind, statt den Inhalt nach unten zu drücken.
  5. Prüfen Sie den CLS nach jedem Umbau der Startseite erneut, denn schon ein neues Banner kann aus einem guten Wert einen schlechten machen.

Weiter im Prüfbereich Performance

Dieser Prüfpunkt gehört zum Prüfbereich Performance; dort stehen alle Prüfpunkte im Überblick. Was die Prüfung insgesamt leistet, zeigt die Leistungsseite; wie ein Ergebnis zustande kommt, erklärt das Prüfverfahren. Alle Prüfbereiche im Überblick: Wissensbasis.

Foto: William Stitt, CC0

  • Siegel Digitale Barrierefreiheit
  • Siegel Daten & Recht
  • Siegel Technische Qualität
  • Siegel Digital Excellence
  • Siegel Cyberversicherung

Geprüft. Für eine bessere digitale Zukunft.euid.com →