Technik
Cumulative Layout Shift misst, wie stark Inhalte während des Ladens verrutschen, und gehört zu den drei Core Web Vitals.
Cumulative Layout Shift, kurz CLS, beziffert, wie sehr sich der Seiteninhalt während des Ladens noch verschiebt. Gemeint ist das bekannte Phänomen, dass ein Text nach unten springt, weil darüber verspätet ein Bild oder ein Werbeplatz erscheint. Anders als die übrigen Core Web Vitals misst CLS keine Zeit, sondern eine Bewegung.
Als gut gilt ein CLS bis 0,1. Werte zwischen 0,1 und 0,25 gelten als verbesserungswürdig, darüber als schlecht. Die Zahl entsteht aus der verschobenen Fläche multipliziert mit der Strecke, um die sie sich bewegt hat.
Springende Inhalte kosten mehr als Sympathie. Ein Antippen landet auf der falschen Schaltfläche, eine Zeile geht beim Lesen verloren, ein Formular wird versehentlich abgeschickt. Besonders betroffen sind Menschen, die auf dem Smartphone lesen oder auf Vergrößerung angewiesen sind, weshalb CLS eng mit der Barrierefreiheit zusammenhängt.
An erster Stelle stehen Bilder ohne Angabe von Breite und Höhe, denn ohne diese Angaben hält der Browser keinen Platz frei. Es folgen nachgeladene Schriften, die beim Wechsel von der Ersatzschrift andere Zeilenumbrüche erzeugen, sowie Einblendungen, die sich oberhalb bestehender Inhalte öffnen — Einwilligungsbanner, Hinweisleisten und nachgeladene Werbeflächen.
Geben Sie jedem Bild und jedem eingebetteten Rahmen feste Maße oder ein Seitenverhältnis mit, damit der Platz von Anfang an reserviert ist. Laden Sie Schriften vor und wählen Sie eine Ersatzschrift mit ähnlichen Proportionen. Reservieren Sie für nachgeladene Elemente einen festen Bereich, statt sie in den Textfluss einzuschieben. Diese Eingriffe sind meist an einem Nachmittag erledigt und wirken sofort.