Neu im App-Installer: Mautic 4
Das Marketing-Automatisierungs-Tool Mautic 4 ergänzt unseren App-Installer und steht Ihnen jetzt zur Installation zur Verfügung.
Wer die Ladezeit seiner Website messen möchte, findet eine Menge kostenfreier Tools auf dem Markt. Dazu gehören unter anderem PageSpeed Insights, Pingdom oder GTmetrix. Doch Firefox und Chrome bieten direkt im Browser eine gute Möglichkeit, die Ladezeit einer Website zu messen. Wie das geht und worauf Sie achten sollten, erfahren Sie in diesem Beitrag.
Die Entwicklertools in Firefox und Chrome zum Messen der Ladezeit einer Website unterscheiden sich kaum in Darstellung und Handhabung. Nehmen Sie daher ihren favorisierten Browser zum Messen der Ladezeit. Öffnen Sie im Firefox oder Chrome die zu untersuchende Webseite und starten Sie mit der Taste F12 die Entwicklertools. Oder wählen Sie das passende Tastaturkürzel. Und keine Sorge: Sollten Sie Microsoft Edge als Browser nutzen, können Sie die Analyse der Ladezeit auch damit vornehmen. Da Edge mittlerweile auf Chromium basiert, funktioniert er in weiten Teilen ähnlich wie Chrome.
Windows Tastenkombination | macOS Tastenkombination |
|
|
Die Entwicklertools lassen sich unten, rechts, links oder im eigenen Fenster anzeigen. Möchten Sie die Ansicht ändern, klicken Sie auf die drei Punkte auf der rechten Seite und treffen Sie Ihre Auswahl.
Ist die Ansicht wie gewünscht, klicken Sie auf den Reiter "Netzwerk", "Netzwerkanalyse" oder "Network". Der Name variiert je nach Browser und Spracheinstellung. Im Übrigen sind die Entwicklertools in Chrome seit einiger Zeit auch auf Deutsch verfügbar. Die Sprache kann hier direkt in den Entwicklertools gewählt werden, unabhängig von den Spracheinstellungen des Browsers. Beim Firefox hingegen richtet sie sich nach den allgemeinen Browsereinstellungen.
Wählen Sie Netzwerk (bzw. Netzwerkanalyse, Network).Vor der Messung des Pagespeeds muss der Haken bei "Disable Cache" / "Cache deaktivieren" gesetzt werden. Das hat zur Folge, dass in dem Tab, in dem die Entwicklertools geöffnet sind, der Browsercache deaktiviert wird. Damit beeinflussen keine gecachten Informationen oder Dateien die Ergebnisse beim Testen. Sobald die Entwicklertools geschlossen werden, lädt der Browser die Daten wieder aus dem Cache. Beim nächsten Öffnen sollte die Checkbox "Disable Cache" / "Cache deaktivieren" weiterhin aktiviert sein. Um sicher zu gehen, werfen Sie einen kurzen, prüfenden Blick darauf. Wenn Sie die Entwicklertools das erste Mal aktiv nutzen, setzen Sie den Haken und aktualisieren Sie die Seite (zum Beispiel mit der Taste F5).
Checkbox bei "Disable Cache" aktivieren. Seite noch einmal aktualisieren (F5).Die Entwicklertools sind geöffnet und alle Einstellungen vorgenommen. Im Anschluss wurde die Seite noch einmal aktualisiert. Daraufhin erhalten Sie das Ergebnis der Messung für die Ladezeit im Firefox oder Chrome. Die Anzeige erfolgt in einer Liste und wird durch ein übersichtliches Wasserfall-Diagramm ergänzt. Worauf sollten Sie jetzt achten? Was sind die wichtigen Angaben? Grundsätzlich lässt sich die Ladezeit einer Webseite in verschiedene Messwerte einteilen. Insgesamt gibt es vier:
Die TTFB ist der erste Wert im Wasserfall-Diagramm und die anderen kommen in der Abfolge. Es handelt sich dabei um das "HTML Dokument" - Typ "html". Die Zeitangabe in dieser Zeile ist die TTFB. Dieser Wert zeigt an, wie lange der Server brauchte, um Ihre Seite auszuliefern. Neben dem Server beeinflussen auch die für die Website verwendete Software und deren Konfiguration diesen Wert. Sprechen wir als Hoster von einem schnellen Server, dann liegt dieser Aussage die TTFB zugrunde.
Die Time to First Byte (TTFB) zeigt an, wie lange der Server brauchte, um Ihre Seite auszuliefern.Die Ergebnisse der Analyse werden untereinander aufgelistet. Ist nichts anderes eingestellt, erscheinen die Elemente in der Reihenfolge, in der sie geladen werden. Die Liste gibt an, um welches Element es sich handelt, den Typ, die Größe und die Ladezeit. Rechts befindet sich ein übersichtliches Wasserfall-Diagramm. Dieses bietet einen visuellen Blick auf die Ladezeiten der einzelnen Elemente. Unter der Liste gibt es drei Werte, die eine erste Aussage zur Ladegeschwindigkeit einer Webseite zulassen:
In Edge weichen die Bezeichnungen hier etwas ab, liefern Ihnen jedoch die gleichen Informationen wie Chrome und Firefox.
Die Listenansicht gibt eine Übersicht über alle Elemente, die beim Seitenaufbau geladen werden. Für jeden einzelnen Punkt lassen sich Details anschauen und prüfen. Dafür klicken Sie in die Zeile, die Sie betrachten möchten und wählen hier den Reiter "Zeit" oder "Timing". In der Ansicht, die sich öffnet, zeigt beispielsweise der Wert "Warten", wie lange es bis zur TTFB dieses Elements dauert. Die Detailansicht gibt außerdem Aufschluss darüber, ob durch DNS-Abfragen oder TLS-Konfigurationen Verzögerungen in der Ladezeit dieses Elements entstehen. Diese ersten Angaben zeigen, bei welchen Elementen eine Optimierung möglich ist. Außerdem finden Sie dort Hinweise auf sogenannte Blocker, worauf wir im nächsten Punkt noch näher eingehen.
Bei der Messung der Ladezeit mit Firefox und Chrome lassen sich Elemente mit einer sehr langen Ladezeit schnell identifizieren. Scrollen Sie durch das Wasserfall-Diagramm. Sie sehen auf einen Blick, welche Elemente eine überdurchschnittliche Ladezeit im Vergleich zu den anderen Elementen haben. Es kann sich dabei zum einen um einen Bestandteil auf der eigenen Seite handeln. Zum anderen stecken dahinter oftmals Angebote von Dienstleistern, Plugins von Drittanbietern, Cookies, Analytics, ein Live-Chat oder ähnliche Faktoren. Wo das jeweilige Problem liegt, können Sie sich direkt mit einem Klick auf die Zeile in der Detailansicht anschauen (siehe Screenshot unten).
Auf dem Screenshot sehen Sie in der Detailansicht einen sogenannten "Blocker". Diese werden häufig verursacht, wenn im Browser alle verfügbaren Verbindungen belegt sind. Alle weiteren Versuche eine Verbindung aufzubauen, werden dann "blockiert". Eine weitere Ursache für Blocker können Plugins sein, deren Abfrage auf dem externen Server sehr lange dauert. Blocker beeinflussen die Ladezeit negativ und sollten natürlich vermieden werden. Das könnte durch das Entfernen des Elements möglich sein (wenn möglich) oder durch asynchrones Laden der Webseite.
Die Untersuchung der Ladezeit im Firefox oder Chrome ermöglicht somit eine sehr detaillierte Untersuchung auf Basis der einzelnen Elemente. Mit einer Optimierung der einzelnen Elemente verbessert sich gegebenenfalls auch die Gesamtladezeit. Im nächsten Punkt haben wir noch weitere Tipps für Sie parat.
Als Hoster sorgen wir für schnelle Server, die zu einer geringen Time To First Byte führen. Die Website- oder Shop-Konfiguration liegt nicht mehr in unserer Hand. Hier gibt es für Betreiber von Shops und Websites viel Potenzial die Ladezeit zu verbessern. Dafür kann die eben beschriebene Detailanalyse in Firefox und Chrome genutzt werden. Doch es gibt noch weitere OnPage-Faktoren, die die Ladezeit beeinflussen. Werden diese angepasst, bringt das aus unserer Erfahrung heraus einen positiven Effekt. Daher möchten wir eine Auswahl vorstellen.
Das waren jetzt einige Aspekte, die über das Messen der Ladezeit in Firefox oder Chrome dargestellt werden und in Edge in gleicher Form zu finden sind. Ein guter Ausgangspunkt ist es, die TTFB zu ermitteln und die Gesamtladezeit zu betrachten. Ziehen Sie die TTFB von der gesamten Zeit ab, bleibt die Ladezeit, die durch die Website verursacht wird. Diese liegt nicht in der Hand des Hosters und lässt sich meist durch OnPage-Optimierungen verbessern. Wichtig ist ein Blick auf die Anzahl der Requests und diese gering zu halten. Die Größe der Gesamtdatenmenge sollte so minimal wie möglich sein. Verschaffen Sie sich über das Wasserfall-Diagramm einen Überblick über die Probleme auf der Webseite.
Richtig eingesetzt, bieten die Browser Firefox und Chrome eine schnelle Möglichkeit die Ladezeit der Webseite zu messen. Durch die Detailansicht lassen sich vor allem Probleme auf der Ebene der einzelnen Elemente gut erkennen. Damit erhalten Sie sehr konkrete Tipps zur Optimierung. Durch das Wasserfall-Diagramm werden Issues bei der Ladezeit auf einen Blick identifiziert. Und das Beste: Sie springen für die Anlayse nicht zwischen zwei Tabs hin und her, sondern führen diese direkt im geöffneten Browserfenster durch.
Testen Sie uns 14 Tage kostenlos Jetzt testen