Paginierung versus Lazy-Loading

Wir haben vor ein paar Wochen einen Artikel zum Thema korrekte Paginierung von Seiten im Hinblick auf SEO (Suchmaschinenoptimierung) veröffentlicht. Daraufhin ist die Frage aufgetaucht, wie es eigentlich mit Lazy-Loading aussieht. Was bei der Verwendung von Lazy-Load im Hinblick auf ein optimales SEO und User Experience zu beachten ist, möchten wir in diesem Blogpost genauer anschauen.

Was war im Hinblick auf Paginierung schon wieder wichtig?

Zur Erinnerung: Paginierung bezeichnet die Aufteilung von Übersichtsseiten in mehrere Unterseiten. Als gravierendste SEO Fehler werden Unterseiten mithilfe von Canonical Tags auf die Übersichtsseite verwiesen oder paginierte Seiten mittels «noindex»-Tag vom Index ausgeschlossen.
Im Grunde können doppelte Meta- und Title-Tags bei paginierten Seiten getrost ignoriert oder allenfalls um eine Nummerierung ergänzt werden. Die «rel prev»- und «rel next»-Tags können weiterhin eingesetzt werden, auch wenn Google diese aktuell nicht mehr verwendet. Bei extrem vielen Unterseiten sollte man sich zudem unbedingt eine Strategie überlegen, wie die Crawler auf alle Links gelangen.
Aber was ist eigentlich mit Lazy-Loading?

Was ist Lazy-Loading oder Infinite-Scrolling?

Lazy-Loading oder kurz Lazy-Load bedeutet wortwörtlich «faules Laden» oder «müssiges Laden» und bezeichnet in der Software Entwicklung eine Lösung, bei der Daten dynamisch geladen werden, wenn der Nutzer diese durch Scrollen in den sichtbaren Bildschirm holt. Beispielsweise werden bei einem Onlineshop die Produktbilder erst bei darüber Scrollen geladen. Infinite Scrolling ist dabei das Feature das der Nutzer wahrnimmt, während Lazy-Load die Lösung für die Implementierung ist. Der Vorteil von Lazy-Load ist eine kürzere Ladezeit im Vergleich zu Eager-Load, bei dem alle Daten bei Aufruf der Seite auf einmal geladen werden.

Probleme von Lazy-Loading für SEO

Eine schnellere Ladezeit hat zwar Vorteile für SEO, allerdings sind diese je nachdem zu relativieren. Denn das Laden des Lazy Load Skripts kann wiederum ebenfalls die Ladezeit verlangsamen. Daher sind die Vorteile nur bei sehr grossen Bildern spürbar. Zudem besteht das Problem, dass nicht geladene Bilder für Google grundsätzlich nicht sichtbar sind.
Aus diesem Grund hat Google Im November 2018 einen Artikel zum Umgang mit Lazy-Load herausgegeben.
Damit die Daten für Google sichtbar sind, müssen insbesondere alle relevanten Inhalte für die Lazy-Load-Implementierung im Darstellungsbereich geladen werden. Weiter rät Google zudem die Unterstützung für das Laden von paginierten Seiten einzubinden. So haben Nutzer einerseits die Möglichkeit Inhalte zu teilen. Andererseits hat Google eindeutige Links.

Wie steht es eigentlich um die User Experience bei Infinite Scrolling?

Im Smashing Magazine, einer der führender User Experience Portale, wurde bereits im Jahr 2016 eine interessante Studie publiziert, welche die unterschiedliche Reaktion von Nutzern auf Paginierung, Lazy Loading und «Entdeck mehr»-Buttons untersucht hat.
Dabei wurde Paginierung als langsam wahrgenommen und eine zu grosse Anzahl von Paginierungslinks als hemmend weiter zu «browsen». Dabei haben sich Nutzer insgesamt weniger Produkte angeschaut, dafür mehr Zeit auf der ersten Seite verbracht.
Bei gut eingebautem Lazy-Loading, haben die Benutzer teilweise nicht wahrgenommen, dass nicht alle Produkte geladen werden. Die User Experience wurde insgesamt als angenehmer empfunden. Es scheint als ob sich ein Besucher bei Lazy-Load einen besseren und schneller Überblick über die Produkte verschaffen kann und in seinem Suchverhalten weniger unterbrochen wird. Dafür schaut er die einzelnen Artikel auch weniger genau an.
Ein grosses Problem bei Lazy-Loading ist allerdings, dass bei sehr grossen Seiten, der Nutzer den Footer nicht erreicht. Dieser wird aber häufig für inspirierende Links und für wichtige weiter Informationen wie Versandinformationen oder Kundenservice Daten verwendet.
Insgesamt wird geraten, für Kategorie Seiten eine Kombination von «mehr Entdecken» und Lazy-Loading, für Suchresultate einen «mehr Entdecken»-Button mit einer dynamischen Anzahl von Suchresultaten basierend auf der Relevanz sowie für Mobile einen «mehr Entdecken»-Button mit einer kleineren Anzahl Produkte einzusetzen.

Fazit Paginierung vs. Lazy-Loading

Lazy-Loading kann also neben Page-Speed-Vorteilen auch Vorteile für die Nutzer Erfahrung haben. Allerdings sollte man sich überlegen, wie ein Nutzer dennoch zum Footer gelangt. Aus SEO-Sicht ist ein sauberes Crawling am besten sicher zu stellen, indem alle relevanten Inhalte für die Lazy-Loading-Implementierung im Darstellungsbereich geladen werden und aber dennoch eine Paginierung im Hintergrund einzurichten. Das hilft nicht nur Google, sondern auch den Nutzern, die so einzigartige URLs teilen und aufrufen können. Damit ist die optimale Lösung meist eine Mischung aus Lazy-Loading, Paginierung und «mehr Entdecken»-Button, je nach Anwendung und Ziel.