Ladezeiten einer Webseite messen und optimieren

Legen Sie es nicht auf die Geduld Ihrer Kundschaft an: Die Ladezeiten sind maßgebend zum Erreichen der Ziele einer Webseite. Studien zeigen immer wieder, dass mit ansteigender Ladezeit die Absprungrate (»Bounce Rate«) in die Höhe schnellt und die Konversionsrate (»Conversation Rate«) sinkt. Webseiten werden inzwischen oft zu mehr als der Hälfte über mobile Endgeräte abgerufen. Das sollte im Webdesign berücksichtigt werden, damit die Webseite auch mit einer schlechten Datenverbindung lädt und das Datenvolumen der Menschen nicht unnötig strapaziert. Eine schlechte Datenverbindung ist das beste Beispiel für eine technische Barriere im Webdesign.

Google hat die Ladezeit deshalb schon länger im Algorithmus berücksichtigt. Mit dem Page Experience-Update im Juni 2021 werden weitere Metriken einbezogen, unter anderem der »First Input Delay« (FID), »Largest Contentful Paint« (LCP) und der »Cumulative Layout Shift« (CLS). Die Optimierung der Ladezeit ist damit direkte Suchmaschinenoptimierung (Onpage-SEO).

Das obige Werkzeug simuliert einen Seitenaufruf durch ein mobiles Endgerät in Echtzeit. Dabei werden die verschiedenen Metriken erfasst. Das Werkzeug nutzt die offizielle Google Pagespeed-Schnittstelle.

Ladezeiten verbessern

Wie die Ladezeiten und die weiteren Metriken optimiert werden können, hängt von der Webseite im Einzelnen ab. Auf fast jeder Webseite lassen sich allgemein diese Aspekte berücksichtigen:

Anzahl der HTTP-Anfragen reduzieren
Anzahl der DNS-Anfragen reduzieren
Browser-Caching effektiv nutzen
Serverseitiges Caching nutzen
GZIP-Komprimierung aktivieren
Stylesheets früh laden, damit die Webseite schnell gerendert (»gezeichnet«) werden kann
Skripte nachladen
Doppelte Skripte entfernen
Bilder in einer passenden Größe ausliefern
Bilder komprimieren und idealerweise moderne Webformate wie .webp oder .avif nutzen
Bilder außerhalb des sichtbaren Bereichs erst laden, wenn sie benötigt werden
Weiterleitungen reduzieren

Ab 350,00 EUR netto optimieren wir Ihre Webseite messbar hinsichtlich ihrer Performance. Persönliche Unterstützung erhalten Sie nach einer Kontaktaufnahme per E-Mail an info@barrierefreies.design oder per Anruf an +49 152 53000270 (Mo. – Fr., 9 – 18 Uhr).

Ein Projekt anfragen

Häufig gestellte Fragen zu den Ladezeiten

Was umfasst die übertragene Daten?

Die übertragenen Daten geben an, welche Datenmenge beim Seitenaufruf insgesamt übertragen wurde. Dazu zählen Schriften, Bilder, Skripte et cetera. Die übertragenen Daten lassen sich beispielsweise durch ein sinnvolles Nachladen (» Lazyload«) gegebenenfalls reduzieren.
Was ist der »First Contentful Paint« (FCP)?

Der »First Contentful Paint« (FCP) gibt die Zeit an, bis vom Aufruf der Webseite das erste Element gerendert wird. Er ist eine wichtige Kennzahl, um zu vermeiden, dass die Besucher*innen einer Webseite lange auf einen weißen Bildschirm schauen müssen.
Was ist der »Largest Contentful Paint« (LCP)?

Der »Largest Contentful Paint« (LCP) gibt die gemessene Zeit an, bis das größte Element aus dem Document Object Model (DOM) gerendert wurde, welches auf dem Bildschirm sichtbar ist.
Was ist der Unterschied zwischen dem »First Contentful Paint« (FCP) und dem »First Meaningful Paint« (FMP)?

Der »First Contentful Paint« (FCP) schließt nicht unbedingt elementare Bestandteile der Webseite wie den den Header oder die Navigationsleiste ein. Zeitlich liegt er damit immer vor dem »First Meaningful Paint« (FMP), welcher diese Elemente einschließt. Google hat von dem FMP wieder Abstand genommen.
Was gibt der »Speed Index« an?

Der Speed Index ist keine eindimensionale Ladezeit, sondern beschreibt den Ladefortschritt bis zum Seitenaufbau. Je zeitiger Elemente sichtbar sind und je weniger Inhalte später nachgeladen werden müssen, desto geringer und folgich besser fällt der Speed Index aus.
Was ist die »Time To Interactive« (TTI)?

Die »Time To Interactive« (TTI) gibt an, wann die Webseite komplett gerendert und bereit zu Nutzereingaben ist.
Was ist die »Total Blocking Time« (TBT)?

Die »Total Blocking Time« (TBT) ist die Zeit, die zwischen dem »First Contentful Paint« (LCP) und der »Time To Interactive« (TTI) vergeht. Sie markiert die Zeit, in der Inhalte sichtbar sind, aber die Webseite noch nicht bereit zur Eingabe ist.
Was beschreibt den »Cumulative Layout Shift« (CLS)?

Der »Cumulative Layout Shift« (CLS) beschreibt, wie stark sich das Layout der Webseite während des Ladevorgangs verändert. Die Berechnungsgrundlagen hierfür ist die anteilige Größe der sich verschiebenden Elemente multipliziert mit dem Grad der Verschiebung. Der beste Wert ist 0.