Seit 2021 nutzt Google die Core Web Vitals als Ranking-Signal. 2026 hat ihr Gewicht weiter zugenommen, und Produktseiten sind ihr wichtigstes Einsatzfeld: hochauflösende Bilder, Slider, In-den-Warenkorb-Buttons, dynamische Reviews — alles, was die Performance verschlechtert.
So optimieren Sie die 3 Metriken, die zählen (LCP, CLS, INP), auf einer Produktseite, ohne visuelle Qualität oder UX zu verlieren.
LCP (Largest Contentful Paint) — die Zeit, bis das größte sichtbare Element (typischerweise das Hauptproduktbild) angezeigt wird. Ziel: <2,5 s.
CLS (Cumulative Layout Shift) — die visuelle Stabilität: Elemente dürfen beim Laden nicht springen. Ziel: <0,1.
INP (Interaction to Next Paint) — seit März 2024 ersetzt INP FID. Misst die Verzögerung zwischen einem Nutzerklick (In den Warenkorb, Öffnen eines Menüs) und der visuellen Reaktion. Ziel: <200 ms.
Eine Produktseite, die alle 3 Schwellenwerte im grünen Bereich erfüllt, hat einen Ranking-Vorteil gegenüber Seiten, die das nicht schaffen. Der Abstand kann bei einem umkämpften Keyword 3–5 Positionen ausmachen.
Ein Hero-Bild, das auf dem Bildschirm mit 600×600 Pixeln angezeigt wird, sollte nicht 4000×4000 Pixel groß sein. Liefern Sie das Bild in der richtigen Größe plus eine 2x-Version für Retina-Displays aus:
<!-- ❌ Ursache für CLS -->
<img src="/product.webp" alt="..." />
<!-- ✅ Reserviert den Platz -->
<img src="/product.webp" width="600" height="600" alt="..." />
Auch bei einem responsiven Bild (CSS überschreibt width/height) sollten Sie die HTML-Attribute angeben — sie dienen als Hinweis, um den Platz vor dem Laden zu reservieren.
Ein Banner wie „Kostenloser Versand ab 50 €“, das 500 ms nach dem Laden erscheint und den gesamten Inhalt nach unten schiebt, führt zu katastrophalem CLS.
Lösung: Reservieren Sie den Platz im initialen HTML mit min-height und füllen Sie den Inhalt erst danach.
Wenn Sie eine benutzerdefinierte Schrift laden, kommt sie mit Verzögerung. In der Zwischenzeit wird der Text in einer Fallback-Schrift mit anderen Metriken angezeigt. Wenn die endgültige Schrift geladen ist, verschiebt sich alles.
Lösung: font-display: optional oder font-display: swap mit passendem size-adjust:
Drittanbieter-Bibliotheken (Facebook Pixel, Google Tag Manager, Hotjar, Review-Widgets) sind die häufigsten Verursacher. Jedes Script, das auf dem Main Thread läuft, blockiert Interaktionen.
Lösungen:
Drittanbieter-Scripts nach Möglichkeit mit defer oder async laden
In einen Web Worker auslagern, wenn kritisch
Analytics-Pixel über ein einziges Tag konsolidieren (GTM)
Bewusste Verzögerung: Hotjar nicht vor 3 Sekunden nach dem First Contentful Paint laden
Wenn Sie React/Next/Vue verwenden, kann die anfängliche „Hydration“ den Main Thread 1–2 Sekunden blockieren. In dieser Zeit funktionieren Klicks nicht.
Lösungen:
Server-side rendering mit anfangs begrenztem interaktivem Inhalt
Progressive Hydration: zuerst die kritischen Teile hydratisieren
In Next.js 16+ "use client" sparsam einsetzen — je mehr Komponenten auf dem Server laufen, desto besser ist der INP
Shopify liefert standardmäßig ordentliche Core Web Vitals. Die offiziellen Themes (Dawn, Studio, Crave) sind optimiert. Schlechte Core Web Vitals bei Shopify kommen fast immer von:
Third-party-Apps, die schweres JS einfügen
Schlecht optimierten Premium-Themes von Drittanbietern
Nicht komprimierten Bildern
Audit in Shopify: Entfernen Sie unnötige Apps (Online Store → Apps), verwenden Sie ein aktuelles offizielles Theme und komprimieren Sie die Bilder.
Für CrUX werden 28 Tage an „field data“ aggregiert. Nach dem Deployment von Optimierungen sollten Sie 4–6 Wochen einplanen, bis der Google-Score die Realität widerspiegelt. Bleiben Sie geduldig und rollen Sie nach 1 Woche nicht zurück.
Nein. Der Inhalt (Relevanz, Qualität, Backlinks) bleibt der dominierende Faktor. Core Web Vitals sind ein Tie-Breaker: Bei zwei Seiten mit vergleichbarem Inhalt rankt die mit den besseren CWV höher. Den Inhalt zu verschlechtern, um bei den CWV zu gewinnen, ist kontraproduktiv.
Für eine deutsche Website mit ausschließlich deutschem Publikum: ja — wenn Ihr Server in Deutschland steht und gut konfiguriert ist. Für internationales Geschäft ist ein CDN fast Pflicht. Das kostenlose Cloudflare reicht in 80 % der Fälle aus.
Nein. Mit der richtigen Konfiguration (WebP/AVIF + Abmessungen + CDN + fetchpriority) ist ein 600×600-Bild mit 40 KB in vergleichbarer Qualität zu einem JPEG mit 200 KB möglich. Seit 2023 ist dieser Verzicht nicht mehr nötig.
Die Schwellenwerte ja, aber die Scores werden von Google getrennt gemessen. Eine Seite kann auf Desktop „Good“ und auf Mobile „Poor“ sein (das kommt häufig vor). Google nutzt für das Ranking hauptsächlich die Mobile-Metriken (Mobile-First Indexing).
Einordnung: Wenn Ihre Seiten bereits „Good“ sind, lohnt sich keine weitere Investition. Wenn Sie bei „Needs improvement“ liegen, reichen 1–3 Wochen Entwicklung für die wichtigsten Korrekturen (Bilder, Third-party-Scripts, CDN). Wenn Sie auf allen Seiten „Poor“ sind, ist möglicherweise ein technischer Relaunch nötig — beginnen Sie mit einem vollständigen Audit.
Bei einem Katalog mit 50.000 SKU kostet eine schlecht aufgeteilte Sitemap Wochen bei der Indexierung. So strukturieren Sie eine Produkt-Sitemap richtig.