Core Web Vitals: LCP, INP & CLS optimieren
Core Web Vitals (CWV) sind eine Reihe spezifischer Faktoren, die Google als sehr wichtig für die gesamte Nutzererfahrung einer Webseite erachtet. Sie messen die reale Nutzererfahrung in Bezug auf Ladeperformance, Interaktivität und visuelle Stabilität der Seite.
1. Was sind Core Web Vitals?
Von Google eingeführt, waren die Core Web Vitals ursprünglich Teil des größeren „Page Experience“-Systems. Dieses hat Google inzwischen als eigenständiges Ranking-System zurückgenommen und den zugehörigen Bericht in der Search Console eingestellt – die Core Web Vitals stehen heute für sich. Statt nur auf die generische Ladezeit der Seite zu schauen, konzentriert sich CWV auf Metriken, die direkt beeinflussen, wie sich ein Nutzer fühlt, wenn er mit deiner Website interagiert. Wartet er zu lange darauf, das Hauptbild zu sehen? Ist die Website nicht reaktionsfähig, wenn er auf einen Button klickt? Springt der Text herum, während er versucht zu lesen?
2. Largest Contentful Paint (LCP)
Was es misst: Ladeperformance.
LCP misst die Zeit, die der größte Textblock oder das größte Bildelement, das im Viewport sichtbar ist, benötigt, um vollständig auf dem Bildschirm gerendert zu werden. Es sagt dem Nutzer, dass der Hauptinhalt der Seite tatsächlich geladen ist.
- Gut: 2,5 Sekunden oder weniger
- Verbesserungswürdig: 2,5 bis 4,0 Sekunden
- Schlecht: Länger als 4,0 Sekunden
Wie du LCP verbesserst:
- Optimiere und komprimiere Bilder (verwende moderne Formate wie WebP oder AVIF).
- Setze Lazy Loading ein (aber lade niemals dein LCP-Bild per Lazy Loading!).
- Verbessere die Server-Antwortzeiten (Time to First Byte - TTFB) über Caching oder ein CDN.
- Beseitige oder verzögere render-blockierendes JavaScript und CSS.
3. Interaction to Next Paint (INP)
Was es misst: Interaktivität und Reaktionsfähigkeit.
Hinweis: INP hat First Input Delay (FID) offiziell im März 2024 abgelöst.
INP beobachtet die Latenz aller Klick-, Tipp- und Tastaturinteraktionen, die ein Nutzer mit einer Seite während ihrer gesamten Lebensdauer hat. Es meldet die längste einzelne Verzögerung. Wenn ein Nutzer auf einen „In den Warenkorb"-Button klickt, misst INP, wie lange die Seite braucht, um sich visuell zu aktualisieren und diesen Klick zu bestätigen.
- Gut: 200 Millisekunden oder weniger
- Verbesserungswürdig: 200 bis 500 Millisekunden
- Schlecht: Länger als 500 Millisekunden
Wie du INP verbesserst:
- Minimiere die Arbeit im Main Thread, indem du die JavaScript-Ausführungszeit reduzierst.
- Teile lange, komplexe JavaScript-Aufgaben in kleinere Häppchen auf.
- Entferne ungenutzte Drittanbieter-Skripte (wie schwere Tracking-Pixel oder Chat-Widgets).
4. Cumulative Layout Shift (CLS)
Was es misst: Visuelle Stabilität.
Wolltest du jemals gerade auf einen Link klicken, aber plötzlich lädt die Seite eine Anzeige, schiebt den Text nach unten, und du klickst aus Versehen auf etwas anderes? Das ist ein Layout Shift. CLS misst die Gesamtsumme aller unerwarteten Layout-Verschiebungen, die während der gesamten Lebensdauer der Seite auftreten.
- Gut: 0,1 oder weniger
- Verbesserungswürdig: 0,1 bis 0,25
- Schlecht: Höher als 0,25
Wie du CLS verbesserst:
- Gib auf deinen Bild- und Videoelementen immer die Größenattribute
widthundheightan. - Reserviere Platz für Anzeigen, Embeds und iframes mithilfe von CSS-Seitenverhältnissen.
- Füge niemals dynamisch neuen Inhalt oberhalb bestehenden Inhalts ein, außer als Reaktion auf eine Nutzer- interaktion.
- Stelle sicher, dass benutzerdefinierte Webfonts reibungslos laden, ohne FOUT/FOIT (Flash of Unstyled Text)-Layout- Verschiebungen zu verursachen.
Profi-Tipp: Mit Rank-O-Saur kannst du schnell die strukturellen Elemente deiner Seite ansehen, um sicherzustellen, dass Bilder ihre Abmessungen korrekt deklariert haben, und so CLS-Probleme verhindern, bevor sie auftreten.
5. Wie du Core Web Vitals misst
Google stellt mehrere Tools zur Messung deiner CWV bereit. Es ist wichtig, den Unterschied zwischen Field Data (echte Nutzer) und Lab Data (simulierte Tests) zu verstehen:
- Google Search Console: Zeigt Field Data basierend auf dem Chrome User Experience Report (CrUX) – echte Messwerte von Chrome-Nutzern und damit die maßgebliche Berichtsquelle. Ob Google exakt diese Werte als Ranking-Eingabe nutzt, ist nicht bestätigt; bewertet wird das 75. Perzentil über 28 Tage, getrennt nach Mobil und Desktop.
- PageSpeed Insights (PSI): Zeigt sowohl Field Data (falls verfügbar) als auch Lab Data (einen simulierten Lighthouse-Lauf).
- Chrome DevTools (Lighthouse): Zeigt nur Lab Data. Hervorragend, um Probleme lokal zu debuggen, bevor du in die Produktion gehst.
6. Warum CWV für SEO wichtig ist
Google hat ausdrücklich erklärt, dass Core Web Vitals ein Ranking-Faktor sind. Sie sind jedoch Teil eines Tie-Breaker-Systems.
Wichtig: Content ist nach wie vor King. Eine schnelle Website mit furchtbarem Content wird keine langsamere Website mit hochrelevantem, autoritativem Content überholen. Core Web Vitals fungieren als Tie-Breaker, wenn mehrere Seiten ähnlich hochwertigen Content haben.
Über die Rankings hinaus verbessert die Optimierung deiner CWV die Nutzerbindung drastisch, senkt Absprungraten und erhöht E-Commerce-Conversion-Raten. Nutzer hassen Warten, und sie hassen ruckelige Websites. Für CWV zu optimieren bedeutet, für deine Kunden zu optimieren.
7. Kurzreferenz: Schwellenwerte
Jede Metrik muss ihren Schwellenwert im 75. Perzentil echter Seitenaufrufe erreichen, gemessen über die letzten 28 Tage. Ein guter Durchschnitt genügt nicht.
| Metrik | Gut | Verbesserungswürdig | Schlecht |
|---|---|---|---|
| LCP - Largest Contentful Paint | bis 2,5 s | 2,5 s bis 4,0 s | über 4,0 s |
| INP - Interaction to Next Paint | bis 200 ms | 200 ms bis 500 ms | über 500 ms |
| CLS - Cumulative Layout Shift | bis 0,1 | 0,1 bis 0,25 | über 0,25 |
8. Häufig gestellte Fragen
Sind Core Web Vitals wirklich ein Rankingfaktor?
Ja, als Teil der Page-Experience-Signale – aber ein vergleichsweise kleiner. Sie wirken vor allem als Entscheidungshilfe zwischen ähnlich relevanten Seiten. Starker Inhalt auf einer langsamen Seite rankt in der Regel weiterhin vor schwachem Inhalt auf einer schnellen.
Was ist der Unterschied zwischen Labor- und Felddaten?
Labordaten (etwa aus Lighthouse) stammen aus einem simulierten Einzeldurchlauf unter festen Bedingungen und eignen sich zur Fehlersuche. Felddaten kommen aus dem Chrome UX Report und bilden echte Besuche der letzten 28 Tage ab. Für das Ranking verwendet Google die Felddaten.
Welche Metrik hat First Input Delay abgelöst?
Interaction to Next Paint (INP) hat FID im März 2024 ersetzt. INP misst die Latenz aller Interaktionen über den gesamten Besuch hinweg statt nur der ersten und ist damit deutlich strenger und aussagekräftiger.
Welche Schwellenwerte gelten als gut?
LCP höchstens 2,5 Sekunden, INP höchstens 200 Millisekunden, CLS höchstens 0,1. Jeder Wert muss im 75. Perzentil der Seitenaufrufe erreicht werden – es genügt also nicht, dass der Durchschnittsbesuch schnell ist.
Weiterlesen
