Lazy Loading WordPress: Richtig einsetzen, Fehler meiden

Lazy Loading WordPress klingt nach einer einfachen Abkürzung zu einer schnelleren Seite: Bilder laden erst, wenn Besucher sie sehen. In der Praxis bremst die Technik aber oft genau das Bild aus, das zuerst auffallen soll. Hier erfährst du, was WordPress schon automatisch macht und wo du selbst eingreifen musst.

Lazy Loading WordPress: Was die Technik macht

Normalerweise lädt der Browser alle Bilder einer Seite sofort – auch die, die erst nach langem Scrollen sichtbar werden. Bei Lazy Loading (zu Deutsch: verzögertes Laden) holt der Browser ein Bild erst, wenn der Besucher kurz davor ist. Das spart Datenmenge und Ladezeit, vor allem auf dem Handy.

WordPress setzt das seit Version 5.5 selbst um: Bilder bekommen automatisch das Attribut loading="lazy". Seit Version 5.9 gibt es eine Ausnahme für die ersten Bilder einer Seite, und seit 6.3 markiert WordPress das vermutlich wichtigste Bild zusätzlich mit fetchpriority="high". Details dazu stehen in den Entwicklerhinweisen zu WordPress 6.3.

Der größte Fehler: Das Hauptbild wird verzögert geladen

Das größte sichtbare Element beim Seitenaufbau heißt LCP (Largest Contentful Paint). Es ist einer der drei Core Web Vitals, mit denen Google die Nutzererfahrung bewertet. Bei den meisten Betriebsseiten ist das LCP-Element ein großes Titelbild oder Hero-Bild.

Wird genau dieses Bild per Lazy Loading zurückgehalten, startet der Download erst spät. Die Seite wirkt träge, obwohl alles „optimiert“ ist. Die Fachseite web.dev hat dazu Daten ausgewertet: WordPress-Seiten mit Lazy Loading hatten einen schlechteren mittleren LCP-Wert als solche ohne.

Die Faustregel ist deshalb einfach:

• Bilder im sichtbaren Bereich (oben auf der Seite): nie verzögert laden.
• Bilder weiter unten (Galerie, Referenzen, Team, Footer): verzögert laden.

Typische Fehler beim Lazy Loading in WordPress

1. Ein Optimierungs-Plugin überschreibt die WordPress-Logik

Caching- und Speed-Plugins bringen oft eine eigene Lazy-Loading-Funktion mit. Die ignoriert manchmal die Ausnahme für das erste Bild. Wer zusätzlich mit einem Cache-Plugin arbeitet, sollte die Einstellungen kennen – wir haben sie in der Caching-Masterclass für WP Rocket und Co. durchgesprochen.

2. Doppeltes Lazy Loading durch mehrere Quellen

Theme, Page Builder und Plugin laden teils jeweils ein eigenes Skript dafür. Das Ergebnis: Bilder erscheinen spät, ruckeln oder bleiben leer. Eine Quelle reicht – am besten die native Browser-Funktion von WordPress.

3. Hintergrundbilder und Slider

Bilder, die per CSS als Hintergrund eingebunden sind, bekommen kein loading="lazy". Manche Plugins lösen das über JavaScript. Ist das Hero-Bild ein Hintergrundbild in einem Slider, lädt es oft doppelt spät. Ein normales Bild-Element ist hier meist die bessere Wahl.

4. Fehlende Bildmaße verursachen Layout-Sprünge

Ohne Breite und Höhe weiß der Browser nicht, wie viel Platz ein verzögertes Bild braucht. Der Text springt, sobald das Bild nachlädt. Das verschlechtert den Messwert CLS (Layout-Verschiebungen). WordPress ergänzt die Maße normalerweise automatisch, Page Builder und eigene HTML-Blöcke nicht immer.

5. Lazy Loading WordPress-weit ersetzt keine Bildkompression

Ein 4-MB-Foto bleibt ein 4-MB-Foto, auch wenn es später geladen wird. Zuerst solltest du die Dateien verkleinern, wie in unserer Anleitung zum Bilder komprimieren beschrieben.

Das kannst du heute tun: Lazy Loading prüfen

1. Öffne deine Startseite im Browser, Rechtsklick auf das große Titelbild, „Element untersuchen“. Steht dort loading="lazy", ist das ein Warnsignal.
2. Teste die Seite mit PageSpeed Insights. Erscheint der Hinweis „Largest Contentful Paint-Bild wurde verzögert geladen“, ist der Fehler bestätigt.
3. Schalte in deinem Cache- oder Speed-Plugin die eigene Lazy-Loading-Funktion für Bilder ab oder trage das Hero-Bild als Ausnahme ein.
4. Prüfe, dass pro Seite nur eine Lazy-Loading-Quelle aktiv ist (WordPress, Theme, Plugin).
5. Messe danach erneut und vergleiche die Werte. Wie du die Zahlen liest, steht im Beitrag Ladezeit der Website messen.

Eine Seite, die auf dem Handy trotzdem lahmt, hat meist mehrere Ursachen. Einen Überblick liefert der Artikel Website langsam auf dem Handy: die 7 größten Bremsen.

Lazy Loading für Videos, Karten und iFrames

Nicht nur Bilder lassen sich verzögern. Auch eingebettete YouTube-Videos und Google-Maps-Karten ziehen beim Laden viel Datenmenge und fremde Skripte nach. Sitzen sie weiter unten auf der Seite, ist Lazy Loading WordPress-seitig auch für iFrames möglich: Das Attribut loading="lazy" funktioniert dort genauso.

Ein praktischer Trick bei Videos: Zeige zunächst nur ein Vorschaubild mit Play-Symbol und lade den Player erst nach dem Klick. Das spart Ladezeit und hilft nebenbei beim Datenschutz, weil erst dann Daten an den Anbieter fließen.

Bei einer Karte im Footer oder auf der Kontaktseite gilt dasselbe. Der Besucher sieht sie erst nach dem Scrollen, also darf sie auch erst dann geladen werden.

Wie du Lazy Loading in Elementor und Page Buildern prüfst

Viele Betriebsseiten laufen mit Elementor oder einem ähnlichen Page Builder. Dort lohnt sich ein genauer Blick, denn Builder erzeugen oft eigene Container mit Hintergrundbildern. Prüfe diese drei Punkte:

• Ist das Hero-Bild ein echtes Bild-Element oder ein Hintergrund im Container?
• Hat das Bild eine feste Breite und Höhe oder ein Seitenverhältnis?
• Gibt es in den Builder-Einstellungen eine eigene Lazy-Loading-Option, die zusätzlich zu WordPress aktiv ist?

Wer Lazy Loading WordPress-weit steuern will, braucht dafür selten Code. Meist genügt es, die doppelten Optionen abzuschalten und das Hero-Bild sauber einzubinden.

Wann lohnt sich Lazy Loading – und wann nicht?

Ehrlich gesagt: Bei einer kurzen Seite mit zwei, drei Bildern bringt Lazy Loading kaum etwas. Spürbar wird der Effekt bei langen Seiten mit vielen Fotos, etwa Referenzgalerien, Speisekarten mit Bildern oder Immobilien-Listen.

• Lohnt sich: Galerien, Blog-Übersichten, Produktlisten, eingebettete Videos und Karten weiter unten.
• Lohnt sich nicht: Logo, Hero-Bild, erstes Bild im Artikel, alles im sichtbaren Bereich.
• Selbst machen: Die Standardeinstellungen von WordPress reichen oft aus – du musst vor allem prüfen, dass kein Plugin dazwischenfunkt.

Wenn du nicht sicher bist, wie deine eigene Seite dasteht, kannst du sie kostenlos analysieren lassen – du bekommst innerhalb von 24 Stunden eine persönliche Auswertung.

Wer sich um solche technischen Details nicht selbst kümmern will, findet bei Hosting und Verwaltung Betreuung, die Wartung und Pflege der Seite übernimmt. Wie das bei umgesetzten Seiten aussieht, zeigen die Referenzen von Jonas Reuber.

Soll die Seite grundsätzlich neu aufgebaut werden, ist ein Relaunch mit sauberer Technik oft sinnvoller als viele Einzelkorrekturen.

Häufige Fragen zu Lazy Loading in WordPress

Ist Lazy Loading in WordPress standardmäßig aktiv?

Ja, Lazy Loading WordPress-intern ist Standard. Seit WordPress 5.5 bekommen Bilder automatisch loading="lazy". Ab Version 5.9 werden die ersten Bilder einer Seite davon ausgenommen. Ein Plugin ist dafür nicht nötig.

Brauche ich ein Plugin für Lazy Loading?

In der Regel nicht. Die native Funktion von WordPress und modernen Browsern genügt für Bilder und iFrames. Ein Plugin lohnt sich nur für Sonderfälle wie Hintergrundbilder, und dann prüfst du den Effekt auf das Hero-Bild.

Schadet Lazy Loading meinem Google-Ranking?

Nicht direkt. Lädt das Hauptbild wegen Lazy Loading zu spät, kann das aber die Core Web Vitals verschlechtern. Google findet verzögerte Bilder normalerweise trotzdem, wenn sie sauber im HTML stehen.

Welche Bilder sollte ich nicht verzögert laden?

Alle Bilder, die beim Öffnen der Seite ohne Scrollen sichtbar sind: Logo, Hero-Bild und das erste große Bild im Inhalt. Alles darunter darfst du verzögert laden.