Core Web Vitals sind drei Kennzahlen, mit denen Google die Nutzungserfahrung einer Seite beschreibt. Sie sind ein Rankingsignal unter vielen und deutlich schwächer als Relevanz und Inhalt. Der eigentliche Grund, sich damit zu befassen, ist ein anderer: Besucher verlassen langsame und ruckelnde Seiten häufiger, unabhängig von jedem Ranking.
LCP: Largest Contentful Paint
Was gemessen wird: der Zeitpunkt, an dem das größte sichtbare Element im ersten Bildschirm dargestellt ist. Meist ist das ein Bild, ein Video-Vorschaubild oder ein großer Textblock.
Bewertung: gut bis 2,5 Sekunden, verbesserungswürdig bis 4 Sekunden, darüber schlecht. Gemessen wird beim 75. Perzentil der echten Besuche, also nicht am Durchschnitt.
Häufigste Ursachen, nach Häufigkeit:
- Ein unkomprimiertes Hero-Bild, oft mehrere Megabyte groß
- Langsame Serverantwort, erkennbar an einem hohen Wert für die Zeit bis zum ersten Byte
- Blockierende Ressourcen im Kopfbereich, insbesondere CSS und Schriften von fremden Servern
- Ein Bild, das erst per JavaScript nachgeladen wird
- Verzögertes Laden fälschlich auch für das Hero-Bild aktiviert
Wirksame Maßnahmen: Hero-Bild in der richtigen Größe und in einem modernen Format ausliefern, ausdrücklich nicht verzögert laden, Schriften lokal einbinden, Caching aktivieren. Details in Bilder optimieren.
INP: Interaction to Next Paint
Was gemessen wird: wie lange es dauert, bis die Seite auf eine Eingabe sichtbar reagiert. Erfasst werden Klicks, Tipp-Eingaben und Tastendrücke über den gesamten Besuch, bewertet wird der schlechteste relevante Wert.
Bewertung: gut bis 200 Millisekunden, verbesserungswürdig bis 500 Millisekunden, darüber schlecht.
Häufigste Ursachen: zu viel JavaScript, das den Hauptprozess des Browsers belegt. In der Praxis fast immer Fremdskripte: Consent-Werkzeug, Analysewerkzeug, Werbenetzwerk, Chat-Widget, eingebettete Karte, Bewertungs-Widget. Jedes einzelne wirkt harmlos, in Summe belegen sie den Prozess.
Wirksame Maßnahmen: Anzahl der Fremdskripte reduzieren, nicht optimieren. Karten und Videos erst nach einem Klick laden. Analysewerkzeuge auf eines beschränken. Skripte, die nicht für die erste Darstellung gebraucht werden, verzögert ausführen.
Der Punkt, der in Diskussionen fehlt: INP verbessert man nicht durch Technik, sondern durch Verzicht. Ein Chat-Widget, das dreimal im Monat genutzt wird, kostet jeden Besucher Reaktionszeit.
CLS: Cumulative Layout Shift
Was gemessen wird: wie stark sichtbare Inhalte während des Ladens verrutschen. Der Wert ist ein Produkt aus betroffener Fläche und Verschiebungsdistanz, also keine Zeitangabe.
Bewertung: gut bis 0,1, verbesserungswürdig bis 0,25, darüber schlecht.
Häufigste Ursachen:
- Bilder ohne Breiten- und Höhenangabe, sodass der Platz erst beim Laden reserviert wird
- Nachgeladene Werbeflächen oder Einbettungen ohne reservierten Raum
- Schriften, deren Ersatzschrift eine andere Größe hat, sodass Text nach dem Nachladen umbricht
- Ein Consent-Banner, das den Inhalt nach unten schiebt statt darüber zu liegen
- Dynamisch eingefügte Hinweisleisten am Seitenkopf
Wirksame Maßnahmen: Breite und Höhe an jedes Bild, festen Raum für Einbettungen, Ersatzschrift mit ähnlichen Maßen wählen, Banner als Überlagerung statt als eingeschobenes Element.
CLS ist in der Regel die Kennzahl, die mit dem geringsten Aufwand in den grünen Bereich kommt, weil die Ursachen eindeutig und die Korrekturen klein sind.
Reihenfolge der Arbeit
| Schritt | Aufwand | Wirkung |
|---|---|---|
| Bilder verkleinern und komprimieren | niedrig | sehr hoch auf LCP |
| Bildmaße im Markup ergänzen | niedrig | hoch auf CLS |
| Schriften lokal, mit Ersatzschrift abgestimmt | niedrig | mittel auf LCP und CLS |
| Fremdskripte reduzieren | mittel | hoch auf INP |
| Caching aktivieren | niedrig | hoch auf LCP |
| Karten und Videos erst nach Klick | mittel | hoch auf INP |
| Theme oder Pagebuilder wechseln | hoch | hoch, aber letzte Option |
Die ersten drei Zeilen sind an einem Nachmittag erledigt und decken bei einer typischen Seite den größten Teil des Potenzials ab.
Was nicht hilft
Punktejagd im Labortest. Ein Labortest auf dem Desktop mit Wert 100 bedeutet nichts, wenn die mobilen Felddaten rot sind. Der Labortest ist ein Werkzeug zur Fehlersuche, nicht das Ziel.
Ein CDN als erste Maßnahme. Bei lokaler Zielgruppe bringt es kaum etwas, solange die Bilder zu groß sind.
Minifizierung als Einzelmaßnahme. Spart Kilobytes, während unoptimierte Bilder Megabytes kosten.
Mehr Serverleistung bei einem Bilderproblem. Ein schnellerer Server liefert ein Sechs-Megabyte-Bild schneller aus, aber es bleibt sechs Megabyte groß.
Wie und wo man richtig messt, inklusive der Unterscheidung von Labor- und Felddaten, steht in Ladezeit messen.