Core Web Vitals praktisch erklärt: LCP, INP, CLS
Was die drei Kennzahlen wirklich messen, warum sie sich gegenseitig beeinflussen, und welche drei Eingriffe in den meisten Audits den größten Hebel haben.
von Seitenbefund Werkstatt
Core Web Vitals sind drei Feldmetriken, die Google im Chrome User Experience Report aggregiert. Sie sind kein Laborwert aus einem Lighthouse-Lauf, sondern das, was echte Nutzer mit echten Geräten in echten Netzen erleben. Wer das verwechselt, optimiert auf das falsche Signal.
LCP: das größte Element im sichtbaren Bereich
Largest Contentful Paint misst, wann das größte Bild- oder Text-Element im initialen Viewport gerendert wird. Der Schwellwert für "gut" liegt bei 2,5 Sekunden im 75. Perzentil. Was wir in Audits am häufigsten sehen:
- Hero-Bilder ohne
fetchpriority="high"— der Browser priorisiert CSS und Fonts, das Hero-JPEG kommt zu spät. - LCP-Element wird nach einem Render-Roundtrip via JavaScript eingefügt. Bei Single-Page-Apps mit React 19 ohne Server-Rendering liegt der LCP regelmäßig bei 4 s+.
srcsetfehlt. Mobile lädt das gleiche 2400-px-Bild wie Desktop, Decoding allein dauert 800 ms auf Mid-Range-Android.
Der wirksamste Eingriff: das LCP-Element identifizieren (Chrome
DevTools → Performance → "LCP"-Marker), als <img loading="eager" fetchpriority="high"> markieren, und ein passendes srcset mit
mindestens drei Auflösungen liefern.
INP: die Reaktionszeit auf jede Interaktion
Interaction to Next Paint hat First Input Delay 2024 abgelöst. Der Unterschied: FID maß nur die erste Interaktion, INP misst jede. Schwellwert "gut" ist 200 ms im 75. Perzentil.
Die häufigste Ursache hoher INP-Werte: lange Tasks im Main-Thread. Wenn ein Click-Handler 250 ms blockiert, weil er synchron eine Liste von 5000 Zeilen durchgeht oder ein großes JSON-Objekt parst, sieht INP das.
Englische Fassung: core-web-vitals-explained
Verwandte Beiträge
- SEO3 Min. Lesezeit
Schema.org für KMU: Welche Typen wirklich Wirkung haben
Drei Schema-Typen, die kleine und mittelständische Websites spürbar in Rich Results bringen — und sechs, die zwar gut klingen, aber im Audit nichts bewegen.
Weiterlesen - Recht3 Min. Lesezeit
Cookie-Banner DSGVO-konform bauen — ohne Dark Patterns
Welche Anforderungen DSGVO Art. 7 und TTDSG §25 wirklich stellen, warum die meisten Banner gegen mindestens eine davon verstoßen, und ein minimales Pattern, das beide Pflichten erfüllt.
Weiterlesen