Es gibt viele Möglichkeiten, die Leistung Ihres WordPress-Blogs zu verbessern. Wir haben über die Verwendung des Caching-Plugins, die Bereinigung und Optimierung Ihrer Datenbank und viele andere Tipps zur Beschleunigung der Ladezeit gesprochen. In diesem Artikel zeigen wir Ihnen, wie Sie die Leistung Ihrer Website weiter verbessern können, indem Sie Ihre Bilder bei Bedarf laden.

Alle Blog-Besitzer wissen, dass Bilder in einem Blog-Post eine wichtige Rolle spielen. In Make Tech Easier verwenden wir gerne viele Screenshots, um das Tutorial übersichtlicher zu gestalten. Es gibt jedoch ein Problem damit. Je mehr Bilder Sie haben, desto langsamer lädt die Website und verwendet mehr Bandbreite. Da wir unser Bilderhosting auf Amazon S3 ausgelagert haben, bedeutet die höhere Bandbreite auch höhere Kosten.

Eine gute Lösung ist das Laden Ihrer Bilder bei Bedarf, oder was allgemein als Lazy Loading bekannt ist.

Lazy Loader ist ein jQuery-Plugin, das das Laden von Bildern auf (langen) Webseiten verzögert. Bilder außerhalb des Darstellungsbereichs (sichtbarer Teil der Webseite) werden nicht geladen, bis der Benutzer zu ihnen scrollt. Bei Websites, die viele Bilder verwenden, kann Lazy Load die Seite schneller laden und die Serverlast (und die Kosten) verringern.

Um nicht ins technische Detail zu gehen, schauen wir uns die (einfachsten) Möglichkeiten an, wie Sie dies in Ihren WordPress Blog integrieren können.

1. jQuery Image Lazy Loader

Ohne Zweifel ist das Plugin die einfachste Möglichkeit, Dinge in WordPress zu vereinfachen. jQuery Image Lazy Loader ist ein solches Plugin, das die Funktion "Lazy Load" in Ihre Site integriert.

Es sind keine Konfigurationen erforderlich. Alles, was Sie tun müssen, ist das Plugin zu installieren und es zu aktivieren.

Sobald aktiviert, funktioniert das Lazy Load-Skript auf allen Seiten der Site.

2. Lazy Loader

Lazy Loader ist ein weiteres Plugin, das die Funktion "Lazy Load" in Ihre Site integriert. Der Unterschied ist, dass es konfigurierbar ist. Das Lazy Loader-Plugin ist im WordPress-Repository nicht verfügbar. Sie müssen also zur Website des Entwicklers gehen und es herunterladen (was bedeutet, dass Sie es nicht direkt von Ihrem WordPress-Dashboard installieren können).

Sobald Sie es heruntergeladen, installiert und aktiviert haben, können Sie im Abschnitt " Einstellungen -> Lazy Loader " das Plugin konfigurieren.

Zu den verfügbaren Optionen gehören das Einfügen des Lazy Load-Skripts auf allen Seiten, Startseite, Posts, Seiten, Kategorie usw. Sie können auch den Grenzwert festlegen (die Anzahl der Bilder, die unterhalb des Ansichtsfensters geladen werden), um Verzögerungen beim Laden des Bildes zu vermeiden.

Andere Optionen umfassen die Ladeeffekte und die Verwendung eines eigenen Platzhalterbildes.

Fazit

Lazy Loading ist eine gute Möglichkeit, die Website-Bandbreite zu reduzieren, die Ladezeit und die Gesamtleistung der Seite zu verbessern. Wenn Sie nur eine Plug-and-Play-Lösung wünschen, sollten Sie jQuery Image Lazy Loader verwenden. Wenn Sie mehr Kontrolle haben wollen, dann ist das Lazy Loader Plugin eine bessere Wahl.

Zu guter Letzt, für diejenigen, die genug beherrschen, möchten Sie vielleicht das Lazy Load-Projekt für eine tiefe Integration in Ihre Website auschecken.

Bildnachweis: Takamorry