Der Erfolg deiner Website hängt von vielen Faktoren ab. Einer davon ist die Ladegeschwindigkeit. Es gibt verschiedene Methoden, um die Geschwindigkeit deiner Website zu messen und die Ergebnisse zu interpretieren, sowie viele verschiedene Tools, die dir bei diesem Vorhaben helfen können. In der heutigen, schnelllebigen Welt sind langsame Websites ein Problem. Mit dem Fortschritt der Internetgeschwindigkeiten kam auch die Nachfrage nach schnell ladenden Websites.
Die Geschwindigkeit einer Website hat einen großen Einfluss auf die Benutzer*innenfreundlichkeit deiner Seite. Jede Person hat sich doch schon einmal über eine langsam ladende Website geärgert. Ausgefallenes Wlan oder eine überlastete Verbindung sind schon anstrengend genug, man möchte sich also nicht zusätzlich auch noch mit einer langsam ladenden Webseite auseinandersetzen müssen, oder? Langsame Websites haben höhere Absprungraten, niedrigere Konversionsraten und sind einfach generell frustrierend für alle Besucher*innen.
Wenn du verstehen willst, wo deine Website in Bezug auf die Geschwindigkeit steht, musst du in der Lage sein, die Leistung deiner Website im Vergleich zu anderen Seiten genau zu messen. In diesem Leitfaden zeigen wir dir, wie du einen Site-Speed-Test genau konfigurieren und die Ergebnisse interpretieren kannst, um aussagekräftige Einblicke in die Leistung deiner WordPress-Site zu erhalten.
Warum die Ladegeschwindigkeit der Seite testen?
Wenn du die Erfahrungen die Nutzer*innen mit deiner Website und insbesondere mit deren Ladezeit nachvollziehen willst, gibt es zwei Möglichkeiten dies festzuhalten:
- Echte Benutzer*innendaten, die darauf basieren, wie lange deine Website für jede*n tatsächliche*n Besucher*in zum Laden braucht – z. B. Pingdom Real User Monitoring.
- Synthetische Geschwindigkeitstests, was die meisten Geschwindigkeitstest-Tools ausführen und worauf wir uns konzentrieren.
Synthetische Geschwindigkeitstests sind viel einfacher durchzuführen und solange du die Geschwindigkeitstest richtig konfigurieren, sollten deine Ergebnisse sehr genau mit den realen Ladezeiten übereinstimmen, die deine Besucher*innen erleben werden.Darüber hinaus kannst du mit synthetischen Tests die Leistung deiner Website bereits während der Erstellung beurteilen und so mögliche Probleme erkennen, bevor du deine Website fertigstellen und öffentlich zugänglich machst.
Wie man einen Website-Geschwindigkeitstest durchführt
Auch hier gilt: Synthetische Tests sind nur gewinnbringend, wenn du sie so konfigurierst, dass du nützliche Daten erhältst. Dazu findest du hier eine Schritt für Schritt Anleitung:
1. Wähle das richtige Speed-Test-Tool
Nicht alle Speed-Test-Tools sind gleich, daher solltest du die Option wählen, die am besten zu der Art des Tests passt, den du durchführen willst.
Verschiedene Tools liefern dir unterschiedliche Daten und unterschiedliche Konfigurationsoptionen – warum diese Konfigurationsoptionen wichtig sind, werden wir in den nächsten Abschnitten behandeln.
Hier sind einige der beliebtesten und nützlichsten Tools:
- GTmetrix – ein flexibles Tool mit einer gut gestalteten Oberfläche. Stelle sicher, dass du dich für ein kostenloses Konto registrierst, um Zugriff auf die Konfigurationsoptionen zu erhalten. Die kostenlose Version erlaubt allerdings keine Tests für mobile Geräte.
- WebPageTest – das am besten konfigurierbare Geschwindigkeitstest-Tool. Großartig zum Testen verschiedener Szenarien. Allerdings ist die Oberfläche etwas veraltet. Du kannst MachMetrics verwenden, um automatisierte tägliche Tests durchzuführen.
- Google PageSpeed Insights – enthält sowohl synthetische Testdaten von Lighthouse als auch reale Leistungsdaten von Google (obwohl reale Daten nur verfügbar sind, wenn deine Website genügend Besuche verzeichnet).
- Lighthouse – ein Open-Source-Tool zur Analyse der Web-Performance. Google PageSpeed Insights basiert auf Lighthouse oder du kannst Lighthouse auch über die Chrome-Entwickler*innenwerkzeuge oder web.dev einsehen.
- Pingdom Tools – dem kostenlosen Tool mangelt es an Konfigurationsmöglichkeiten. Das Interface ist jedoch gut gestaltet. Es bietet auch einen kostenpflichtigen Real User Monitoring Service, wie oben erwähnt.
- Uptrends – ein gut durchdachtes Tool, das alle wichtigen Konfigurationsoptionen unterstützt.
- Fast or Slow – ein hervorragendes Tool zur Beurteilung der globalen Ladezeiten von Wordfence. In einem Test führt es Tests aus 18 verschiedenen Ländern durch.
Du musst dich nicht für ein einziges Tool entscheiden – jede Option kann in bestimmten Situationen nützlich sein. WebPageTest eignet sich zum Beispiel hervorragend, um jeweils einen Standort zu testen, weil es so flexibel ist, während Fast or Slow nützlich ist, um schnell festzustellen, wie die Ladezeiten deiner Website weltweit variieren.
2. Wähle den richtigen Teststandort
Der physische Standort, von dem aus du deinen Geschwindigkeitstest durchführst, beeinflusst deine Ergebnisse. Aus diesem Grund solltest du einen Teststandort wählen, der so nah wie möglich an deiner Zielgruppe liegt:
Wenn die Besucher*innen deiner Homepage an mehreren Standorten oder auf der ganzen Welt verteilt sind, solltest du mehrere Tests von verschiedenen Standorten aus durchführen, um ein besseres Bild von den globalen Ladezeiten deiner Website zu erhalten.
3. Führe Tests für verschiedene Geräte und Browser durch
Das Gerät, das ein*e Besucher*in verwendet, kann einen großen Einfluss auf die Leistung haben. Zum Beispiel brauchen Smartphones mit geringer Leistung länger, um JavaScript zu verarbeiten, was bedeutet, dass eine JavaScript-lastige Website auf diesen Geräten viel langsamer lädt als auf einem leistungsstarken Desktop-Computer. Aus diesem Grund solltest du sicherstellen, dass du zumindest mehrere Geräte testest. Du kannst auch erwägen, mehrere Webbrowser zu testen, um zu sehen, ob es Unterschiede zwischen den Browsern gibt.
4. Achte auf die Geschwindigkeit der Testverbindung
In der realen Welt werden nicht alle deine Besucher*innen die gleiche Verbindungsgeschwindigkeit haben. Einige haben vielleicht eine Hochgeschwindigkeits-Internetverbindung, während andere vielleicht über ein 3G- oder 4G-Netzwerk surfen. Einige Test-Tools, wie z. B. Pingdom, verwenden eine ultraschnelle, ungedrosselte Verbindung für alle Tests. Andere Tools, wie z. B. WebPageTest und GTmetrix, lassen dich eine gedrosselte Verbindung wählen, die den realen Gegebenheiten besser entspricht. Aus diesem Grund wird deine Website bei Pingdom oft „scheinbar“ schneller geladen. Wenn du jedoch die Erfahrungen deiner realen Benutzer*innen genau messen möchtest, solltest du eine gedrosselte Verbindung verwenden, die die tatsächlichen Geschwindigkeiten der Benutzer*innen nachahmt.
5. Führe den Test mehrmals durch
Schließlich solltest du sicherstellen, dass du mehrere Tests durchführst, um die Variabilität eines einzelnen Tests zu vermeiden, die deine Ergebnisse verfälschen kann. Bei einem einmaligen Test könntest du Ausreißerergebnisse erhalten, die deine Website langsamer oder schneller erscheinen lassen, als sie es für die meisten deiner Besucher*innen ist. Einige Tools machen es einfach, mehrere Tests durchzuführen. Zum Beispiel kannst du WebPageTest so konfigurieren, dass bis zu neun separate Tests auf einmal ausgeführt werden und der Medianwert ermittelt wird.
Wie man die Ergebnisse von Website-Geschwindigkeitstests versteht
Nun wollen wir uns damit beschäftigen, wie du die verschiedenen Metriken verstehen kannst, die du in den oben genannten Geschwindigkeitstest-Tools siehst.
Core Web Vitals (Largest Contentful Paint)
Core Web Vitals ist eine neue Initiative von Google, die drei Metriken umfasst, die sich auf die Erfassung der Nutzer*innenerfahrung deiner Website konzentrieren. In Bezug auf die Website-Geschwindigkeit ist die wichtigste Metrik Largest Contentful Paint (LCP). LCP misst, wie lange es dauert, bis der „Haupt“-Content der Website geladen ist. Wenn der Hauptinhalt deiner Website schnell geladen wird, werden die Besucher*innen deine Website als schnell ladend wahrnehmen, auch wenn der Rest des Inhalts länger zum Laden braucht. Der „Hauptinhalt“ ist von Seite zu Seite unterschiedlich, aber in der Regel handelt es sich dabei um den Header-Text oder das Bild im Hero-Bereich deiner Seite. Du kannst den „Haupt“-Inhalt deiner Website mit PageSpeed Insights finden – stelle sicher, dass du sowohl für Mobilgeräte als auch für den Desktop testest, da das Element für beide unterschiedlich sein kann. Google empfiehlt, dass Ihre LCP-Zeit unter 2,5 Sekunden liegt. Um deine LCP zu verbessern, solltest du deine Time to First Byte (eine weitere Metrik auf dieser Liste) beschleunigen, Caching verwenden und andere Best Practices für die WordPress-Performance implementieren
Seitenladezeit
Die Seitenladezeit ist eine schwierig zu verstehende Metrik, da es mehrere Definitionen dafür gibt, was eine Seitenladezeit bedeutet. Um noch mehr Verwirrung zu stiften, verwenden verschiedene Geschwindigkeitstest-Tools unterschiedliche Definitionen für die Seitenladezeit, was ein Grund dafür ist, dass du möglicherweise leicht inkonsistente Daten siehst, wenn du zwei verschiedene Tools vergleichst. Die Schlüsselfrage ist hier „wann ist die Seite fertig geladen?“.
Hier sind die beiden gängigsten Definitionen:
Document Complete – der Punkt, an dem alle statischen Inhalte geladen wurden. Technisch ausgedrückt, wenn das onLoad-Ereignis ausgelöst wird.
Vollständig geladen – der Punkt, an dem alle Netzwerkaktivitäten für zwei Sekunden gestoppt wurden.
Die vollständig geladene Zeit wird fast immer höher sein, da sie zusätzliche Skripte hinter den Kulissen berücksichtigt, die auch dann noch geladen werden, wenn der gesamte statische Inhalt bereits geladen ist. Die Verwendung eines All-in-One-Performance-Plugins wie WP Rocket kann dir helfen, alle wichtigen Best Practices zu implementieren, um deine Ladezeiten zu verbessern.
Time to First Byte
Time to First Byte (TTFB) ist ein allgemeines Maß für die Reaktionsfähigkeit des Servers – Du siehst es vielleicht auch als Server Response Time (SRT). Sie misst, wie lange es dauert, eine Verbindung zum Server herzustellen und das erste Byte des Inhalts herunterzuladen. Google empfiehlt, dass deine TTFB unter 200 ms liegt. Die TTFB wird stark von der Backend-Performance beeinflusst. Die beiden größten Übeltäter für einen hohen TTFB sind langsames Hosting und/oder ein langsamer DNS-Anbieter.
First Contentful Paint und First Meaningful Paint
First Contentful Paint (FCP) und First Meaningful Paint (FMP) haben einige Ähnlichkeiten mit der obigen Largest Contentful Paint-Metrik.
First Contentful Paint misst, wie lange es dauert, bis der erste Text oder das erste Bild gezeigt wird. Der Hauptunterschied zwischen diesem und dem Largest Contentful Paint ist, dass FCP nicht versucht, die „Wichtigkeit“ des Inhalts zu messen. Stattdessen sucht es nur nach dem ersten Stück „beliebigen“ Inhalts.
First Meaningful Paint misst, wann der primäre Inhalt einer Seite für Benutzer*in sichtbar ist. Aufgrund einiger technischer Schwierigkeiten hat Google jedoch First Meaningful Paint in Lighthouse 6.0 durch Largest Contentful Paint ersetzt. Trotzdem kann es sein, dass du FMP noch in einigen Tools findest. Google empfiehlt, dass sowohl Ihre FCP- als auch Ihre FMP-Zeiten unter zwei Sekunden liegen. Die Optimierung deines LCP wird auch diese Metriken verbessern.
Zeit bis zur Interaktivität
Time to Interactive (TTI) misst, wie lange es dauert, bis deine Website für Besucher*innen vollständig interaktiv wird. Nehmen wir an, du hast einen aufklappbaren Bereich hinzugefügt. Die TTI misst, wie lange es dauert, bis dein*e Besucher*in auf den Schalter klickt und deine Website daraufhin reagiert, indem sie den aufgeklappten Abschnitt erweitert. Google empfiehlt, dass deine TTI unter 3,8 Sekunden liegt.
HTTP-Anfragen
Um deine Seite zu laden, muss der Browser eines Besuchers eine HTTP-Anfrage an den Server deiner Website (oder an die Server von Drittanbietern) für jede einzelne Ressource auf deiner Website stellen:
Ein Bild = eine HTTP-Anfrage
Ein JavaScript-Skript = eine HTTP-Anfrage
Ein CSS-Stylesheet = eine HTTP-Anfrage
Etc.
Es gibt keine feste Regel, wie viele HTTP-Anfragen deine Seite haben sollte. Im Allgemeinen gilt jedoch: Je weniger HTTP-Anfragen die Seite benötigt, desto schneller wird sie geladen. Allerdings sind nicht alle HTTP-Anfragen gleich – einige sind größer als andere und/oder brauchen länger zum Laden. Du kannst die Reihenfolge, in der die einzelnen HTTP-Anfragen geladen werden, in einer Wasserfallanalyse betrachten, die die meisten Geschwindigkeitstest-Tools anbieten.
Du kannst HTTP-Anfragen reduzieren, indem du CSS/JavaScript-Dateien zusammenfasst, die Verwendung von Bildern einschränkst und ein Skript-Management-Plugin wie Asset CleanUp oder Perfmatters verwendest. Du solltest auch die Verwendung von Plugins einschränken, da die meisten Plugins ihre eigenen HTTP-Anfragen hinzufügen.
Seitengröße
Die Seitengröße bezieht sich auf die Gesamtgröße deiner Seite. Sie ist die Summe der Dateigrößen des gesamten Codes, der Bilder, Skripte usw. einer Seite. Im Allgemeinen gilt: Je kleiner die Seitengröße der Website ist, desto schneller wird sie geladen, da die Browser der Besucher weniger Daten herunterladen müssen, um die Website zu laden. Einige gängige Taktiken zur Verringerung der Seitengröße sind die Komprimierung von Bildern, die Verwendung von Komprimierungsprogrammen.
Fazit
Teste die Geschwindigkeit deiner Website und optimiere sie für ein besseres Benutzer*innenerlebnis. Um deine Website zu optimieren, ist es wichtig, die Leistung deiner Website zu verstehen. Ohne Daten kannst du nicht wissen, wo deine Website steht und wo sie sich verbessern kann. Wenn du aussagekräftige Daten sammeln möchtest, ist es jedoch nicht so einfach, die URL deiner Website in ein einziges Speed-Test-Tool einzugeben und das war’s dann auch schon.
Es ist wichtig, auf die spezifische Konfiguration deines Tests zu achten – die Anpassung des Standorts, des Geräts und der Verbindungsgeschwindigkeit, um ein genaues Bild davon zu erhalten, wie sich deine Website für verschiedene Arten von Benutzer*innen verhält.
Sobald du die Daten hast, musst du auch die verschiedenen Metriken verstehen und was sie bedeuten. Die Behebung einer langsamen Time to First Byte kann eine andere Taktik erfordern als die Verbesserung der Largest Contentful Paint Time, obwohl es immer eine gewisse Überschneidung in Bezug auf die Best Practices für die Performance gibt.
Zusammengefasst von Anka Steger
Von Website Freiburg
Quelle, unser Websoftware Partner Elementor Pro:
www.elementor.com/blog/test-website-speed/
