25. Mai 2021

#Digitalisierung

Die Optimierung der Ladegeschwindigkeit einer Website kann eine Wissenschaft für sich sein. Mit einigen grundlegenden Tipps kann man jedoch deutlich mehr aus der eigenen Website herausholen.

Website & Pagespeed: In fünf Schritten zur schnelleren Ladegeschwindigkeit

Amazon hat den Einfluss der Ladegeschwindigkeit auf das eigene Business schon vor Jahren untersucht: Eine Steigerung des Pagespeeds um lediglich 100 Millisekunden führte zu rund einem Prozent mehr Konvertierungen. Zalando konnte 2018 ähnliche Zahlen reproduzieren.

Auch Google hat die Auswirkungen erforscht und 2017 in einer Studie die Ladezeit einer Seite künstlich von einer Sekunde aus erhöht und den Effekt auf die Absprungwahrscheinlichkeit der User gemessen. Die Resultate sind deutlich:

• Bei Erhöhung der Ladezeit von einer auf drei Sekunden steigt die Absprungwahrscheinlichkeit um 32 Prozent.
• Bei Erhöhung von einer auf fünf Sekunden steigt sie bereits um 90 Prozent.
• Bei Erhöhung von einer auf zehn Sekunden steigt die Wahrscheinlichkeit, dass der User abspringt, um ganze 123 Prozent.

Die Ladezeit einer Seite ist also ein enorm wichtiger Faktor dafür, wie wahrscheinlich User zu Kunden werden, ob sie Kontakt aufnehmen oder einen Beratungstermin vereinbaren und auch ob sie noch einmal wiederkommen.

Aber nicht nur Kunden lieben schnell ladende Websites, auch Suchmaschinen wie Google & Co werten die Seitengeschwindigkeit aus und bevorzugen schnellere Seiten.

Tipp 1: Bilder optimieren und komprimieren

Bilder machen eine Website für ihre Besucher erst interessant, sind aber auch oft der Hauptschuldige für langsame Ladezeiten. Mit einigen Grundregeln lassen sich Bilder jedoch einfach optimieren.

Bilder nur so groß einbinden, wie sie tatsächlich benötigt werden:

Ein Editorialfoto, das als Blickfang für die Startseite dient, braucht natürlich eine höhere Auflösung als ein Bild, das nur als kleines Zierelement eingesetzt wird. Ein winziges Icon braucht sicherlich keine Full-HD Auflösung von 1920×1080 Pixeln.

Achten Sie auf die richtigen Pixelabmessungen. Moderne Content-Management-Systeme (CMS) und Browsersysteme sorgen zwar meist dafür, dass Bilder in der Darstellung beim User korrekt herunterskaliert werden, allerdings braucht das in der Regel viel Rechenleistung und die Geschwindigkeit leidet.

Bilder komprimieren

Hochqualitative Bilder von Stockfoto-Anbietern oder von der eigenen Spiegelreflexkamera beinhalten unzählige Bildinformationen, die man für die Anwendung im Web häufig nicht braucht. Auch bei hoher Komprimierung und Reduzierung der Details ist die Qualität meist noch mehr als ausreichend für den Internetauftritt. Intelligente Tools helfen bei der Optimierung.

Zusatzinformationen entfernen

Bilder enthalten oftmals Angaben zum Aufnahmeort, der verwendeten Kamera und weitere Daten, die sie nicht benötigen. Ein Entfernen dieser Daten verringert die Dateigröße. Viele Komprimierungstools erledigen das automatisch. Nützliche, derzeit kostenlose Freeware Programme zur Bildoptimierung sind beispielsweise Squoosh und Tiny PNG.

Als Faustregel kann man sich merken: Ein Website Bild sollte keinesfalls mehrere MB groß sein. Reduzieren Sie die Dateigröße so gut es geht und versuchen Sie, sich auf möglichst wenige KB zu beschränken.

Kleine Icons lassen sich häufig recht einfach auf Größen unter zehn KB reduzieren. Für größere Bilder kann man die Dateigröße oft Richtung 100-KB-Marke oder sogar darunter drücken.

Aktivieren Sie gegebenenfalls Lazy Loading: Diese Option sorgt dafür, dass nicht alle Bilder einer Website sofort geladen werden, sondern erst dann, wenn der User scrollt und sie für ihn sichtbar werden. Lazy Loading lässt sich häufig über Plug-ins unkompliziert einrichten (siehe Tipp Nr. 5).

Tipp 2: Hosting-Paket richtig wählen

Wer seine Website nicht direkt auf einem eigenen Server betreibt, benötigt einen Hoster, der Webspace und Serverkapazität zur Veröffentlichung der Seite bereitstellt. Dieser für die Website sollte gut gewählt sein. Angebotspakete vergleichen kann hier sehr hilfreich sein. Egal für welchen Anbieter man sich entscheidet, meist lohnt es sich, nicht gleich zum billigsten Paket zu greifen.

Bei vielen günstigen Tarifen wird beispielsweise eine besonders große Zahl an Websites auf dem gleichen Server gehostet. Sie ahnen es: Die Performance bleibt dabei manchmal auf der Strecke, da jeder Website nur begrenzte Ressourcen zugeteilt werden.

Es gibt auch Webhoster, die sich auf ein bestimmtes Content Management System spezialisiert haben. Wer beispielsweise plant, das beliebte CMS „Wordpress“ einzusetzen, für den kann es sich unter Umständen lohnen, einen spezialisierten Anbieter in Betracht zu ziehen. Das Setup ist dort ideal auf das CMS abgestimmt. Das macht sich meist auch deutlich an der Seitengeschwindigkeit bemerkbar. Spezialisierte WordPress Hoster sind zum Beispiel Raidboxes oder Hostpress.

Zudem sollte der gewählter Hoster bestenfalls das http/2 Protokoll unterstützen. Denn es sorgt für höhere Effizienz und Geschwindigkeit bei der Datenübertragung.

Tipp 3: Dynamische Elemente bedacht und sparsam einsetzen

Dynamische Elemente wie Bild-Slider, animierte Grafiken oder ähnliche Mittel geben einer Seite die richtige Würze und binden das Interesse der Kunden.

Doch Sie sollten solche Elemente gezielt einsetzen, wo es sinnvoll ist und nicht übertreiben. Nicht die gesamte Website muss „blitzen und blinken“. Dynamische Elemente sind ein sehr gutes gestalterisches Mittel, verlangsamen die Website unter Umständen aber deutlich.

Ob und wie stark solche Elemente die Seitengeschwindigkeit beeinflussen, ist allerdings davon abhängig, wie gut die Elemente umgesetzt, programmiert beziehungsweise integriert wurden.

Tipp 4: Unnötige Plug-ins und Analyse Tools deaktivieren

Besonders WordPress-Anwender kennen das: Es stehen unzählige, oft kostenlose Plug-ins zur Verfügung, die mehr oder weniger sinnvolle Zusatzoptionen versprechen. Es spricht prinzipiell nichts dagegen, sich hier auszuprobieren. Denken Sie aber daran, Plug-ins zu deinstallieren oder zumindest zu deaktivieren, wenn sie nicht mehr verwendet werden. Ansonsten werden diese Elemente oft noch im Hintergrund geladen ohne einen Mehrwert zu bringen. Auch das ist nicht gerade von Vorteil für die Ladezeit. Ähnlich verhält es sich mit Analyse- und Tracking -Tools: Wenn Sie bestimmte Analyse Tools nicht mehr verwenden, überlegen Sie, ob Sie das entsprechende Skript ausbauen (lassen). Das Laden unnötiger Tracking-Skripte verlangsamt die Website teils erheblich.

Tipp 5: Plug-ins zur Pagespeed Optimierung

Für viele Content Management Systeme gibt es passende Plug-ins, um die Ladezeit umfangreich zu optimieren. Bekannte Beispiele für WordPress sind Autoptimize oder WP Optimize. Die Grundversionen solcher Plug-ins sind oft kostenfrei, Premiumvarianten werden meist gegen Entgelt angeboten.

Je nach Plug-in gibt es einige leicht verständliche Einstellungen, die man als interessierter Laie selbst vornehmen kann. Je umfangreicher ein Plug-in wird, desto komplexer wird es jedoch. Die Möglichkeiten umfassen beispielsweise die Komprimierung von CSS und Javascript, die Änderungen der Ladereihenfolge von Elementen und Skripten, Cache optimieren, Lazy Loading (siehe Tipp Nr. 1) sowie zahlreiche weitere Optionen.

Gehen Sie bei der Auswahl von Plug-ins zur Pagespeed-Optimierung mit Bedacht vor und ziehen Sie im Zweifelsfall einen Experten zu Rate. Einige fortgeschrittene Optionen können bei falscher Anwendung Probleme verursachen.

Meist ist es mit einem Zurücksetzen der Einstellungen oder einer einfachen Deinstallation des Plug-ins getan, in Einzelfällen wird es jedoch kniffliger. Daher sollte man vor dem Ausprobieren am besten immer ein Backup der Seite erstellen.

Fazit: Kleinigkeiten machen den Unterschied

Viele Tipps können Sie eigenhändig umsetzen. Doch selbst wenn Sie sich nicht an die technischeren Aspekte herantrauen, können Sie allein durch die Wahl des richtigen Hosters und geschickte Bildoptimierung schon sehr viel für Ihre Seitengeschwindigkeit tun. Ihre User und zukünftigen Kunden werden es zu schätzen wissen.