Core Web Vitals

Core Web Vitals (CWV) sind drei von Google definierte Kennzahlen, die messbare Aspekte der Nutzererfahrung auf Websites quantifizieren. Sie sind Teil des sogenannten Page Experience Signals und wurden 2021 als offizielle SEO-Rankingfaktoren eingeführt.

Was Core Web Vitals von anderen SEO-Metriken unterscheidet: Sie messen nicht, was eine Website sagt oder enthält, sondern wie sie sich für echte Nutzer anfühlt. Ladezeit, Interaktivität, visuelle Stabilität – das sind die Dimensionen, auf denen Google Performance bewertet. Für Webentwickler, Designer und Marketing-Teams sind diese Metriken längst zur Pflichtlektüre geworden.

Was sind Core Web Vitals?

Core Web Vitals sind drei von Google definierte Kennzahlen, die messen, wie schnell, stabil und reaktionsschnell sich eine Website für echte Nutzer anfühlt. Sie sind seit 2021 offizieller Rankingfaktor und Teil des Page-Experience-Signals. Die drei Werte sind: Largest Contentful Paint (LCP) für die Ladezeit des größten sichtbaren Elements, Interaction to Next Paint (INP) für die Reaktionszeit auf Eingaben und Cumulative Layout Shift (CLS) für die visuelle Stabilität während des Ladens. Als gut gelten ein LCP unter 2,5 Sekunden, ein INP unter 200 Millisekunden und ein CLS unter 0,1, jeweils gemessen am 75. Perzentil echter Seitenaufrufe. INP hat im März 2024 die frühere Metrik First Input Delay (FID) abgelöst. Google bewertet die Werte anhand von Felddaten aus dem Chrome-Nutzererlebnisbericht, nicht anhand einzelner Labortests. Wer diese drei Schwellen einhält, stärkt das Ranking und senkt die Absprungrate spürbar, weil eine Seite schneller nutzbar wird und ruhiger lädt.

Die drei Core Web Vitals im Detail

LCP – Largest Contentful Paint

LCP misst, wie lange es dauert, bis das größte sichtbare Inhaltselement (Text, Bild, Video-Thumbnail) im Viewport geladen und gerendert ist.

Was LCP misst:

• Das größte sichtbare Element above the fold
• Typischerweise: Hero-Bild, großes Textblock, Video-Poster-Image
• Wird in Sekunden gemessen, vom Seitenaufruf bis zum vollständigen Rendering

Zielwerte:

Häufige LCP-Probleme:

• Unkomprimierte oder falsch skalierte Bilder
• Kein Preloading des LCP-Elements
• Langsame Server-Antwortzeiten (TTFB)
• Render-blocking JavaScript und CSS
• Fehlende Content Delivery Network (CDN)-Nutzung

Optimierungsmaßnahmen für LCP:

• Bilder im modernen WebP-Format komprimieren
• <link rel="preload"> für das LCP-Element einsetzen
• Server-Antwortzeit unter 200 ms Ziel (TTFB optimieren)
• Kritisches CSS inline stellen, nicht-kritisches CSS lazy laden
• CDN für statische Assets nutzen

INP – Interaction to Next Paint

INP (Interaction to Next Paint) ist seit März 2024 der offizielle Nachfolger von FID (First Input Delay). Es misst die gesamte Latenz jeder Nutzerinteraktion auf der Seite während des Besuchs.

Was INP misst:

• Reaktionszeit auf Klicks, Taps und Tastatureingaben
• Nicht nur die erste Interaktion (wie FID), sondern alle Interaktionen
• Das Ergebnis ist der Wert, der für 75 % aller Interaktionen zutrifft

Zielwerte:

Häufige INP-Probleme:

• Schweres JavaScript, das den Main Thread blockiert
• Lange Tasks (Long Tasks über 50 ms)
• Third-Party-Skripte (Analytics, Chat-Widgets, Social Plugins)
• Komplexe CSS-Animationen und Reflows

Optimierungsmaßnahmen für INP:

• JavaScript-Ausführung optimieren, Long Tasks in kleinere Chunks aufteilen
• Event-Handler-Effizienz verbessern
• requestIdleCallback() für nicht-kritische Skripte
• Third-Party-Skripte lazy laden oder reduzieren
• Virtualisierung für lange Listen (React Virtualized etc.)

CLS – Cumulative Layout Shift

CLS misst die visuelle Stabilität einer Seite. Es quantifiziert, wie viel sich der Seiteninhalt während des Ladevorgangs verschiebt.

Was CLS misst:

• Alle unerwarteten Layoutverschiebungen während der gesamten Sitzung
• Berechnung: Auswirkungsanteil × Distanzanteil der Verschiebung
• Kumulierter Wert aller Verschiebungen

Zielwerte:

Häufige CLS-Ursachen:

• Bilder ohne festgelegte width und height-Attribute
• Werbeanzeigen, die nachträglich geladen werden
• Web Fonts, die nach dem FOUT (Flash of Unstyled Text) nachladen
• Dynamische Inhalte (Banners, Cookie-Banner, Chat-Buttons)
• JavaScript-basierte Inhalte, die nachträglich in die Seite eingefügt werden

Optimierungsmaßnahmen für CLS:

• Alle Bilder mit expliziten Dimensionen versehen (width="800" height="600" oder via CSS aspect-ratio)
• Platzhalterbereiche für Anzeigen reservieren
• font-display: optional oder font-display: swap für Web Fonts
• Dynamische Inhalte an den Seitenrändern oder unterhalb der Hauptinhalte platzieren
• Cookie-Banner erst nach vollständigem Laden einblenden (kein CLS-auslösender Einschub)

Messung der Core Web Vitals

Lab-Daten vs. Felddaten

Lab-Daten (synthetisch): Werden unter kontrollierten Bedingungen simuliert (z. B. durch Lighthouse). Schnell und reproduzierbar, aber spiegeln nicht das echte Nutzerverhalten wider.

Felddaten (real user monitoring): Werden von echten Nutzern in Chrome gesammelt (Chrome User Experience Report, CrUX). Für Google-Rankings relevant. Zeigen tatsächliche Performance unter realen Bedingungen.

Wichtig: Google verwendet für Rankings primär Felddaten. Ein gutes Lighthouse-Ergebnis kann trotzdem schlechte Felddaten bedeuten, wenn z. B. Third-Party-Skripte nach dem Lab-Test geladen werden.

Tools im Überblick

Google Search Console: Core Web Vitals Bericht

Unter „Erfahrung → Core Web Vitals" zeigt die Search Console:

• Gruppierung aller URLs nach LCP, INP und CLS (Gut/Verbesserungsbedarf/Schlecht)
• Problembeschreibungen pro Gruppe
• Entwicklung über Zeit
• Segmentierung nach Desktop und Mobil

Workflow: Search Console für priorisierte Problemerkennung nutzen, dann PageSpeed Insights für URL-spezifische Diagnose, dann Chrome DevTools für tiefes Debugging.

Core Web Vitals und der Ranking-Einfluss

Das Page Experience Signal

Core Web Vitals sind Teil des breiteren Page Experience Signals, das auch HTTPS, keine aufdringlichen Interstitials und Mobile-Freundlichkeit umfasst.

Googles offizielle Position: Page Experience ist ein Rankingfaktor, aber kein dominanter. Inhaltliche Relevanz bleibt wichtiger. In der Praxis bedeutet das:

• Bei gleicher inhaltlicher Qualität gewinnt die Seite mit besserer Page Experience
• Schlechte Core Web Vitals können Rankings aktiv schaden
• Gute Core Web Vitals sind ein „Tiebreaker" und Qualitätssignal

Studienlage

Eine Analyse von Searchmetrics (2022) mit 60.000 Keywords zeigte einen moderaten, aber statistisch signifikanten Zusammenhang zwischen guten Core Web Vitals und Top-10-Rankings. Der Effekt ist auf Mobile stärker als auf Desktop.

Optimierungs-Prioritäten für verschiedene Website-Typen

Unternehmenswebsites und Agenturen

Hauptprobleme: Übermäßige JavaScript-Bundles, schwere Hero-Bilder ohne Optimierung, Cookie-Banner mit CLS.

Prioritäten: LCP (Hero-Image-Optimierung), CLS (Cookie-Banner und Web-Font-Management).

E-Commerce-Websites

Hauptprobleme: Produktbilder ohne Dimensionen, komplexe Filter-Interaktionen, Drittanbieter-Zahlungswidgets.

Prioritäten: CLS (Produktbilder), INP (Filter-Interaktionen), LCP (Produktbilder).

WordPress-Websites

WordPress hat spezifische CWV-Herausforderungen durch Theme-Bloat und Plugin-Overhead.

Maßnahmen: Caching-Plugin (WP Rocket, W3 Total Cache), Bildoptimierung (Imagify, ShortPixel), Lazy Loading aktivieren, unnötige Plugins deaktivieren, Theme-Performance analysieren.

In der Praxis bei PAKU Media

Bei jedem Projekt aus Bielefeld liefern wir Core Web Vitals als Standard, nicht als Add-on: LCP unter 2,5 Sekunden, INP unter 200 Millisekunden, CLS unter 0,1. Als SEO-Agentur aus Bielefeld prüfen wir diese Werte in jedem technischen Audit. Mehr dazu in unserem Webdesign-Service und in der SEO-Beratung.