Lazy Loading: nützlich, aber nicht überall

Lazy Loading klingt nach einer einfachen Performance-Optimierung. Bilder, die noch nicht sichtbar sind, werden erst dann geladen, wenn der Nutzer sich ihnen nähert. Spart Bandbreite, beschleunigt die Seite, reduziert Last. So weit die Theorie.

In der Praxis ist die Technik oft pauschal aktiviert und sorgt dann nicht für eine bessere, sondern für eine schlechter wirkende Seite. Wer Lazy Loading sauber einsetzen will, muss verstehen, wann es hilft, wann es neutral ist und wann es Schaden anrichtet.

Was Lazy Loading wirklich tut

Lazy Loading verschiebt das Laden eines Elements auf einen späteren Zeitpunkt. Standardmässig betrifft das Bilder und IFrames. Der Browser lädt sie erst, wenn sie nahe an den sichtbaren Bereich rücken. Das bedeutet:

• weniger Daten beim Erstaufruf
• schnelleres initiales Rendern
• geringere Last bei Bildern, die nie gesehen werden

Das wirkt automatisch positiv. Genau deshalb ist Lazy Loading in vielen CMS, Themes und Page Buildern als Standard aktiviert.

Warum "alles lazy" nicht klug ist

Das Problem entsteht, wenn ein Element, das schon im sichtbaren Bereich liegt, ebenfalls als Lazy markiert wird. Dann wartet der Browser unnötig auf einen Sichtbarkeits-Trigger, bevor er das Element lädt. Das verschlechtert insbesondere LCP, also genau die Metrik, die misst, wie schnell die Seite "ankommt".

Eine pauschale Aktivierung ist deshalb selten klug. Sie macht aus einer Optimierung einen kleinen Bremsklotz für genau die wichtigste Stelle. Wer LCP-Bilder lazy lädt, verschenkt Eindrucksgeschwindigkeit, ohne dafür Bandbreite zu sparen.

Wo Lazy Loading sicher hilft

Lazy Loading ist dort wertvoll, wo Bilder nicht im ersten Sichtbereich liegen und nicht jeder Nutzer bis dorthin scrollt. Typische Beispiele:

• Bildergalerien weiter unten auf der Seite
• lange Inhaltsseiten mit vielen Visuals
• eingebettete Karten unter dem Fold
• Vorschaubilder von Blog-Übersichten unterhalb der Hero-Sektion
• Inhalte in Akkordeons, die geschlossen starten

An diesen Stellen reduziert Lazy Loading den initialen Aufwand spürbar. Und weil viele Besucher gar nicht scrollen, werden manche dieser Bilder nie geladen.

Wo Lazy Loading nicht hingehört

Es gibt klare Stellen, an denen Lazy Loading konsequent vermieden werden sollte:

• das LCP-Element, also das grösste sichtbare Bild
• Logos und Markenbilder im Header
• Hero-Visuals auf Startseiten und Landingpages
• alles, was die erste Sekunde des Seiteneindrucks prägt

Diese Bereiche sollen so früh wie möglich erscheinen. Lazy Loading verzögert sie an genau der falschen Stelle.

IFrames sind ein Sonderfall

Lazy Loading wirkt nicht nur auf Bilder. Auch IFrames profitieren stark, weil sie meistens externe Inhalte laden. Karten, Videos oder Embeds bringen oft mehr Last als das Hauptbild der Seite mit. Wenn solche Elemente erst dann laden, wenn sie wirklich sichtbar werden, entlastet das Performance, INP und Datenvolumen gleichzeitig.

Mobil ist Lazy Loading wichtiger als auf Desktop

Auf grossen Bildschirmen sieht der Nutzer beim Scrollen schneller mehr Inhalt. Auf Smartphones fällt der Unterschied zwischen sichtbar und unsichtbar dagegen sehr stark ins Gewicht. Hier kann Lazy Loading einen sehr deutlichen Effekt haben, weil unter dem Fold oft viel mehr versteckt ist als auf Desktop.

Gleichzeitig sind mobile Verbindungen oft langsamer. Jedes Bild, das nicht sofort geladen werden muss, ist eine spürbare Entlastung. Mehr zur grösseren Einordnung steht im Beitrag zur Website-Performance für Unternehmen.

Häufige Fehler in der Praxis

Bei Audits sehen wir immer wieder dieselben Muster:

• Lazy Loading ist pauschal an, auch für das Hero-Bild
• das CMS macht es automatisch, ohne Ausnahme
• keine bewusste Unterscheidung zwischen "above" und "below the fold"
• IFrames werden gar nicht lazy geladen, obwohl es viel bringen würde
• die Implementierung wartet zu lange, bevor das Bild wirklich erscheint

Diese Punkte sind keine Katastrophen, aber sie summieren sich. Genau dieselbe Logik gilt für viele Themen rund um Bilder, wie der Beitrag Bilder auf der Website richtig optimieren zeigt.

Pragmatische Reihenfolge

Wenn du Lazy Loading bewusst einsetzen willst, hilft eine klare Reihenfolge:

• das LCP-Element auf jeder wichtigen Seite identifizieren
• dort Lazy Loading explizit ausschalten
• alle Bilder unterhalb des sichtbaren Bereichs lazy laden lassen
• IFrames und Embeds konsequent lazy einbinden
• im CMS klare Defaults setzen, statt jede Seite einzeln zu konfigurieren

Diese Reihenfolge sorgt dafür, dass Lazy Loading dort wirkt, wo es Sinn ergibt, und nicht dort, wo es bremst.

Fazit und nächster Schritt

Lazy Loading ist nicht falsch oder richtig, sondern eine Technik mit klarem Anwendungsbereich. Pauschal aktiviert hilft sie selten so viel wie versprochen. Bewusst eingesetzt entlastet sie Performance ohne Nachteile.

Wenn du nicht sicher bist, wie Lazy Loading auf deiner Website konfiguriert ist, lässt sich das in einer kurzen Bestandsaufnahme meist klar einordnen. Oft reicht ein Blick auf das LCP-Element der Startseite, um die wichtigste Frage zu beantworten.