1. Sie sind hier:
  2. Home
    3. |
  3. TYPO3-Support
    4. |
  4. PageSpeed

PageSpeed-Optimierung mit TYPO3

Letzte Änderung:

 

Kurze Ladezeiten, ein stabiler Seitenaufbau und schnelle Reaktionszeiten auf Besucher-Interaktionen sind wichtige Bestandteile einer guten User Experience (UX). Sie stellen damit auch wichtige Erfolgsfaktoren einer Website dar. Eine gute UX führt nicht nur zu mehr Conversions. Sie wird auch von Suchmaschinen durch ein höheres Ranking goutiert. Zur Messung der UX hat Google die Core Web Vitals eingeführt. 

Was sind die Core Web Vitals?

Seit Mai 2021 berücksichtigt Google die sog. Core Web Vitals als Ranking-Faktoren im Suchergebnis (siehe: offizieller Blogbeitrag von Google). Die Optimierung von Ladezeiten (sog. Pagespeed) von Websites wird dann noch wichtiger und kann zu einem entscheidenden Wettbewerbsvorteil werden.

Die Core Web Vitals sind drei von Google definierte Kennzahlen, die die Besucherfreundlichkeit ("User Experience") von Webseiten messen sollen:

  • LCP: Der Largest Contentful Paint misst die "gefühlte Ladezeit" einer Webseite, konkret: Wie lange dauert es, bis die größte Komponente im sichtbaren Bereich ("Viewport") angezeigt wird. Der Wert sollte unter 2,5 Sekunden liegen. Mehr Infos zum LCP von Google (englisch).
  • FID: Der First Input Delay misst die Dauer bis zur ersten Interaktionsmöglichkeit. Das kann z.B. die Betätigung eines Links oder das Schreiben in ein Eingabefeld sein. Die Dauer sollte unter 100 Millisekunden liegen. Mehr Infos zum FID von Google (englisch).
  • CLS: Der Cumulative Layout Shift steht für die "Visuelle Stabilität". Damit sind die Verschiebungen des Layouts während des Seitenaufbaus gemeint. Der CLS kann einen Wert von 0(sehr stabil) bis 1(hohe Instabilität) einnehmen und sollte niedriger als 0.1 sein. Mehr Infos zum CLS von Google (englisch). 

INP ersetzt FID

Interaction to Next Paint (INP) ist eine neue Core Web Vital Metrik, die ab März 2024 First Input Delay (FID) ersetzen wird. INP bewertet die Reaktionsfähigkeit einer Webseite. Wenn eine Interaktion dazu führt, dass eine Seite nicht mehr reagiert, ist dies ein schlechtes Benutzererlebnis. INP beobachtet die Latenz aller Interaktionen eines Nutzers mit der Seite und meldet einen einzigen Wert, unter dem (fast) alle Interaktionen lagen. Ein niedriger INP-Wert bedeutet, dass die Seite durchgängig in der Lage war, schnell auf alle - oder die überwiegende Mehrheit - der Benutzerinteraktionen zu reagieren.

Wie kann ich die Core Web Vitals meiner Website messen?

Der einfachste Weg führt über die Seite PageSpeed Insights von Google. Geben Sie hier eine URL Ihrer Webseite ein (eine Auswertung kann immer nur pro Seite stattfinden, es gibt keine "Gesamtauswertung" für die komplette Website):

Auswertung Core Web Vitals von wacon.de
Auswertung der Core Web Vitals von wacon.de

Das Tool führt zwei Auswertungen durch: Einmal für die mobile Seite (links im Bild) und einmal für die Desktop-Version(rechts im Bild). Aus den jeweiligen Faktoren (LCP, FID, CLS und First Contentful Paint (FCP)) wird dann jeweils ein Gesamtwert berechnet (in diesem Fall sind beide bei 100, was sehr selten ist).

Eine weitere Möglichkeit, die Core Web Vitals meiner Webseiten zu überprüfen, bietet ein Blick in die Search Console. Hier wird unter dem Punkt Nutzerfreundlichkeit -> Core Web Vitals eine Übersicht der (Achtung: In vielen Fällen werden nicht alle Seiten, die Google indiziert hat, berücksichtigt):

Core Web Vitals in der Search Console
Die Core Web Vitals in der Search Console

Wenn man auf Bericht öffnen(rechts oben) klickt, kann man sich Details und mögliche Fehler zu den einzelnen Seiten ansehen.

Warum ist Google die Ladezeit so wichtig?

Nach einer von Google durchgeführten Untersuchung zur Benutzerfreundlichkeit von Webseiten hat sich ergeben, dass die Ladezeit auf Besucher den höchsten Einfluss darauf hat, wie die Website wahrgenommen wird:

Einflussfaktoren auf die User Experience
Einflussfaktoren auf die User Experience (UX)

Mit 75% liegt die Ladezeit vor der Intuition(wie schnell finde ich, was ich suche) mit 66 %, der Responsivität(Erscheinungsbild auf dem jeweiligen Gerät), der Einfachheit der Bedienung  mit 61% und der Attraktivität also dem Layout bzw. die visuelle Darstellung mit nur 24%.

Die Ladezeit sollte somit ein wichtiger Teil bei der Optimierung der Website für Google (SEO) sein.

Welche Auswirkungen haben langsame Webseiten?

Auch hierzu hat sich Google im Rahmen einer Analyse geäußert. Als Kriterium wurde dabei die sog. Absprungrate ("Bounce Rate") herangezogen. Ein Absprung ist ein Besuch, bei dem nur eine Seite einer Website aufgerufen wird. 

Absprungrate in Abhängigkeit der Ladezeit
Absprungrate in Abhängigkeit der Ladezeit

Optimierung für Hero-Images und große Hintergrundbilder

Auch Seiten mit sehr großen Bildern lassen sich in TYPO3 sehr gut optimieren. Achten Sie in diesem Fall unbedingt darauf, dass die Bilder responsive und im webp-Format ausgeliefert werden. Hier ein Beispiel unseres Kunden https://zukunftbauen-marburg.de/, bei dem das Hintergrundbild über den gesamten Bildschirm verläuft:

Pagespeed-Auswertung mobile Version
Pagespeed-Auswertung mobile Version
Pagespeed-Auswertung für die Desktop-Version
Pagespeed-Auswertung für die Desktop-Version

+++ Lesen Sie hier unsere Tipps & Tricks zur Ladezeitverbesserung mit TYPO3 +++