Zum Hauptinhalt springen
How Can We Help?
< All Topics

Server-Caching sorgt für schnelles HTML. Was danach im Browser passiert, bestimmen Bilder, Fonts, CSS und JavaScript. Google bewertet das mit den Core Web Vitals.

Die Metriken
Metrik Misst Gut
LCP (Largest Contentful Paint) Wann das grösste Element sichtbar ist ≤ 2,5 s
INP (Interaction to Next Paint) Reaktionszeit auf Interaktionen ≤ 200 ms
CLS (Cumulative Layout Shift) Visuelle Stabilität ≤ 0,1

Massgeblich sind Felddaten echter Nutzer (CrUX, Search Console), nicht nur Lighthouse-Laborwerte.

LCP verbessern

  • TTFB senken: Page Cache, CDN, schneller Server.
  • LCP-Bild (meist Hero-Bild) nicht lazy laden und priorisieren. WordPress setzt seit 6.3 automatisch fetchpriority="high" für das vermutete LCP-Bild und lässt es vom Lazy Loading aus; bei Page-Buildern und Slidern stimmt die Erkennung nicht immer.
  • Moderne Formate (WebP, AVIF; WordPress unterstützt AVIF seit 6.5) und passende Grössen (srcset/sizes).
  • Render-blockierendes CSS reduzieren; Block-Themes laden Block-CSS bereits nur bei Bedarf.

INP verbessern

  • JavaScript reduzieren: Page-Builder, Slider, Chat-Widgets, Tag-Manager-Container mit vielen Tags sind typische Verursacher.
  • Skripte mit defer oder async laden. WordPress unterstützt das seit 6.3 nativ über wp_enqueue_script(…, [ 'strategy' => 'defer' ]).
  • Drittanbieter-Skripte erst nach Interaktion oder Consent laden.
  • Die Interactivity API für eigene interaktive Blöcke verwenden statt schwerer Frameworks.

CLS verbessern

  • Bilder und Embeds immer mit width/height bzw. aspect-ratio.
  • Fonts: lokal hosten (Font Library seit 6.5), font-display: swap und passende Fallback-Metriken, nur benötigte Schnitte laden.
  • Cookie-Banner und Werbeflächen mit reserviertem Platz oder als Overlay.

Werkzeuge

  • Performance Lab (Plugin des WordPress-Performance-Teams): testet künftige Core-Features wie Speculative Loading, moderne Bildformate und optimiertes Laden. Speculative Loading (Prerender/Prefetch beim Hover) ist seit 6.8 im Core.
  • PageSpeed Insights, Chrome DevTools (Performance-Panel, Lighthouse), WebPageTest.
  • Search Console: Bericht „Core Web Vitals“ für reale Werte nach URL-Gruppen.

Grundsatzentscheidung

Die grössten Gewinne kommen oft nicht aus Optimierungs-Plugins, sondern aus weniger Code: ein schlankes Block-Theme statt eines schweren Multipurpose-Themes mit Page-Builder, weniger Plugins, weniger Drittanbieter-Skripte.

Weiterführende Artikel

Quellen und Dokumentation

Schlagwörter: