Google misst Ladezeit. Nutzer messen Ladezeit. Und beide bestrafen langsame Seiten — Google mit schlechteren Rankings, Nutzer mit dem Zurück-Button. Eine Studie von Portent zeigt: Seiten, die in 1 Sekunde laden, konvertieren 3x besser als Seiten mit 5 Sekunden Ladezeit.
Core Web Vitals: die drei Metriken die Google misst
LCP (Largest Contentful Paint): Wann ist das größte sichtbare Element geladen? Ziel: unter 2,5 Sekunden.
INP (Interaction to Next Paint): Wie schnell reagiert die Seite auf Klicks? Ziel: unter 200 Millisekunden.
CLS (Cumulative Layout Shift): Springen Elemente beim Laden? Ziel: unter 0,1.
Diese drei Werte bestimmen, ob Google Ihre Seite als "gut", "verbesserungsbedürftig" oder "schlecht" einstuft — und das beeinflusst direkt Ihre Sichtbarkeit.
Die 8 Maßnahmen mit dem größten Effekt
1. Bilder optimieren (Wirkung: hoch)
Bilder machen 50–70% der Seitengröße aus. WebP statt JPEG spart 25–35% Dateigröße. Lazy Loading sorgt dafür, dass nur sichtbare Bilder geladen werden. Responsive Images liefern die richtige Größe für jedes Gerät.
2. Kritisches CSS inlinen (Wirkung: hoch)
Das CSS für den sichtbaren Bereich wird direkt in den HTML-Head geschrieben. Der Rest wird asynchron nachgeladen. Ergebnis: Der Nutzer sieht sofort eine fertige Seite, statt auf ein weißes Fenster zu starren.
3. JavaScript minimieren und deferred laden (Wirkung: hoch)
Jedes Script blockiert den Seitenaufbau. Mit defer und async laden Scripts parallel statt sequentiell. Code-Splitting teilt große Bundles in kleinere Pakete — der Nutzer lädt nur, was er braucht.
4. Server-Response-Time optimieren (Wirkung: hoch)
TTFB (Time to First Byte) sollte unter 200ms liegen. CDN, Server-Caching und optimierte Datenbankabfragen sind die drei größten Hebel.
5. Fonts optimieren (Wirkung: mittel)
Web-Fonts verursachen FOUT (Flash of Unstyled Text) oder FOIT (Flash of Invisible Text). font-display: swap und Preloading der wichtigsten Font-Dateien lösen das Problem.
6. Third-Party-Scripts auditen (Wirkung: mittel)
Google Analytics, Chat-Widgets, Cookie-Banner, Social-Media-Pixel — jedes externe Script kostet Ladezeit. Audit: Welche sind wirklich nötig? Welche können async oder deferred laden?
7. Caching-Strategie implementieren (Wirkung: mittel)
Browser-Caching speichert statische Dateien lokal. Bei wiederholten Besuchen lädt die Seite deutlich schneller. Cache-Control-Header richtig setzen: lange TTL für Assets, kurze für HTML.
8. Preloading und Prefetching (Wirkung: niedrig-mittel)
Kritische Ressourcen (Fonts, Hero-Bilder, CSS) werden per rel=preload vorab geladen. Für die nächste wahrscheinliche Seite kann rel=prefetch genutzt werden.
Vorher/Nachher: ein reales Beispiel
| Metrik | Vorher | Nachher |
|---|---|---|
| PageSpeed Mobile | 34 | 96 |
| LCP | 4.8s | 1.2s |
| INP | 380ms | 85ms |
| CLS | 0.24 | 0.02 |
| Seitengröße | 4.2 MB | 890 KB |
| Anfragen | 67 | 23 |
Conversion-Rate nach Optimierung: +28% in den ersten 30 Tagen.
Die richtige Technologie-Wahl
Nicht jedes CMS schafft PageSpeed 90+. Die Realität:
- WordPress + Page Builder: PageSpeed 30–60 (mit viel Optimierung: 70–80)
- WordPress + Custom Theme: PageSpeed 60–85
- Headless CMS + React/Next.js: PageSpeed 85–100
- Static Site (Vite, Astro): PageSpeed 95–100
Wer Performance ernst nimmt, baut entweder ein schlankes Custom-Theme oder geht den Headless-Weg.
Fazit
PageSpeed ist kein technisches Detail — es ist ein Geschäftsfaktor. Schnellere Seiten ranken besser, konvertieren besser und kosten weniger Werbebudget pro Conversion. Die meisten Verbesserungen sind mit überschaubarem Aufwand umsetzbar — der ROI zeigt sich innerhalb von Wochen.