Was bedeutet das für Ihren Betrieb?
Die Zimmerseite eines Hotels zeigt zwanzig Fotos. Ein Gast öffnet sie am Handy auf der Hütte mit schwachem Netz. Lädt die Seite alle zwanzig Bilder sofort, sieht er lange nichts. Mit Lazy Loading erscheinen Titel, Text und die ersten Bilder rasch, die übrigen folgen, während er nach unten scrollt.
Wichtig ist die Ausnahme: Das erste große Bild im sichtbaren Bereich, oft das Titelbild, darf nicht verzögert werden, sonst wird die Seite langsamer statt schneller. Außerdem sollten Bilder feste Größen haben, damit die Seite beim Nachladen nicht springt. Moderne Browser unterstützen Lazy Loading für Bilder mit einem einfachen Attribut, ohne zusätzliche Software. Nach der Umstellung lohnt ein Test mit gedrosselter Verbindung: Erscheinen Text und erstes Bild zügig, und laden die weiteren Bilder nach, ohne dass die Seite springt, hat es funktioniert.
Worauf Sie achten sollten
- Bilder unterhalb des sichtbaren Bereichs verzögert laden, das Titelbild nicht.
- Breite und Höhe der Bilder angeben, damit nichts springt.
- Eingebettete Karten und Videos erst bei Bedarf laden, auch aus Datenschutzgründen.
- Mit echten Handy-Tests prüfen, nicht nur am Büro-PC.
- Kombinieren mit kleinen Bildformaten wie WebP.
So handhabt es Alpin Systems
Alpin Systems lädt Bilder unterhalb des ersten Bildschirms verzögert und achtet auf feste Bildgrößen. Mehr zu Messwerten und Wirkung steht unter Ladezeit und Core Web Vitals und im Artikel Hotel-Website Ladezeit.
Häufige Fragen
Macht Lazy Loading jede Seite schneller?
Meist die gefühlte Ladezeit, wenn die Seite viele Bilder hat. Falsch eingesetzt, etwa beim Titelbild, kann es die Seite sogar verlangsamen.
Muss ich dafür etwas installieren?
Nein. Für Bilder genügt in modernen Browsern ein Attribut im Bild-Element. Bei Videos und Karten braucht es etwas Programmierung.
Sieht Google verzögert geladene Bilder?
Ja, wenn sie korrekt eingebunden sind. Wichtig ist, dass die Bilder im Quelltext stehen und nicht erst durch Klick erzeugt werden.