Mit der Ladezeit einer Website verhält es sich wie mit einem Sportauto: Es bringt uns nicht nur von A nach B, sondern macht vor allem auch aufgrund seiner hohen Geschwindigkeit Spaß. Ist es zu langsam, dann bringt es uns zwar früher oder später ans Ziel, der Spaß bleibt dabei aber auf der Strecke. Im Internet hat ein User in der Regel eine große Auswahl an Webseiten und Online-Shops, die ihm die Informationen und Produkte liefern, die er braucht. Daher ist es überaus wichtig, dem Nutzer eine gute Experience zu bieten, um sich einen Vorteil gegenüber der Konkurrenz zu verschaffen. Das gelingt unter anderem, indem du den Pagespeed deiner Website optimierst. Wir zeigen, welche weiteren Gründe es für eine PageSpeed-Optimierung gibt und was du tun kannst, um deine Website in schnellere Sphären zu lenken.
Warum ist der PageSpeed einer Website so wichtig?
Die Gründe, den PageSpeed einer Website nicht zu unterschätzen, sind vielfältig: User Experience Wer im Internet auf der Suche nach einer passenden Nachttischlampe die Website eines Onlineshops öffnet und erst einige Zeit warten muss, bis die Seite vollständig geladen wurde und Produktbilder zu sehen sind, wird schnell ungeduldig. Die Folge: Man verlässt die Seite wieder und besucht stattdessen die nächste Website, die Google vorschlägt. Für Website-Betreiber bedeutet das im schlimmsten Fall verschenkte Conversions. Denn sucht ein User im Web nach einem Produkt und landet auf einer Website, dann ist es höchst frustrierend, wenn diese langsam lädt. Laut einer Studie von kissmetrics springen 40 % aller User ab, wenn die Ladezeit mehr als drei Sekunden beträgt. Ist der PageSpeed zu langsam, ist die User Experience nicht mehr positiv. Im Umkehrschluss bedeutet das: Je kürzer die Ladezeit, desto weniger Nutzer springen ab – im Optimalfall. Das senkt nicht nur die Bounce Rate, sondern erhöht auch die Verweildauer der Besucher und sorgt im besten Fall für mehr Conversions. Rankingfaktor SEO Für Google ist der PageSpeed einer Website immer noch von großer Bedeutung. Neben der visuellen Stabilität und der Reaktionsgeschwindigkeit zählt daher auch die Ladezeit daher zu den Core Web Vitals – den wichtigsten Kennzahlen für die Page Experience –, die in der Suchmaschinenoptimierung daher nicht außer Acht gelassen werden sollten. Optimierung der Conversion Rate Laut einer Studie verringert sich die Anzahl der Conversion um 7 %, wenn sich das Laden einer Seite um eine Sekunde verzögert. Rechnet man diese Zahlen hoch, kann ein langsamer PageSpeed durchaus dafür verantwortlich sein, dass dein Umsatz sinkt. Insbesondere im E-Commerce ist der PageSpeed relevant. Laden beispielsweise die Seiten eines Onlineshops – die in der Regel viel Content in Form von Bildern oder Videos enthalten – zu langsam, verlässt der User die Website wieder und kauft woanders. Mit einer langsamen Ladezeit verlierst du unter Umständen also potenzielle Kunden. Crawling Last but not least ist der PageSpeed auch für den Googlebot relevant. Langsame Websites crawlt dieser nicht so intensiv wie Seiten mit einem optimierten PageSpeed, was dazu führen kann, dass die Inhalte deiner Website im Google-Index nicht aktuell sind. Der PageSpeed deiner Website sollte also dringend optimiert sein, damit diese jederzeit in den Suchmaschinen auffindbar ist.Woran misst man die Ladezeit?
Die Ladezeit einer Website definiert sich durch den in Sekunden gemessenen Zeitraum zwischen einem Aufruf und dem kompletten Aufbau bzw. der Darstellung der Seite. Im Rahmen einer Messung des PageSpeeds gibt es unterschiedliche Stationen:- Time to First Byte (TTFB): Zeit vom ersten Aufruf der Seite bis hin zum ersten geladenen Byte vom Webservcer.
- First Contentful Paint (FCP): Zeitpunkt der ersten Darstellung eines Elementes im Browser.
- First Meaningful Paint (FMP): Der Moment, an dem der User die Website als „geladen“ empfindet.
- Time to Interactive (TTI): Zeitpunkt, wenn die Website fertig gerendert ist und eine Nutzereingabe erfolgen kann.
Welche Faktoren bestimmen den PageSpeed einer Website?
Auf einige Faktoren, die die Performance deiner Website bestimmen, hast du keinen Einfluss: die Bandbreite des Users, das Volumen des Browsercaches oder die Rechenleistung des Clients beispielsweise. Was du jedoch beeinflussen kannst, um den PageSpeed deiner Website zu verbessern, sind Größen der Dateien, die darauf zu finden sind. Hier gilt: Je kleiner, desto besser. Die Größe deiner Website bestimmt maßgeblich, wie schnell diese geladen werden kann. Sowohl der HTML-Code als auch Skript- und Stylesheet-Daten oder Bilder sollten daher möglichst klein ausfallen, um die Ladegeschwindigkeit zu erhöhen.Optimize me: So kannst du die Ladezeit deiner Website verkürzen
Komprimieren von Bildern Eine gute Website braucht ansprechende Bilder, um attraktiv für Nutzer zu werden. Doch darin steckt auch die Gefahr: Ist die Dateigröße zu hoch, verzögert sich die Ladezeit deiner Website. Daher solltest du darauf achten, alle Bilder zu komprimieren. Dabei gilt: Sowohl hochwertige Grafiken als auch Fotos sollten im WebP- oder JPEG-Format eingebunden werden, kleinere Grafiken im WebP- oder PNG-Format. Für die Zukunft empfiehlt es sich, bei sämtlichen Bildern und Grafiken auf WebP zu setzen. Das von Google entwickelte Bildformat macht es möglich, sowohl Bilder im JPG- als auch im PNG-Format verlustfrei zu komprimieren und wird von den gängigsten Browsern und Programmen unterstützt. Zusätzlich ist es ratsam, im Quellcode der Seite die Maße der Dateien anzugeben. Muss der Browser diese nicht erst selbstständig berechnen, wirkt sich das positiv auf den PageSpeed aus. Meta- und EXIF-Daten, die oft bei Fotos vom Smartphone oder einer Digitalkamera zu finden sind, solltest du entfernen. Angaben wie Aufnahmeort und Kameramodell sind nicht wichtig, sondern nehmen Speicherplatz weg und verlangsamen die Ladezeit. Nutze „Lazy Loading“ Vor allem im E-Commerce-Bereich ist der PageSpeed relevant. Onlineshops, in denen oft viele Bilder auf einmal dargestellt werden, kennen das Problem: Die Ladezeit der Website verlangsamt sich. Für den Nutzer ist das überaus unbefriedigend, was dazu führen kann, dass dieser die Seite sofort wieder verlässt. Viele der Bilder, die geladen werden, sind jedoch für den Nutzer gar nicht sofort sichtbar, sondern erst, wenn er weiter nach unten scrollt. Diese müssten also nicht sofort geladen werden. Die „Lazy Loading“-Methode sorgt dafür, dass Bilder erst dann geladen werden, wenn sie im Sichtfeld des Nutzers sind, was den PageSpeed positiv beeinflusst. Optimierung des Webservers Auch den Webserver solltest du optimieren, um die Ladezeit deiner Website zu verkürzen. Dafür gibt es folgende Möglichkeiten:- Infrastruktur entlasten: Liegt der Fehler beim Host oder gibt es zu viele Anfragen?
- Serverseitiges Caching nutzen: Häufig angefragte Inhalte wie Datenbankanfragen sollten auf dem Server zwischengespeichert werden.
- Browser-Caching verwenden: Eine Zwischenspeicherung seitens des Webservers entfällt bei dieser Methode, der Browser speichert die Daten stattdessen. Beim Abruf müssen dann nicht alle Elemente erneut geladen werden, was zu einer erhöhten Ladegeschwindigkeit führt.
- Quellcode aufräumen: Entferne unnötige Kommentare, überflüssige Leerzeichen und nicht benötigte Formatierungen.
- Nutze externe Skripte nur dann, wenn sie zwingend notwendig sind.
- CSS- und JavaScript-Dateien solltest du auslagern, minimieren und erst am Ende des HTML-Codes einfügen, damit diese erst später geladen werden.
- Erzeuge grafische Elemente per CSS3.
- Nutze Prefetching und Prerendering.
- Reduziere 301-Weiterleitungen so gut es geht.
- Vermeide Bad Requests.
- Verwende Accelerated Mobile Pages (AMP): viele Content-Management-Systeme bieten dafür auch Plugins.