Geschwindigkeit

Bilder unterhalb des sichtbaren Bereichs laden sofort

Üblicher Schweregrad: niedrig · Aufwand: minimal

Woran du es erkennst

Mehrere Bilder, die erst beim Scrollen sichtbar werden, haben kein loading="lazy" und werden schon beim initialen Seitenaufruf vollständig geladen.

Warum es zählt

Bilder, die niemand sofort sieht, konkurrieren beim Laden mit den wirklich wichtigen Ressourcen (Hero-Bild, CSS, JS) — sie kosten Datenvolumen, verzögern LCP und verschlechtern gerade auf mobilen Verbindungen den ersten Eindruck.

So behebst du es

  1. Ergänze loading="lazy" an jedem <img>, das beim initialen Viewport nicht sichtbar ist — der Browser lädt es dann erst kurz vor dem Sichtbarwerden.
  2. Lasse das Attribut beim Hero-/LCP-Bild und anderen Above-the-Fold-Bildern bewusst weg (oder setze fetchpriority="high"), damit Lazy-Loading nicht aus Versehen das wichtigste Bild verzögert.
  3. Prüfe auch Iframes (YouTube-, Maps-Einbettungen): loading="lazy" funktioniert dort genauso und spart oft mehrere hundert KB pro Einbettung.
  4. Kontrolliere nach der Umstellung im Netzwerk-Tab, dass Below-the-Fold-Bilder jetzt erst beim Scrollen angefragt werden.

Zum Nachlesen