Core Web Vitals: Was Sie wissen müssen
Core Web Vitals sind Googles Metriken für die Nutzererfahrung. Sie beeinflussen direkt Ihre Rankings – hier erfahren Sie, wie Sie alle drei Metriken optimieren.
Die drei Core Web Vitals
1. LCP (Largest Contentful Paint)
- Misst: Ladezeit des größten sichtbaren Elements
- Ziel: Unter 2.5 Sekunden
- Gut: < 2.5s | Verbesserungswürdig: 2.5-4s | Schlecht: > 4s
2. FID (First Input Delay) / INP (Interaction to Next Paint)
- Misst: Reaktionszeit auf erste Interaktion
- Ziel: Unter 100ms
- Gut: < 100ms | Verbesserungswürdig: 100-300ms | Schlecht: > 300ms
3. CLS (Cumulative Layout Shift)
- Misst: Visuelle Stabilität (Layout-Verschiebungen)
- Ziel: Unter 0.1
- Gut: < 0.1 | Verbesserungswürdig: 0.1-0.25 | Schlecht: > 0.25
LCP optimieren
Hauptursachen für schlechten LCP:
- Langsames Server-Response
- Große, unkomprimierte Bilder
- Render-blockierende Ressourcen
- Client-Side Rendering
Lösungen:
- Bilder optimieren
- WebP-Format verwenden
- Lazy Loading für below-the-fold
- Responsive Images mit srcset
- Server verbessern
- CDN nutzen (Cloudflare, Fastly)
- Caching aktivieren
- Hosting upgraden
- Kritischen Pfad optimieren
- CSS inlinen für above-the-fold
- JavaScript defer/async
- Preload für wichtige Ressourcen
CLS vermeiden
Hauptursachen:
- Bilder ohne Dimensionen
- Dynamisch geladene Werbung
- Web Fonts (FOUT/FOIT)
- Dynamisch eingefügte Inhalte
Lösungen:
- Immer Dimensionen angeben
`<img width="800" height="600" ...>`
- Platzhalter reservieren
- Aspect-ratio CSS nutzen
- Skeleton Loading
- Fonts optimieren
- font-display: swap
- Preload für wichtige Fonts
Tools zum Testen
- PageSpeed Insights: Googles offizielles Tool
- WebPageTest: Detaillierte Wasserfall-Analyse
- Chrome DevTools: Lighthouse-Audit
- Search Console: Echte Nutzerdaten
Quick Wins
- Bilder auf WebP umstellen (-30% Größe)
- Unused CSS/JS entfernen
- Browser-Caching aktivieren
- GZIP/Brotli Kompression
- Kritisches CSS inlinen
Fazit
Core Web Vitals sind kein Nice-to-have – sie sind Ranking-Faktor. Investieren Sie in Performance, und Sie werden mit besseren Rankings belohnt.