Warum ist der Pagespeed einer Seite so wichtig? Denn auch wenn es nicht direkt offensichtlich ist, können hohe Ladezeiten einen Einfluss auf deine Newsletter-Kampagnen haben. Wir haben dazu Daniel Flege von Speedrank mal gefragt. Er erklärt dir ganz genau, wie wichtig der Pagespeed für deiner Website ist und welche Tricks helfen können.
Jede Sekunde Ladezeit auf Mobilgeräten reduziert Deine Conversion um bis zu 20 %. Der Faktor Pagespeed gewinnt daher immer mehr an Bedeutung – nicht nur bei Deinen Kunden, sondern auch bei der Suchmaschinenoptimierung. Google selbst kurbelt das Thema an und stellt langsame Seiten demnächst sogar sichtbar an den Pranger. Warum 2020 Dein Pagespeed-Jahr werden sollte und wie Dir das gelingt, verraten wir Dir in diesem Artikel.
Was ist Pagespeed genau?
Der Pagespeed beschreibt die Geschwindigkeit, mit der eine Webseite lädt und fertig gerendert in Deinem Browser angezeigt wird. Dabei geht es jedoch nicht um Die Übertragungsgeschwindigkeit Deines Internetproviders, sondern darum, wie schnell der Anbieter der Seite deren Inhalte bereitstellt.
Rufst Du nämlich eine Adresse in Deinem Browser auf, löst Du damit den sogenannten Request-Response-Zyklus aus. Dein Browser meldet sich beim Server der Webseite und fragt nett an, ob er denn bitte die Bilder, Texte und Videos haben könnte. Der Server des Anbieters wiederum macht sich nun an die Arbeit, sucht alle Dateien zusammen und schickt sie an den Browser zurück.
Nun liegt der Ball beim Browser, der nun aus folgenden Dateien eine funktionierende Webseite zusammenbaut:
- dem HTML-Quellcode, dem Bauplan der Seite
- den CSS-Stylesheets, verantwortlich für den optischen Look
- den JavaScript-Dateien, die für Interaktivität sorgen, z.B. bei Formularen
- und den Mediendateien wie Bildern, Sound-Files oder Videos
Die Zeit, in der der Request-Response-Zyklus durchlaufen wird, um Dir die finale Seite anzuzeigen, ist Dein Pagespeed. Dabei unterscheiden wir noch einmal zwischen dem technischen und dem gefühlten Pagespeed. Alternative Fakten? Naja, nicht ganz, denn auch die gefühlte Ladezeit können wir quantifizieren.
Zu sehr mit technischen Metriken möchten wir Dich nicht langweiligen, daher beschränken wir uns auf zwei Beispielzahlen: den First Contentful Paint und den First Meaningful Paint. Der First Contentful Paint gibt an, wann Deine Nutzer die ersten Elemente Deiner Seite zu sehen bekommen. Von der Navigationsleiste bis zum Lade-Icon kann dies alles sein.
Der First Meaningful Paint zeigt hingegen, wie lange Deine Webseite braucht, um die wichtigen Elemente wie Überschriften, Texte oder Bilder zu rendern. Beide Metriken sind gute Indikatoren für den gefühlten Pagespeed, weil sie Deinen Kunden visuelles Feedback zur Ladezeit geben. Je schneller Elemente auf der Seite auftauchen, desto greifbarer ist der Ladeprozess.
Warum ist Pagespeed so wichtig?
Niemand mag langsame Webseiten. Wenn Du schon einmal einen völlig überladenen Shop mit einer 3G-Verbindung mobil aufgerufen hast, weißt Du, warum. Statt geduldig auf den Aufbau der Seite zu warten, nutzen potenzielle Kunden einfach die schnelleren Angebote der Konkurrenz. Auswahl gibt es im Internet schließlich genug.
Verwendest Du ein Tool zur Traffic-Analyse wie Google Analytics, kannst Du die Auswirkungen eines langsamen Pagespeed oft an folgenden Kriterien erkennen:
- Steigende Bounce Rate, weil User die Seite schnell wieder verlassen
- Sinkende Verweildauer
- Sinkende Click-Through-Rate bei Werbeanzeigen
- Sinkender Traffic
Der letzte Punkt hat nicht nur damit zu tun, dass einmal enttäuschte Besucher oft nicht wiederkommen. Trafficverluste entstehen auch dadurch, dass Google den Pagespeed mittlerweile als offiziellen Ranking-Faktor etabliert hat. Die Suchmaschine gibt dabei schnellen Seiten den Vortritt vor langsamen Megabyte-Monstern – und das nicht nur aus Nächstenliebe dem User gegenüber.
Denn Google hat auch selbst etwas davon. Jede Sekunde, die der Google Bot braucht, um eine Website zu crawlen, kostet Google Ressourcen. Daher legt das Unternehmen für die Indexierung ein sogenanntes Crawl Budget fest. Dauert das Laden einer Seite zu lang, besucht der Bot diese Seite zukünftig weniger, um Ressourcen einzusparen. Das bedeutet, dass neue Unterseiten später indexiert und Änderungen nur langsam bei Google sichtbar werden können.
Du siehst, all das sind Faktoren, die sich schlussendlich auf Deine Conversion und Dein Business auswirken. Weniger Sichtbarkeit bedeutet weniger Besucher, weniger Besucher mit geringer Geduldsspanne oder schlechter Internetverbindung bedeuten weniger Verkäufe. Schlimmer noch: zukünftig möchte Google im Chrome Browser langsame Webseiten mit einem Label versehen und so öffentlich kennzeichnen. Daher solltest Du Deinen Pagespeed genau im Auge behalten und sinnvoll optimieren.
Wie messe ich den Pagespeed meiner Webseite?
Um den Pagespeed einer konkret messen zu können, hat Google vor einigen Jahren das Open Source Projekt Google Lighthouse ins Leben gerufen. Diese Software analysiert die Geschwindigkeit einer Webseite und quantifiziert sie in einem Score-Wert von 0 bis 100, wobei 100 natürlich den absoluten Top-Wert darstellt. Lighthouse gliedert den Test dabei in folgende Kategorien:
- Performance
- Accessibility
- Best Practices
- SEO
Um Google Lighthouse auch für Deine Webseiten nutzen zu können, musst Du kein Entwickler sein. Für Deine Pagespeed Optimierung stehen Dir nämlich zwei Möglichkeiten zur Verfügung: die einmalige Analyse und das kontinuierliche Monitoring.
Eine einmalige Analyse Deiner Web Performance kannst Du kostenfrei mit dem Google Tool PageSpeed Insights vornehmen, welches auf Lighthouse basiert. Du erhältst Deinen persönlichen Score sowie detaillierte Metriken über Ladezeiten und technische Verbesserungsmöglichkeiten.
Der Nachteil: Wenn Du kein großes technisches Fachwissen mitbringst, ist der Report schwer zu verstehen. Außerdem erhältst Du nur eine einmalige Auswertung, die zwar die Fehler, jedoch keine Lösungen aufzeigt. Eine Entwicklung Deiner Performance kannst Du so nicht nachvollziehen – es sein denn, Du führst eine Excel-Liste.
Hier kommen Dir Pagespeed Monitoring Tools wie zum Beispiel Speedrank zur Hilfe. Speedrank nutzt ebenfalls Google Lighthouse und liefert Dir die gleiche detaillierte Analyse wie PageSpeed Insights. Allerdings findet das Testverfahren mehrmals täglich statt und bietet Dir so eine Übersicht der Performance Entwicklung über einen bestimmten Zeitraum.
Statt vor und nach einer Änderung an Deiner Webseite die Tests manuell anzustoßen und die Werte in einer Tabelle festzuhalten, kannst Du Dir bei einem Performance Monitoring Tool bequem den vorherigen und den späteren Wert vergleichen. Speedrank bietet außerdem automatisierte To-do-Listen, die die technisch formulierten Issues aus Google Lighthouse in verständliche Aufgaben umwandeln. Um diese an Deine Entwickler weiterzugeben, exportierst Du ausgewählte To-dos einfach via PDF oder synchronisierst sie mit dem Projektmanagement-Tool Trello.
Ein weiterer Vorteil: In Performance Monitoring Tools lassen sich nicht nur die eigenen URLs, sondern auch die der Konkurrenz eintragen. Hierdurch behältst Du die Entwicklung des Marktes in Sachen Performance im Auge und erfährst, wann die Konkurrenz bei Deinem Wettbewerber eine schnellere Nutzererfahrung erhält. Bei Speedrank informiert Dich zusätzlich ein wöchentlicher Performance Report via E-Mail über Deinen Pagespeed Score sowie den der Konkurrenz.
Wie kann ich meinen Pagespeed optimieren?
Nun weißt Du, vor welchen Problemen Deine Webseiten stehen und welche Erfahrungen Deine Besucher mit Deinen Ladezeiten machen. Jedes Audit ist natürlich individuell und es gibt zahlreiche Kombinationen von Faktoren, daher solltest Du Dir Deine Auswertungen genau anschauen und an den richtigen Stellschrauben drehen. Einige allgemeine Best Practices helfen Dir jedoch beim Kickstart Deiner Pagespeed Optimierung:
- Verkleinere Deine Bilder: Viele Webseiten nutzen zu große oder unkomprimierte Bilder. Das verbraucht nicht nur viel Speicherplatz, sondern sorgt bei Nutzern zusätzlich für lange Ladezeiten. Wenn Du Dir einmal bei Facebook ein Bild im 3G-Netz anschauen wolltest, weiß Du, was wir meinen. Hier helfen Dir Tools zur Bildkomprimierung wie TinyPNG Wenn Du einen Mac hast, kannst Du die vorinstallierte Terminal-Anwendung SIPS nutzen.
- Reduziere und komprimiere Deine JavaScript-Dateien: Wie bereits oben erwähnt sorgt JavaScript dafür, dass unsere Webseiten interaktiv nutzbar sind. Verwendet eine Seite jedoch zu viel JavaScript, verlangsamt das das Rendering und somit auch die Ladezeiten der Seite. Hast Du selbst Zugriff auf den Code, solltest Du schauen, welche JavaScript-Dateien wirklich noch benötigt werden und diese mit einem Tool wie JSCompress komprimieren. Nutzt Du ein Content Management System wie WordPress, heißt das Zauberwort: Plugins ausmisten!
- Aktiviere Caching: Erinnerst Du Dich noch an den Request-Response-Zyklus? Der Browser sendet Anfragen an den Server und der schickt die angeforderten Dateien zurück. Du kannst Deinen Pagespeed optimieren, indem Du hierfür das sogenannte Caching aktivierst. Ein Cache lädt sämtliche Dateien einer Webseite vor, um sie für Browser schneller bereitzustellen. So muss der Server nicht bei jeder Anfrage alles „zusammensuchen“, sondern der Cache stellt sämtliche Dateien direkt bereit. Für die meisten CMS-Systeme existieren hierfür Plugins, oft liefern Hosting-Provider auch eine Cache-Option in ihren Paketen mit. Frage daher einfach bei Deinem Anbieter nach, ob er HTTP Caching unterstützt und für Dich aktivieren kann.
Steigere Deine Conversion durch bessere Pagespeed Optimierung
Du siehst, die Ladegeschwindigkeit einer Seite ist in diesem Jahr wichtiger denn je. Dein Pagespeed hat nicht nur Auswirkungen auf das Kaufverhalten Deiner Kunden, sondern auch auf Dein Ranking bei Google. Und spätestens wenn schlecht performende Seiten in Googles Chrome Browser eine Kennzeichnung erhalten, kann das enorme Auswirkungen auf Traffic und Conversion haben.
Daher solltest Du Deine Pagespeed Optimierung weiter vorantreiben und die Ladezeiten Deiner Seiten regelmäßig analysieren. Mit einem Performance Monitoring Tool wie zum Beispiel Speedrank sparst Du Dir zusätzliche Excel-Listen oder manuelle Analysen. Du möchtest direkt loslegen? Dann schau Dir die Größe Deiner Bilder an und frage Deinen Hosting-Anbieter, ob er für Deine Seite HTTP Caching aktivieren kann.
Deinen Pagespeed Score nach oben zu schrauben, ist nicht nur ein unglaublich tolles Gefühl. Auch Deine Kunden werden es Dir danken – mit weiteren Besuchen und ihrem nächsten Kauf Deines Produktes.
