Der Cumulative Layout Shift (CLS) ist eine Metrik zur Messung von Layoutverschiebungen während des Ladens einer Website. Layoutverschiebungen werden von Nutzern als störend wahrgenommen und können zu Absprüngen von einer Website führen. Daher zählt Google den CLS auch zu seinen Core Web Vitals und er wird als Rankingfaktor herangezogen.
Inhalt
Video von unserem YouTube Kanal zum Thema CLS
Ursachen & GrĂĽnde fĂĽr Layout Shift
Der Cumulative Layoutshift wird dadurch hervorgerufen, dass Elemente geladen werden, deren Größe bis zum Abschluss ihres Ladevorgangs unbekannt ist. In dem Moment, in dem sie geladen werden, werden sie dann schlagartig dargestellt.
Ein weiterer Faktor kann sein, dass CSS Styleangaben in einem HTML-Dokument zu spät gemacht werden und diese nachträglich die Größe eines bereits geladenen Elements verändern.
Die häufigsten Gründe für hohe CLS Werte sind:
- Schriftarten/ Fonts (benötigen i.d.R. lange zum laden)
- Bilder und iframes die keine Höhen und Breitenangaben im HTML haben
- Spät ladendes CSS
Messung des CLS
Wie finde ich nun heraus, ob der Layout Shift auf meiner Website problematisch ist? Zunächst halten wir fest, dass der CLS wie alle Core Web Vitals für jede URL individuell bestimmt wird. Im Beitrag über Core Web Vitals habe ich die verschiedenen Möglichkeiten der Messung erklärt.
Beim Cumulative Layout Shift gilt, dass nur „echte Userdaten“ fĂĽr das Ranking entscheidend sind (siehe Beitrag CWVs). Daher ist die Google Search Console die erste Anlaufstelle fĂĽr Nachforschungen (Unter Nutzerfreundlichkeit/ Core Web Vitals. Hier seht ihr direkt ob der festgestellte Wert akzeptabel ist.
Cumulative Layout Shift verbessern & optimieren
Für Webentwickler ist der CLS relativ leicht optimierbar. Nutzer von Content-Management-Systemen, Page Buildern etc. die keine Entwickler sind können dagegen nur schwer darauf Einfluss nehmen. Sind Themes und PlugIns sauber programmiert, sollten sich Probleme jedoch in Grenzen halten. Ggf. kann ein Wechsel des Themes eventuell Abhilfe verschaffen. Wer sich selbst nicht daran traut, fährt wahrscheinlich mit der Unterstützung von Webentwicklern, WordPress Agenturen o.Ä. am besten.
WordPress User können versuchen mit PlugIns wie Autoptimize eine Verbesserung herbeiführen, wobei diese auf einige Probleme wie fehlenden height & width Angaben keinen Einfluss nehmen können.
Googles eigener Rat zum CLS
Im folgendem Video bekommst du direkt von Google Informationen zum Thema CLS/ Cumulative Layout Shift.
Häufig gestellte Fragen
Was ist der Cumulative Layout Shift (CLS)
Der Cumulative Layout Shift (CLS) ist Teil der Core Web Vitals von Google. Er ist eine Metrik zur Messung von störenden Layoutverschiebungen während des Ladens einer Website.
Ist der Cumulative Layout Shift (CLS) bei Google ein Rankingfaktor
Ja! Der Cumulative Layout Shift ist eine von zur Zeit 3 Metriken der Core Web Vitals. Eine schlechte Performance in nur einer der Metriken fĂĽhrt bereits messbar zu schlechteren Rankings.
Was ist ein CLS Fehler?
Ein CLS Fehler wird bei den Google PageSpeed Insights angezeigt, wenn der Wert des Cumulative Layout Shift (kurz CLS) größer als 0,25 ist. Dies zeigt an, dass es beim Ladevorgang der betroffenen URL in einem nicht akzeptablen Maß zu Layoutverschiebungen kommt und diese optimiert werden müssen.
