PageSpeed Optimierung: 9 Best Practices für eine kürzere Website Ladezeit

Drei Sekunden sind nicht viel Zeit. Aber schon drei Sekunden Ladezeit reichen aus, um 50% deiner Websitebesucher zu verlieren. Internetnutzer sind mit der rasanten Entwicklung der digitalen Welt immer anspruchsvoller und ungeduldiger geworden. Lädt eine Internetseite zu lange, verlassen die User sie wieder und besuchen die nächste Seite der Google Ergebnisse. Das ist kritisch. Um eine gute Sichtbarkeit und ein hohes Ranking mit der Internetpräsenz zu erzielen, ist es wichtig, den Usern eine positive Nutzererfahrung zu bieten. Eine schnelle Ladezeit der Seite gehört dazu. Es ist heutzutage sogar schon Voraussetzung für die Nutzer. Wie sich der PageSpeed definiert und mit welchen Best Practices die Ladezeit verringert werden kann, erfährst du in diesem Beitrag!

Was ist PageSpeed genau?

Der englische Begriff PageSpeed bezeichnet die Ladezeit einer Internetseite und umfasst die gesamte Dauer vom Aufrufen einer Seite bis zur Anzeige der Seite im Browser. Die Ladegeschwindigkeit wird auf einer Skala von 0 (schlecht) bis 100 (optimal) gemessen. Mit verschiedenen kostenfreien Tools kannst du den PageSpeed deiner Website messen. Google selbst bietet dafür das Tool PageSpeed Insights an.

Bereits im Jahr 2010 erklärte Google den PageSpeed zu einem Rankingfaktor für Suchmaschinen und er gehört seit dem offiziell zur Onpage Optimierung als Bestandteil der SEO.

Vorteile einer hohen Seitenladegeschwindigkeit

Bessere User Experience

Eine schnell ladende Website ermöglicht den Websitebesuchern eine positive Nutzererfahrung. Die Besucher klicken sich durch mehrere Unterseiten und verbringen mehr Zeit auf der Website. Dadurch steigt nicht nur die Verweildauer, sondern auch die durchschnittlichen Seitenaufrufe. Im Umkehrschluss bedeutet dies eine Verringerung der Bouncerate. Diese Faktoren zählen zu den Rankingfaktoren von Google und beeinflussen daher direkt das Ranking in den SERPs (Search Engine Result Pages). Außerdem wird auch die Conversion Rate durch die User Experience beeinflusst. Nur, wenn Nutzer mit der Website oder dem Webshop zufrieden sind, führen sie gewünschte Handlungen aus.

Erleichterung für den Google Bot

Schnell ladende Websites können von Suchmaschinen Crawlern besser verarbeitet werden, was wiederum die organischen Rankings beeinflusst und Websites sichtbarer macht. Ein guter PageSpeed lässt also nicht nur Menschen schneller sehen, wonach sie suchen, sondern vereinfacht auch Crawlern die Arbeit. Der PageSpeed war demnach schon immer ein wichtiger Bestandteil der Usability-Optimierung und der Suchmaschinenoptimierung. Ein optimierter PageSpeed ist somit unerlässlich für eine gute Sichtbarkeit in Google. Mit folgenden Best Practices kann die Ladezeit einer Website verringert werden.

9 Best Practices zur Verbesserung des PageSpeeds

1. Lass wichtige Inhalte zuerst laden!

Du solltest dafür sorgen, dass relevante Inhalte grundsätzlich zuerst geladen werden. Diese sollten oben im Quellcode stehen, genauso wie Platzhalter für Bilder oder andere Medien. Inhalte, die weniger relevant sind, sollten im Quellcode weiter unten stehen. Dies sind oft stilistische Elemente und Zusatzfunktionen. So wird dem Besucher ohne langes Warten die relevanten Inhalte zur Verfügung gestellt, mit denen er sich beschäftigen kann und in der Zwischenzeit können die restlichen Elemente der Seite geladen werden, die die Seite perfektionieren.

2. Komprimiere Bilder!

Eine weitere einfache Möglichkeit, die Ladezeit der Website zu verringern, ist, den Usern durch das Komprimieren von Bilddateien eine geringere Datenmenge zur Verfügung zu stellen. Dass ein Bild komprimiert wurde, macht sich für den Betrachter in der Regel nicht bemerkbar, erfordert aber weniger Kapazitäten und beschleunigt somit den Download und damit die Ladezeit der Website.

Mit verschiedenen Tools kannst du ganz einfach Bilder für deine Website komprimieren. Wenn du für die Erstellung und Bearbeitung deiner Bilder Photoshop nutzt, kannst du mit der Funktion „Speichern fürs Web“ die Bilder in ihrer Größe reduzieren. Arbeitest du nicht mit Photoshop, kannst du dir stattdessen ein Programm zur Komprimierung deiner Bilder downloaden. Hierfür bietet sich beispielsweise TinyPic an. Wenn du es schnell haben willst und nicht extra ein Programm installieren möchtest, kannst du Online-Tools zur Komprimierung deiner Bilder verwenden, wie zum Beispiel Compressjpeg oder TinyPNG. Dort lädst du deine ausgewählten Bilder hoch und sie werden automatisch komprimiert. Danach kannst du sie ganz einfach wieder downloaden.

3. Sorge für kurze Weiterleitungsketten! 

Sollte es zu einer Änderung der URL oder gar der Domain kommen, sollten lange Weiterleitungsketten verhindert werden. Dass auf die neue Seite umgeleitet werden muss, ist nicht das Problem, sondern dass es zu einer Aneinanderreihung mehrerer Weiterleitungen führen kann, die die Ladezeit der Website stark erhöhen. Wird eine URL beispielsweise zwei Mal geändert, sollte die Weiterleitung nicht von URL 1 zu URL 2 zu URL 3 gehen, sondern immer eine Abkürzung zur aktuellen URL nehmen. URL 1 sollte also direkt zu URL 3 führen und URL 2 genauso.

4. Lass Inhalte per AJAX nachladen!

Da User die gesamte Seite nicht auf einem Blick sehen können, ist es sinnvoll, dass Inhalte, die sofort sichtbar sein werden, zuerst geladen werden. Dies sind in der Regel Inhalte im oberen Bereich der Website. Ist eine Website lang, ist es sinnvoll, sie per AJAX (asynchrone Datenübertragung zwischen Browser und Server) nachladen zu lassen. So werden nämlich unnötige Ladezeiten verhindert. Inhalte die sich nicht im oberen Bereich befinden und für den Besucher ohne Scrollen nicht sichtbar sind, werden nachgeladen. Damit der User während des Scrollens aber auch nicht auf die Inhalte warten muss, werden im Vorfeld, je nach Scrollposition, bereits die Inhalte nachgeladen, die als nächstes sichtbar werden.

5. Komprimiere den Code!

Ob JavaScript, CSS oder HTML – die Dateien sollten unbedingt verkleinert werden. Je kleiner die Dateien deiner Website sind, desto geringer ist die Ladezeit. Überflüssige Zeichen, wie Leerzeichen oder Kommata, sollten entfernt werden. Entferne sogenannte „Whitespaces“ und bringe Code an möglichen Stellen von mehreren Zeilen auf eine Zeile. So werden die JavaScript-, CSS- oder HTML-Dateien reduziert und dies trägt zur Optimierung des PageSpeed bei. Für die Komprimierung dieser Dateien stehen verschiedene Online-Tools zur Verfügung: Closure Compiler für JavaScript, CSS Minifier für CSS und COMPRESS.COM für HTML.

6. Nutze Server-Caching!

Ein weiterer Punkt, der zu einer schnelleren Ladezeit führt, ist die Nutzung von Server-Caching. Hierbei werden Ergebnisse der ersten Aufrufe auf dem Server gespeichert und dadurch der Server und die Datenbank entlastet. Bei folgenden Aufrufen der Website wird dann auf den Server-Cache zurückgegriffen und so eine komplexe Abfrage der Seite umgangen. Dadurch wird die Ladegeschwindigkeit deutlich verkürzt. Das Server-Caching lässt sich in den Einstellungen der Webserver-Software einrichten

7. Nutze Browser-Caching! 

Dann gibt es noch das Browser-Caching, welches die Ladezeit deiner Website verkürzen kann. Es unterscheidet sich vom Server-Caching darin, dass sich die gespeicherten Daten auf dem Endgerät, wo der Browser ist, befinden. Bei wiederkehrenden Besuchen werden also Elemente im Browserspeicher des Besuchers abgelegt und beim erneuten Besuchen der Website auf diesen Speicher zurückgegriffen. Dadurch müssen die Elemente nicht erneut geladen werden und die Website kann schneller laden. Das Broswer-Caching lässt sich über Plugins einrichten, wie zum Beispiel mit diesen WordPress Plugins: WP Rocket und WP Fastest Cache.

8. Lasse JavaScript und CSS asynchron laden!

Inhalte einer Website werden immer in der Reihenfolge geladen, wie sie im Code zu finden sind. Wird kein asynchrones Laden verwendet, wird Schritt für Schritt ein Element nach dem anderen geladen. Erst, wenn ein Element vollständig verarbeitet wurde, kann das nachfolgende Element geladen und angezeigt werden. Da einige Inhalte der Website, wie beispielsweise Skripte für das Tracking, am Anfang verarbeitet werden sollten, wird das Laden von wichtigen Elementen für den Nutzer folglich gebremst. Durch asynchrones Laden wird dieses Problem behoben, denn Elemente können parallel verarbeitet werden.

9. Nutze Bilder mit vollständigen Größenangaben und richtigem Dateiformat!

Füge jedem Bildelement die Größenangaben „width“ und „height“ hinzu. Hierdurch wird dem Bild ein Platz vom Browser reserviert und das Bild kann nachgeladen werden. Wichtigere Elemente, wie Text oder Tabellen, können somit schneller für den Nutzer angezeigt werden, wodurch sich die gefühlte Ladezeit für den Nutzer reduziert. Des Weiteren sollte das richtige Dateiformat verwendet werden, um unnötigen Ballast durch zu große Bild-Dateien zu vermeiden.

Es existieren zahlreiche Möglichkeiten, den PageSpeed zu optimieren. Da der PageSpeed ein wichtiger Rankingfaktor in Google ist, sollten Websitebetreiber unbedingt für eine schnelle Ladezeit der Website sorgen, um das Ranking ihrer Internetseite zu optimieren. 

Du brauchst Hilfe bei der Optimierung deines Pagespeeds? Kontaktiere uns! Wir sind deine SEO Agentur und kümmern uns um all deine Angelegenheit rund um das Suchmaschinenmarketing!