Core Web Vitals sind seit 2021 ein offizieller Google-Rankingfaktor. In den letzten Jahren hat Google die Metriken präzisiert und die Anforderungen verschärft. Wer die aktuellen Schwellenwerte nicht kennt, optimiert am Ziel vorbei.
Die drei Metriken im Überblick
Google misst drei Kernmetriken, die die Nutzererfahrung einer Website quantifizieren:
- LCP (Largest Contentful Paint): Wie schnell lädt das größte sichtbare Element – meist ein Hero-Bild oder eine große Überschrift? Ziel: unter 2,5 Sekunden. Unter 4 Sekunden gilt als "Verbesserungswürdig", darüber als "Schlecht".
- INP (Interaction to Next Paint): Wie schnell reagiert die Seite auf Nutzereingaben (Klick, Tipp, Tastendruck)? Ziel: unter 200 Millisekunden. INP ersetzt seit 2024 FID und ist deutlich strenger.
- CLS (Cumulative Layout Shift): Verschiebt sich das Layout während des Ladens? Ziel: unter 0,1 (auf einer Skala von 0 bis beliebig). CLS über 0,25 ist "Schlecht".
INP: die unterschätzte Metrik
INP ist für viele Websites die schwierigste Metrik – und die mit dem größten Optimierungspotenzial. Anders als sein Vorgänger FID, der nur die erste Interaktion maß, erfasst INP alle Interaktionen während des gesamten Besuchs und gibt den 98. Perzentilwert zurück.
Was das bedeutet: Selbst wenn 97 von 100 Klicks sofort reagieren, ein einziger langsamer Klick kann den Score deutlich verschlechtern. Hauptverursacher sind schwere JavaScript-Bundles, die den Browser-Hauptthread blockieren, sowie Event-Handler, die synchrone DOM-Operationen auslösen.
Besonders betroffen: E-Commerce-Sites mit komplexen Produktkonfiguratoren, Filter-Facetten und Chat-Widgets sowie WordPress-Sites mit vielen Plugins.
LCP verbessern: die wirkungsvollsten Maßnahmen
Das LCP-Element ist in den meisten Fällen das Hero-Bild. Konkrete Hebel:
- Hero-Bild mit
fetchpriority="high"undloading="eager"auszeichnen – der Browser priorisiert dann den Download - Bilder in WebP oder AVIF bereitstellen – bis zu 40 % kleinere Dateien bei gleicher Qualität
- Server-Response-Zeit (TTFB) unter 800 ms halten – alles darüber frisst LCP-Budget
- Kritisches CSS inline einbinden oder als Preload deklarieren, um Render-Blocking zu vermeiden
- Schriftarten lokal hosten mit
font-display: swap– externe Schriften verzögern das erste Rendering
CLS: Layout-Sprünge dauerhaft eliminieren
CLS-Probleme entstehen typischerweise durch:
- Bilder ohne definierte Abmessungen: Immer
width- undheight-Attribute setzen, damit der Browser Platz reservieren kann - Nachgeladene Werbeanzeigen: Ad-Slots mit fester Höhe reservieren
- Schriften mit FOUT (Flash of Unstyled Text): Lokal gehostete Schriften mit
font-display: swapund Preload-Links eliminieren den Schrift-Sprung - Dynamisch eingefügte Inhalte: Banners, Cookie-Hinweise oder "Jetzt kaufen"-Leisten oberhalb bestehender Inhalte einzufügen erzeugt CLS
Messung: Feld- vs. Labordaten
Ein häufiges Missverständnis: PageSpeed Insights zeigt zwei Arten von Daten. Labordaten (Lighthouse-Simulation) und Felddaten aus dem Chrome User Experience Report (CrUX) – also echte Nutzerdaten der letzten 28 Tage. Google rankt auf Basis der Felddaten, nicht der Labordaten.
Das bedeutet: Eine Seite kann in PageSpeed Insights 95 Punkte erreichen und trotzdem schlechte Felddaten haben – wenn echte Nutzer auf langsamen Geräten oder mobilen Verbindungen eine schlechtere Erfahrung machen. Die Google Search Console zeigt Core Web Vitals auf Basis der Felddaten und ist das verbindliche Referenz-Tool.
Monitoring: einmalig reicht nicht
Core Web Vitals sind kein einmaliges Optimierungsprojekt. Jedes neue Plugin, jede Code-Änderung, jede neue Anzeigenkampagne kann die Werte verändern. Monatliche Checks in der Search Console und vierteljährliche Audits mit PageSpeed Insights sind das Minimum. Wer kontinuierlich messen will, integriert die web-vitals JavaScript-Library und schickt die Messwerte an Google Analytics 4 oder ein eigenes Monitoring-Tool.
