Lernen
Speed Index: Was er bedeutet und wie Seiten schneller aussehen
Speed Index zeigt, wie schnell sich der sichtbare Bereich füllt. Dieser Leitfaden verbessert sichtbaren Fortschritt statt nur die finale Ladezeit.
Starte ein frisches DomainLens-Audit und nutze den Report als Prioritätenliste.
Was Speed Index misst
Speed Index schätzt, wie schnell der sichtbare Viewport während des Ladens visuell vollständig wird. Ein niedrigerer Wert bedeutet, dass Nutzer früher sinnvollen Inhalt sehen und die Seite schneller wirkt, auch wenn noch nicht alle Assets geladen sind.
Anders als ein einzelner Zeitpunkt wie FCP oder LCP betrachtet Speed Index den visuellen Fortschritt über Zeit. Er hilft besonders bei Seiten, die Inhalte langsam freigeben, weil CSS, Bilder, JavaScript oder Drittanbieter-Skripte den oberen Bereich blockieren.
Warum Speed Index schlechter wird
- Große CSS-Dateien oder renderblockierende Stylesheets verzögern das erste sichtbare Layout.
- Hero-Bilder und above-the-fold Medien laden spät oder in falscher Größe.
- Schweres JavaScript blockiert Rendering und lässt den Viewport leer oder unvollständig.
- Langsame Serverantwort und schwaches Caching verzögern alle Folgeanfragen.
- Drittanbieter-Skripte konkurrieren beim Start mit kritischen Seitenressourcen.
So verbessern Sie Speed Index
Priorisieren Sie den ersten Viewport. Halten Sie das initiale Layout einfach, inlinen Sie nur kritisches CSS, preloaden Sie das wichtigste Bild oder die wichtigste Schrift und verzögern Sie alles, was für den ersten Bildschirm nicht nötig ist. Ziel ist stetiger sichtbarer Fortschritt, nicht nur ein schnelleres Load-Event.
Reduzieren Sie Main-Thread-Druck durch Entfernen ungenutzten JavaScripts, Bundle-Splitting, verzögerte Third-Party-Tags und weniger teures Client-Rendering für Inhalte, die als HTML kommen könnten. Kombinieren Sie das mit Bildgrößen, modernen Formaten, Cache und CDN.
Häufige Fehler
- Die Gesamtgröße der Seite senken, während der erste Viewport weiter auf blockierendes CSS wartet.
- Above-the-fold Bilder lazy laden, die mit hoher Priorität laden sollten.
- Eine große JavaScript-App ausliefern, bevor Basistext und Layout gerendert sind.
- Nur einen schnellen Desktop-Lauf testen und langsamen mobilen visuellen Fortschritt übersehen.
- Speed Index getrennt von LCP, FCP und TTFB behandeln, statt sie gemeinsam zu lesen.
So validieren Sie den Fix
Vergleichen Sie Filmstrips oder Screenshots vor und nach der Änderung, nicht nur den Score. Der erste Viewport sollte früher und gleichmäßiger gefüllt werden. Prüfen Sie dann, ob FCP, LCP, TTFB und renderblockierende Opportunities in dieselbe Richtung gehen.
Nach dem Deployment starten Sie DomainLens erneut und prüfen zuerst mobile Lighthouse-Daten. Wenn Speed Index besser wird, LCP aber schlecht bleibt, arbeiten Sie weiter am konkreten LCP-Element und an Serverantwort-Fixes.