3 Tipps, um die Ladezeiten deiner Website zu verbessern

Ich glaube, ich gehöre zu den ungeduldigsten Menschen auf der Welt. Ich warte sehr ungern – egal ob auf meine Verabredungen oder bis sich endlich eine Website geöffnet hat. Lädt eine Website zu lange, bin ich schnell verschwunden! Aber wie lange ist „zu lange“? Das empfindet sicher jeder anders, aber es gibt Studien, die belegen, dass 40% der User deine Website sofort verlassen, wenn sie länger als 4 Sekunden lädt. Sicherlich fragst du dich jetzt, wie du heraus findest, ob deine Website über optimale Ladezeiten verfügt. Dafür gibt es unterschiedliche Tools – zum Beispiel PageSpeed Insights von Google. Hier musst du nur deinen Websiten-Link in das entsprechende Feld eintragen und schon wertet das Tool die Geschwindigkeit deiner Website aus und unterscheidet dabei zwischen zwischen Mobile- und Desktop-Ansicht. Zusätzlich gibt es Tipps, wie du die Geschwindigkeit deiner Website verbessern kannst. Hört sich gut an oder? Der Haken daran? Ich bezweifle, dass du ohne Informatik-Studium oder einer entsprechenden Programmierausbildung die Tipps verstehst bzw. umsetzen kannst. Deshalb möchte ich an dieser Stelle als eine Art Übersetzer auftreten und dir 3 Tipps geben, wie auch du ohne intensivem Informatikstudium deine Website-Ladezeiten verbessern kannst.

Tipp Nr 1: Bilder optimieren
Du möchtest auf deiner „Über mich“ Seite Fotos von dir platzieren und ein Freund war so nett und hat ein paar Schnappschüsse von dir gemacht, dann lade die Bilder bitte nicht in Originalgröße z.B. in 3.500 x 2.800px hoch, sondern komprimiere sie vorher – wenn es kein Titelbild sein soll, reichen sicher auch 600 x 400 Pixel, wenn das Bild noch kleiner angezeigt werden soll, reichen sicher auch 300x 200 px. Dafür brauchst du nicht unbedingt Photoshop, auch das kostenlose Programm Gimp hat diese Funktion.
Wie groß ein Bild ist, kannst du heraus finden, in dem du mit der rechten Maustaste rauf klickst und dann auf „Eigenschaften“ gehst. Es öffnet sich ein Fenster und hier findest du unter dem Tab „Details“, bei Abmessungen die Größe deines Bildes.

Hinzu kommt, dass die Dateigröße von Bildern für die Ladezeiten der Website ausschlaggebend ist.Ich rate zu einer maximalen Größe von 200 KB. Um die Dateigröße anzupassen, musst du die Bilder komprimieren. Dafür brauchst du ebenfalls ein Programm zum Beispiel „Light Image Resizer“. Dabei handelt es sich um ein kostenpflichtiges Programm – 19 Euro, die jedoch gut investiert sind. Bitte beachte, dass beim Komprimieren auch immer ein Stück Bildqualität verloren geht.
Aber keine Panik, wenn du dennoch mal ein Bild zu groß hochgeladen hast: Das Plugin WP Smush schrumpft ein Bild automatisch auf einen ausreichenden Wert.

Tipp Nr 2: Antwortzeit des Servers reduzieren.
Die Antwortzeit des Servers beschreibt dabei die Zeit, die verstreicht, um den HTML-Code deiner Website herunterzuladen.
Sie sieht zum Beisppiel der HTML Code meiner Seite aus:
In der Regel hat man allerdings auf die Antwortzeit des Servers wenig Einfluss, es sei denn deine Seite liegt auf einem eigenem Server. In den meisten Fällen liegt die Website bei einem Webhoster, der mit Sicherheit mehrere Seiten auf dem gleichen Server hostet, was die Ladegeschwindigkeit drosselt.
Dieser Vorgehensweise kannst du trotzdem etwas entgegenwirken zum Beispiel durch die Installation eines Cache-Plugins: Ich arbeite mit dem WP Super Cache. Dieses Plugin funktioniert in etwas so: Dein Server errechnet das Layout deiner Seite, was er dem Besucher dann ausliefert. Die Errechnung erfolgt aus HTML und dynamischen Daten aus der Datenbank. Dein Server wird langsamer, wenn sehr viele Besucher auf deine Seite zugreifen, denn jetzt muss er für jede einzelne Anfrage ein Layout errechnen. Beim Server-Cache wird das Layout jedoch nur einmal errechnet, auf einer Art lokalen Festplatte gespeichert und dann von dort für jeden Besucher ausgegeben. Dadurch werden die Serverabfragen abgefangen und so de Belastung des Servers reduziert.
Diesen Tipp kannst du übrigens auch anwenden, wenn dir PageSpeed Insights „Browser Caching“ anzeigt“.

Tipp Nr 3: CSS reduzieren
Deine WordPress-Website besteht besteht aus den 3 Elementen WordPress, also ein Content-Management-System, dass dir ermöglicht Inhalte einzupflegen, das Theme, welches das Layout deiner Website bestimmt und Plugins, die du als Funktionserweiterungen ansehen kannst. Puhh, da kommt eine Menge an Programmiercode zusammen.
Zum Beispiel liefert jedes WordPress-Plugin seine eigenen Javascript- und CSS Dateien mit und speichert diese im „Head-Bereich“ deiner Website ab. Da jede Datei einzeln eingebunden ist, muss auch jede Datei einzeln vom Browser abgerufen werden. Wenn also ein Besucher deine Website aufruft, wird vom Browser für jede einzelne Datei (z.B. Texte, Bilder, CSS, etc.) eine Anfrage an den Server geleitet. Das nennt man HTTP-Request. Das ist natürlich eine zusätzliche Belastung.
Nutze deshalb das Plugin Autoptimize Nach der Aktivierung solltest du den Haken bei „HTML, CSS und JavaScript optimieren“ setzen. Dieses Plugin reduziert die Daten auf ein Minimum, entfernt unnötige Leerzeichen und –zeilen. Außerdem fasst es mehrere Dateien zu einer zusammen und reduziert so die Abfragen an den Server.
Außerdem solltest du deine Plugins überprüfen, ob du auch wirklich alle benötigst. Plugins, die du du nicht brauchst, bitte nicht nur deaktivieren, sondern sofort löschen.
Da jedes Plugin die Seite ein bisschen schwerer macht, Spuren auf der Datenbank hinterlässt, eine Sicherheitslücke darstellen oder auch mit dem Theme bzw anderen Plugins inkompatibel sein kann, solltest du vor jeder Plugininstallation abwägen, ob du das Plugin wirklich benötigst. Möchtest du ein Plugin erst einmal testen, solltest du das zunächst auf deinem lokalen Server ausprobieren.

Berichte gern unten in den Kommentaren von deinen Erfahrungen mit der Ladezeit und wie du diese optimieren konntest.