DIE CWV-CHECKLISTE
Die 12-Punkt-Checkliste, die ich durchlaufe, bevor ich eine Website oder ein Template als produktionsbereit erkläre. Konkret, kurz und für den praktischen Einsatz gemacht.
Warum kurze Checklisten funktionieren
Lange Checklisten werden nie verwendet. Die Core Web Vitals-Checkliste, die gewinnt, ist kurz genug, dass ein Engineer sie durchlaufen kann, bevor er in die Produktion geht, ohne dass es sich wie eine Pflicht anfühlt. Meine hat zwölf Punkte.
Websites, die alle zwölf Punkte beim Launch erfüllen, haben selten CWV-Probleme in der Produktion. Websites, die drei oder vier überspringen, scheitern schließlich beim 75. Perzentil und das Team muss es beheben, nachdem Google es bemerkt hat.
Die 12 Punkte
1. Das Hero-Bild wird mit link rel=preload as=image im Head vorgeladen.
2. Bilder im sichtbaren Bereich haben explizite width- und height-Attribute, damit das Layout vor dem Laden Platz reserviert.
3. WebP-Format, Qualität 82, auf tatsächliche Render-Dimensionen vor dem Upload angepasst.
4. Kritisches CSS inline im head, Rest asynchron geladen.
5. Web-Fonts selbst gehostet mit font-display: swap.
6. Initiales JavaScript unter 100KB auf jeder öffentlich zugänglichen Seite.
7. Analytics-, Marketing- und Social-Pixel-Skripte alle verzögert geladen.
8. CSS Grid-Spalten verwenden minmax(0, 1fr) statt 1fr, um Überläufe bei langen Inhalten zu verhindern.
9. Statisches Rendering überall dort, wo der Inhalt es erlaubt.
10. Cloudflare oder gleichwertiges CDN vor dem Origin.
11. Field-Daten wöchentlich über Search Console > Core Web Vitals gemessen.
12. Build-Zeit-SEO-Linter bricht den Build bei Regressionen ab.
Wie du es tatsächlich nutzt
Gehe die Liste manuell durch, bevor du etwas Großes startest. Für laufende Engineering-Arbeit automatisiere die Punkte 6, 8, 11 und 12 in CI; der Rest sind Template-Level-Checks, die zur Design-Zeit stattfinden und selten regredieren.
Wenn CWV in der Produktion regrediert, führt die Regression fast immer auf einen dieser zwölf Punkte zurück, der stillschweigend verletzt wird. Der Diagnose-Ablauf ist: Gehe die Liste durch, finde die Verletzung, behebe sie, warte 28 Tage auf das CrUX-Update, bestätige es.