Pagespeed Insights (PSI): Turbo für Deine Website

Das erwartet Dich in unserem ausführlichen Artikel über PageSpeed Insights 😉

Was ist Google PageSpeed Insights?
Wofür werden PageSpeed Insights genutzt?
Welche Metriken misst PageSpeed Insights?
Wie kann die Nutzererfahrung auf Deiner Website verbessert werden?
Wie kannst Du die PageSpeed Insights für Dein Unternehmen nutzen?
Vor- und Nachteile von PSI
Was ist der Unterschied zwischen Labor- und Felddaten?
Allgemeine Empfehlungen und Tipps
Gängige Tools zur Verbesserung der PageSpeed
FAQs

Was ist Google PageSpeed Insights?

Google PageSpeed Insights (PSI) ist ein kostenloses Tool von Google, das die Leistung Deiner Webseite analysiert und bewertet. Seit der ersten Vorstellung 2011 wird es stetig weiterentwickelt und verbessert. Es misst die Ladegeschwindigkeit und das Verhalten Deiner Seite sowohl auf mobilen Geräten als auch auf Desktops und liefert konkrete Verbesserungsvorschläge. PSI kombiniert Felddaten aus dem Chrome User Experience Report (CrUX) und Labordaten, die durch automatisierte Tests mit Lighthouse generiert werden.
Zusätzlich wird die Seitenstruktur hinsichtlich Barrierefreiheit, Best Practices und SEO untersucht.
Neben dem Pagespeed-Online-Tool existiert auch eine öffentliche Pagespeed Insights API, die in eigenen Tools / Plugins verwendet werden kann.

Was ist PageSpeed überhaupt und wie wird das gemessen?

PageSpeed, also die Geschwindigkeit, in der Deine Website lädt, ist längst zu einem wichtigen Qualitätskriterium geworden. Auch, wenn es anfangs nicht als Rankingfaktor galt, spielte die Seitenladezeit schon immer eine wichtige Rolle im Hinblick auf User Experience. Aus diesem Grund erklärte Google im April 2010 PageSpeed für Desktops zu einem offiziellen Rankingfaktor und seit Juli 2018 gilt dieser auch für mobile Engeräte.

Wofür werden PageSpeed Insights genutzt?

Unternehmen und Webmaster nutzen das Tool, um die Ladezeiten ihrer Webseiten zu überprüfen und Optimierungspotentiale zu identifizieren. Ein schneller PageSpeed-Score kann die Nutzererfahrung verbessern, die Absprungrate verringern und die Conversion Rate erhöhen. Darüber hinaus beeinflussen Faktoren wie Ladegeschwindigkeit, Barrierefreiheit oder Struktur einer Webseite auch das Ranking in den Suchmaschinenergebnissen.

Welche Metriken misst PageSpeed Insights?

Für die Leistungsbewertung werden neben den Core Web Vitals Largest Contentful Paint (LCP), Interaction To Next Paint (INP) und  Cumulative Layout Shift (CLS) auch andere wichtige Metriken wie First Contentful Paint (FCP), Time To First Byte (TTFB), First Input Delay (FID), Speed Index (SI) oder Total Blocking Time (TBT) verwendet.

Welche Geschwindigkeit ist für eine Website optimal?

Als grobe Faustregel gilt, dass eine Website weniger als drei Sekunden laden sollte, um den Nutzer halbwegs zufriedenzustellen. Klar ist: Je kürzer, desto besser! Doch das ist leichter gesagt als getan. Denn einige Faktoren, die das Laden Deiner Website verzögern, kannst Du nur schwer oder gar nicht beeinflussen. Dazu gehören:

Bandbreite: Ist Dein Website-Besucher durch eine geringe Internet-Bandbreite beeinträchtigt, wird sich auch Deine Seite langsamer aufbauen. Das liegt nicht an mangelhafter PageSpeed-Optimierung, sondern oft an schlechter Netzabdeckung oder seltener am langsamen DSL-Anschluss des Nutzers.

Browsercache: Wurde der Cache eines Nutzers längere Zeit nicht mehr geleert, hat das ebenfalls Einfluss auf die Ladezeit Deiner Seite. Wie oft ein User diesen allerdings leert, liegt nicht in Deiner Hand, weshalb sich ein Seitenaufbau bei einem vollen Cache stark verzögern kann.

Rechenleistung des Nutzers: Auch ältere PCs oder Smartphones beeinflussen die Seitenladegeschwindigkeit. Das liegt oft an zu wenig Arbeitsspeicher oder an geringen Prozessorleistungen.

Wie kann die Nutzererfahrung auf Deiner Website verbessert werden?

Die Nutzererfahrung wird durch mehrere Faktoren beeinflusst, die weit über reine Ladezeiten hinausgehen. PageSpeed ist ein zentraler Bestandteil davon, aber auch Struktur, Design und Interaktion spielen eine wichtige Rolle. Zu den wichtigsten Maßnahmen zur Verbesserung der User Experience gehören:

1. Schnelle Ladezeiten sicherstellen
   Durch Optimierung von Bildern, Code-Minimierung, Lazy Loading und serverseitiger Performance steigt die Zufriedenheit und die Absprungrate sinkt.
2. Klar strukturierte Inhalte bereitstellen
   Überschriften, Absätze und gut sichtbare Call-to-Actions helfen Besuchern, Inhalte schneller zu erfassen und schneller zu handeln.
3. Mobile Nutzer priorisieren
   Eine mobilfreundliche Darstellung, ausreichend große Klickflächen und responsive Elemente sind entscheidend, da der Großteil des Traffics über mobile Endgeräte kommt.
4. Interaktive Elemente stabil halten
   Core Web Vitals wie CLS und FID sorgen dafür, dass Buttons nicht verrutschen und Interaktionen ohne Verzögerung stattfinden.
5. Barrierefreiheit gewährleisten
   Alt-Tags, Kontraste und gute Lesbarkeit verbessern nicht nur die Nutzererfahrung, sondern helfen auch Suchmaschinen, Inhalte besser zu verstehen.
6. Klare Navigation und logische Seitenstruktur
   Nutzer finden schneller, was sie suchen, wenn die Menüführung intuitiv und einfach gestaltet ist.

PageSpeed als Rankingfaktor

PageSpeed ist für Besucher und Suchmaschinen gleichermaßen relevant. Lädt eine Website nur mit Verzögerungen, hat das Auswirkungen auf den Crawler. Denn langsam ladende Seiten, werden auch langsamer gecrawlt. Das bedeutet, dass das Crawling-Budget schneller aufgebraucht ist und lange nicht so viele Seiten indexieren können, wie das bei schnellen Seiten der Fall ist. Die Ladezeit einer Seite ist deshalb seit 2010 einer der Google Rankingfaktoren, die ausschlaggebend dafür sind, auf welcher Position in den SERPs Deine Seite ausgespielt wird. Da vor allem mobile Suchen immer häufiger werden, führte Google im Juli 2018 die Seitenladegeschwindigkeit auch für mobile Websites als Rankingfaktor ein. Das bedeutet: Möchtest Du viel organische Reichweite durch gute Positionierungen erzielen, musst Du in Konsequenz auf eine optimierte Seitenladegeschwindigkeit setzen.

Wie kannst Du PageSpeed Insights für Dein Unternehmen nutzen?

1. Analyse Deiner Website

Gib die URL Deiner Webseite in PageSpeed Insights ein, um einen Überblick über die aktuelle Leistung zu erhalten.

Die Analyse liefert eine Punktzahl zwischen 0 und 100.

Ein Wert zwischen 90 und 100 wird dabei als schnell, zwischen 50 und 89 als durchschnittlich und unter 50 als langsam bewertet.

2. Identifikation von Schwachstellen

Die Berichte von PageSpeed Insights heben spezifische Bereiche hervor, die verbessert werden können. Typische Schwachstellen umfassen:

Leistung

• Nicht optimierte Bilder
• Fehlendes Lazy Loading
• Unnötige JavaScript– und CSS-Ressourcen
• Fehlende Caching-Strategie
• Render-Blocking-Ressourcen

Barrierefreiheit

• Fehlender Kontrast
• Alt-Tags in Bildern
• Fehlende Beschriftung von Schaltflächen
• Zu geringe Größe von Schalt- oder Linkflächen
• Fehlende Screen Reader Auszeichnungen (Aria states und properties)

Best Practices

• Verwendung veralteter APIs / Drittanbieter Cookies
• Debugging-/Fehlermeldungen in der Konsole

SEO

• Mit nofollow falsch ausgezeichnete Links
• Unvollständige Metadaten (z. B. Meta-Description, Canonical Tag, Title Tag, strukturierte Daten)
• Fehlende oder falsche robots.txt

Die spezifischen Gewichtungen der Leistungsmetriken sind im Lighthouse-Bericht selbst nicht ersichtlich, aber im „Lighthouse Scoring Calculator“ simulierbar. Mit diesem Tool kannst Du den PageSpeed-Score basierend auf Deinen eigenen Daten berechnen.

3. Implementierung von Optimierungen

Einige Verbesserungen lassen sich, je nach CMS/System, über Plugins oder Extensions verwirklichen (systemabhängig). Manche müssen oder können server- bzw. codeseitig umgesetzt werden.

WordPress beispielsweise bietet zahlreiche Plugins zum Thema Caching oder Bildoptimierung an, wohingegen eine Server-Antwortzeit oder unnötiges CSS / JS mit menschlicher Intelligenz in der Serverkonfiguration oder dem Code geändert werden sollte.

Ob und mit welchem Aufwand diese Vorschläge umgesetzt werden können, hängt in erster Linie vom verwendeten System ab.

4. Prüfen der Verbesserungen

Prüfe nach Deinen Optimierungsmaßnahmen den Effekt und lege dabei das Hauptaugenmerk auf die Labordaten, da sich Änderungen in den Felddaten nicht sofort auswirken.

Wenn es technisch umsetzbar ist, sollten Verbesserungsmaßnahmen vor der Publizierung in einem Testsystem ausprobiert werden.

5. Kontinuierliche Überwachung

Nach der Implementierung der Optimierungen solltest Du die Leistung Deiner Webseite regelmäßig überwachen, um sicherzustellen, dass die Verbesserungen nachhaltig sind. Kontinuierliches Monitoring hilft auch dabei neue Schwachstellen, die z. B. beim Einstellen neuer Seiten, Seitenänderungen, Einsatz neuer Libraries etc. auftreten können, frühzeitig zu erkennen und zu beheben.

Ladezeiten optimieren – Aber wie?

Ladezeitoptimierungen sind kein Selbstläufer. Du musst wirklich etwas dafür tun, wenn Du möchtest, dass sich der PageSpeed Deiner Website verbessert. Hast Du den vorherigen Schritt durchgeführt und Deinen Status Quo genau unter die Lupe genommen, wird es nun Zeit, Hand anzulegen. Keine Angst: Es werden dabei weder spezielle Programmier- oder Coding-Kenntnisse gefordert, noch musst Du tief gehendes Wissen zu Hosting Anbietern oder Servern haben. Im Folgenden erklären wir Dir die wichtigsten Punkte, die Du beachten solltest, damit Deine Seite schneller lädt. Zusätzlich findest Du hier eine Checkliste, in der alle Verbesserungsmöglichkeiten zur Geschwindigkeitsoptimierung zusammengefasst sind.

Vor- und Nachteile von PSI

Vorteile

• Kostenlos: PageSpeed Insights ist ein kostenloses Tool, das für jeden zugänglich ist.
• Benutzerfreundlich: Das Tool ist einfach zu bedienen und liefert verständliche Berichte und Empfehlungen.
• Detaillierte Analysen: PSI bietet detaillierte Einblicke in verschiedene Leistungsmetriken und gibt spezifische Verbesserungsvorschläge.
• Verbesserte SEO: Optimierungen basierend auf PSI-Berichten können die SEO-Rankings verbessern.

Nachteile

• Begrenzte historische Daten: PSI zeigt nur aktuelle Analysen und keine historischen Leistungsdaten.
• Abhängigkeit von Labordaten: Die Labordaten spiegeln nicht immer die tatsächliche Nutzererfahrung wider.
• Schwankende Ergebnisse: Die Ergebnisse können je nach Zeitpunkt der Analyse und externen Faktoren variieren.

Was ist der Unterschied zwischen Labor- und Felddaten?

• Labordaten: Labordaten werden in einer kontrollierten Umgebung mit definierten Parametern gesammelt. Sie basieren auf automatisierten Tests, die mit Tools wie Lighthouse durchgeführt werden. Diese Tests simulieren Benutzerinteraktionen unter optimalen Bedingungen, um konsistente und reproduzierbare Ergebnisse zu liefern. Labordaten sind hilfreich, um technische Aspekte der Seitenleistung zu analysieren und spezifische Optimierungspotentiale zu identifizieren.
• Felddaten: Felddaten werden aus der realen Nutzung der Webseite durch echte Benutzer gesammelt. Sie stammen aus dem Chrome User Experience Report (CrUX) und reflektieren die tatsächlichen Ladezeiten und Interaktionen der Nutzer in verschiedenen Umgebungen und Netzwerken. Felddaten bieten Einblicke in die echte Nutzererfahrung und können durch Faktoren wie unterschiedliche Geräte, Netzwerke und Standorte beeinflusst werden.
• Zusammengefasst: Labordaten bieten kontrollierte, technische Analysen, während Felddaten die echte Benutzererfahrung widerspiegeln. Beide Datentypen sind wichtig, um ein umfassendes Bild der Webseitenleistung zu erhalten und gezielte Optimierungen durchzuführen.

Allgemeine Empfehlungen und Tipps

1. Bilder optimieren: Verwende komprimierte und korrekt formatierte Bilder (WEBP, AVIF, SVG). In den meisten Fällen kannst Du mit diesen Bildformaten bessere Ergebnisse erzielen als mit JPG, PNG oder GIF. Erzeuge ausreichend Bildderivate, um die unterschiedlichen Bildschirmauflösungen mit den passenden Bildgrößen zu bedienen.
2. Font-Optimierung: Vermeide das Laden großer Schriftdateien und implementiere Font-Display-Optionen, um Ladezeiten zu reduzieren. Stelle Fonts auf dem eigenen Server bereit.
3. Content Delivery Network (CDN): Verwende ein CDN, um Inhalte schneller an Nutzer weltweit zu liefern.
4. Server-Optimierung: Verbessere die Server-Antwortzeit durch leistungsstarke Hosting-Dienste und serverseitige Optimierungen.
5. Verwende Plugins / Extensions sparsam: Viele der angezeigten Probleme lassen sich mit Plugins lösen. Eine bestehende Website z. B. komplett mit neuen Bildern (z. B. WEBP) auszustatten kann ohne CDN sehr aufwendig werden. Verwende ein Plugin, das die Altdaten automatisch konvertiert und ausspielt und achte bei neuen Dateien auf das richtige Format. Bedenke dabei, dass jedes zusätzliche Plugin erstmal Ressourcen belegt und der Kosten-Nutzen-Faktor kritisch hinterfragt werden sollte.
6. Search Console nutzen: Verwende zusätzlich die Google Search Console um Probleme einzelner Seiten schneller zu erkennen.
7. System-Updates prüfen: Teste und beurteile technische Änderungen an der Website vor der Publizierung, um unangenehme Überraschungen zu vermeiden.
8. Regelmäßige Überprüfung: Führe regelmäßig PSI-Analysen durch, um kontinuierlich Verbesserungen zu identifizieren und umzusetzen.

Eine ausführlichere Beschreibung zu Performance, Struktur u.ä. findest du unter https://web.dev/learn/

Gängige Tools zur Verbesserung der PageSpeed

FAQs

1. Was ist der PageSpeed-Score?

Der PageSpeed-Score ist eine Bewertungsskala von 0 bis 100, die die Leistung einer Webseite basierend auf verschiedenen Metriken bewertet. Ein höherer Score deutet auf eine bessere Leistung hin.

2. Warum sind PageSpeed Insights wichtig für SEO?

PageSpeed Insights sind wichtig für SEO, da die Ladegeschwindigkeit einer Webseite ein Ranking-Faktor bei Google ist. Schnellere Webseiten bieten eine bessere Nutzererfahrung und können zu höheren Rankings in den Suchergebnissen führen. Zudem gewinnen auch Themen wie Barrierefreiheit oder strukturelles SEO immer mehr an Bedeutung.

3. Wie oft sollte ich meine Webseite mit PageSpeed Insights überprüfen?

Es wird empfohlen, die Webseite regelmäßig, idealerweise monatlich, mit PageSpeed Insights zu überprüfen, um sicherzustellen, dass die Leistung kontinuierlich optimiert wird. Ebenso ist eine Überprüfung nach technischen Änderungen anzuraten.

4. Was kann ich tun, wenn meine Webseite eine niedrige Punktzahl hat?

Wenn Deine Webseite eine niedrige Punktzahl hat, solltest Du die von PageSpeed Insights vorgeschlagenen Optimierungen umsetzen, wie z. B. Bildoptimierung, Code-Minimierung und Implementierung von Caching-Strategien.

5. Beeinflussen externe Ressourcen meine PageSpeed Insights-Bewertung?

Ja, externe Ressourcen wie Drittanbieter-Skripte und eingebettete Inhalte können die Ladezeiten beeinflussen und somit die PageSpeed Insights-Bewertung beeinträchtigen. Optimiere diese Ressourcen oder entferne sie, um die Performance zu verbessern.

6. Was sind die Core Web Vitals?

Die Core Web Vitals sind spezifische Metriken, die von Google als entscheidend für die Benutzererfahrung eingestuft werden. Dazu gehören LCP, INP (vormals First Input Delay FID) und CLS.

7. Kann ich die Performance meiner Webseite ohne technische Kenntnisse verbessern?

Ja, viele der vorgeschlagenen Optimierungen von PageSpeed Insights erfordern keine tiefen technischen Kenntnisse und können mit Hilfe von Plugins oder einfachen Anpassungen umgesetzt werden.