Die drei Core Web Vitals 2026

Google misst drei primäre Feldmetriken für das Seitenerlebnis. Jede hat eine Schwelle für „Gute" Leistung:

• Largest Contentful Paint (LCP) — Zeit zum Rendern des größten sichtbaren Elements. Gut: unter 2,5 Sekunden.
• Interaction to Next Paint (INP) — Reaktionsfähigkeit auf alle Benutzerinteraktionen (ersetzte FID im März 2024). Gut: unter 200 ms.
• Cumulative Layout Shift (CLS) — visuelle Stabilität beim Laden. Gut: unter 0,1.

Ein Einwilligungsbanner, das Rendering blockiert, schweres JavaScript beim Laden ausführt oder späte Layout-Änderungen einfügt, kann jedes dieser Signale in die „Verbesserungsbedarf" oder „Schlecht"-Zone schieben — und Google verwendet 28-tägige Felddaten von echten Chrome-Nutzern, sodass vorübergehende Probleme zu dauerhaften Ranking-Signalen werden.

Wie Einwilligungsbanner LCP schaden

Largest Contentful Paint wird normalerweise bei einem Hero-Bild oder einer Überschrift ausgelöst. Mehrere Einwilligungsmuster verzögern es unnötigerweise:

Rendering-blockierende CMP-Scripte

Das synchrone Laden des CMP aus dem Dokumentkopf stoppt das HTML-Parsing, bis das Script heruntergeladen und ausgeführt wird. Wenn der CMP auf einem langsamen CDN gehostet wird oder einen kalten Cache hat, können Sie dem LCP global 200-800 ms hinzufügen.

Banner, der das Hero-Element verdeckt

Wenn das Einwilligungsbanner als modales Overlay positioniert ist, das das LCP-Element abdeckt, messen Browser dennoch den LCP vom verdeckten Element. Wenn das Banner jedoch das größte gemalte Element ist, wird es zum LCP-Kandidaten — und wenn es nach dem Laden der Seite über JavaScript gerendert wird, ist der LCP künstlich hoch.

Lösung: Asynchrones Laden mit kleinem Inline-Bootstrap

Laden Sie das vollständige CMP asynchron (`async` oder `defer`), nur mit einem kleinen Inline-Script für die anfängliche Banner-Anzeige. Zielen Sie auf einen Bootstrap kleiner als 5 KB gzip-komprimiert. Vollständige Verhaltenslogik, Anbieterlisten und UI-Chrome können nach dem ersten Paint Lazy-Loading verwenden.

Wie Einwilligungsbanner INP schaden

Interaction to Next Paint misst die schlechteste Antwortzeit bei allen Klicks, Berührungen und Tastendrücken während einer Sitzung. Cookie-Einwilligungsinteraktionen sind oft die erste Interaktion eines Benutzers — daher ruiniert eine langsame Akzeptieren-Schaltfläche die Punktzahl.

Schwere Arbeit beim Akzeptieren

Viele CMPs führen beim Akzeptieren synchrone Arbeit aus: Laden von 40+ Anbieterskripten, Schreiben in localStorage, Auslösen von dataLayer-Events, Auslösen von Google Consent Mode-Updates. Wenn dies 200 ms überschreitet, leidet INP.

Lösung: Arbeit nach dem Paint einreihen

Beim Klick auf Akzeptieren sofort das Banner ausblenden und schwere Arbeit mit `requestIdleCallback` oder `setTimeout(0)` planen. Der Benutzer sieht, wie das Banner sofort verschwindet; Anbieterskripte laden im Hintergrund, ohne die Interaktion zu blockieren.

Wie Einwilligungsbanner CLS schaden

Cumulative Layout Shift verfolgt unerwartete visuelle Bewegungen. Banner sind eine klassische Quelle von CLS, wenn sie in das DOM eingefügt werden, nachdem der Inhalt gerendert wurde.

Spätes Banner-Einfügen

Wenn das Banner 800 ms nach dem LCP erscheint, schiebt es den Inhalt nach unten und erzeugt eine Layout-Verschiebung. Selbst ein kleines Banner kann einen CLS-Score von 0,1+ auslösen, wenn es einen großen Teil des Viewports betrifft.

Neurendering des Cookie-Präferenz-Widgets

Footer-Präferenz-Widgets, die Anbieterlogs asynchron laden, können den gesamten Footer mehrmals umfließen, was CLS kumuliert.

Lösung: Platz von Anfang an reservieren

Verwenden Sie CSS, um den Banner-Platz vom allerersten Paint an zu reservieren — Platzhalter mit fester Höhe, `min-height` auf dem Footer oder ein unten fixiertes Banner, das den Inhalt nicht verschiebt. Moderne CMPs sollten eine CLS-freie Konfiguration out of the box anbieten.

Google Consent Mode V2 und Leistung

Consent Mode V2 ermöglicht es Google-Tags, vor der Einwilligung in einem cookielosen Zustand zu laufen und Signale über `gtag('consent', 'default', {...})` zu übertragen. Dies ist großartig für die Messkontinuität, aber die gtag.js-Bibliothek selbst ist 50-90 KB groß. Laden Sie sie asynchron und setzen Sie Standardwerte so früh wie möglich, um Race Conditions zu vermeiden.

• Standardwerte setzen, bevor gtag geladen wird — den Consent-Default-Aufruf im Head platzieren, vor dem gtag.js-Script.
• `analytics_storage: 'denied'` als Standard verwenden — minimiert vor der Einwilligung gesammelte Daten.
• Beim Akzeptieren über requestIdleCallback aktualisieren — Blockierung des Haupt-Threads vermeiden.

Messung der CMP-Auswirkung auf Core Web Vitals

Nicht raten — messen. Verwenden Sie diese Tools, um die Auswirkung Ihres Banners zu quantifizieren:

• PageSpeed Insights — Felddaten aus Chrome UX Report plus Lighthouse-Labor-Audit. Vergleichen Sie Scores mit und ohne CMP-Script.
• Web Vitals Chrome-Erweiterung — Echtzeit-LCP, INP, CLS-Overlay beim lokalen Testen.
• WebPageTest.org — Filmstreifen- und Wasserfallansicht zeigt genau, wann das Banner gerendert wird und was es blockiert.
• Search Console Core Web Vitals-Bericht — 28-tägige Felddaten nach URL-Muster gruppiert. Prüfen Sie, ob Landing Pages mit Ihrem Banner anders abschneiden als Seiten ohne.

Wie FlexyConsent schnell bleibt