Core Web Vitals beschreiben drei unterschiedliche Teile der wahrgenommenen Website-Qualität: Wie schnell der wichtigste Inhalt erscheint, wie zügig eine Interaktion beantwortet wird und wie stabil das Layout bleibt.

LCP: Wann ist der Hauptinhalt sichtbar?

Largest Contentful Paint misst den Zeitpunkt, an dem das größte sichtbare Inhaltselement gerendert wurde. Häufig ist das ein großes Bild oder eine Überschrift. Ein langsamer LCP kann durch große Dateien, späte Serverantworten, blockierende Styles oder ein erst durch JavaScript erzeugtes Hauptelement entstehen.

INP: Wie schnell reagiert die Oberfläche?

Interaction to Next Paint betrachtet Interaktionen während des gesamten Besuchs. Lange JavaScript-Aufgaben, aufwendige Event-Handler und unnötige Neuberechnungen können die Reaktion verzögern. Die Analyse beginnt deshalb nicht bei Animationen, sondern bei den längsten Aufgaben im Browserprofil.

CLS: Bleibt die Seite an ihrem Platz?

Cumulative Layout Shift bewertet unerwartete Verschiebungen. Häufige Ursachen sind Bilder ohne feste Abmessungen, nachträglich geladene Inhalte oberhalb des sichtbaren Bereichs oder Schriften, deren Wechsel die Textbreite stark verändert.

Feld- und Labordaten trennen

Lighthouse erzeugt Labordaten unter festgelegten Bedingungen. Die Chrome User Experience Report-Daten spiegeln reale Besuche wider. Beide sind nützlich, beantworten aber unterschiedliche Fragen. Ein einzelner Lighthouse-Lauf ist daher kein belastbarer Beweis für die reale Erfahrung aller Nutzer.

Eine sinnvolle Prüfreihenfolge

  • Reale Felddaten und betroffene Seitentypen identifizieren.
  • Das konkrete LCP-Element und seine Abhängigkeiten bestimmen.
  • Lange Aufgaben rund um echte Nutzerinteraktionen messen.
  • Layoutverschiebungen im Performance-Profil lokalisieren.
  • Änderungen erneut unter vergleichbaren Bedingungen prüfen.

Webdesign und Entwicklung bei NJUME →