Google Lighthouse: Was ist das und ist das wirklich wichtig?

Markus Kühle
coodoo
Published in
4 min readOct 8, 2021

--

Was ist Google Lighthouse?

Google Lighthouse ist ein Chrome-Entwicklertool, mit dem Entwickler oder Webseiten Inhaber die Leistung von Web-Apps oder Websites analysieren können.

Google Lighthouse Webseite Audit Beispiel für coodoo.de

Mit Google Lighthouse kannst du sehen, wie gut Deine Website bei Kriterien wie Performance (Webseite Ladegeschwindigkeit), SEO, Accesibility (Zugänglichkeit/Barrierefreiheit) oder als PWA (Progressive Web App) abschneidet. Neben diesen Daten kann man auch Empfehlungen (Best Practices) für die Webseite gezeigt erhalten. Dabei kann man zwischen Mobile und Desktop unterscheiden. Der Screenshot oben zeigt unsere Firmenhomepage coodoo.de

Google Lighthouse starten

Google Lighthouse kann man im Google Chrome Browser über die Entwicklertools aufrufen (Menü: Anzeigen -> Entwickler -> Entwickler Tools). Die Webseite die geprüft werden soll muss bereits aufgerufen sein bevor man den blauen “Generate report” Button klickt.

Google Lighthouse Analyse über die Chrome Entwicklertools starten

Was sind die Ergebnisse der Lighthouse Prüfung?

Wurde ein Audit einer Webseite durchgeführt erhält man zu den verschiedenen Bereichen eine Bewertung. Die Bewertung (Score) reicht von 0 bis 100 wobei 100 die beste Wertung ist.

Google Lighthouse Auswertung einer Webseite

Performance

Die Performance der Website ist einer der wichtigsten Kennzahlen. Es geht hier um die generelle Ladegeschwindigkeit einer Webseite bis man als Besucher etwas von dem Inhalt der Webseite sehen kann. Vor allem mobile oder auch als PWA ist die Geschwindigkeit in der Bewertung einer Webseite sehr wichtig und hat auch Auswirkungen auf die Positionierung in den Google Suchergebnissen.

Google Lighthouse Performance Ergebnis

Dabei werden 6 Kennzahlen, auch Core Web Vitals genannt, betrachtet:

  • First Contentful Paint: Die ersten Inhalte, Text oder Bild, werden gezeichnet.
  • Time to Interactive: Sagt aus wann die Seite für eine Interaktion mit dem User bereit ist.
  • Speed Index: Gibt an wie schnell der Content der Seite während des Ladevorgangs wirklich zu sehen ist.
  • Total Blocking Time: Sagt aus wie lange die Webseite für die Interaktion mit dem User mit einer Maus, dem Keyboard oder Touch geblockt ist.
  • Largest Contentful Paint: Beschreibt wann das größte Element gezeichnet wurde. Das deutet an wann der wichtigste Content auf der Seite angezeigt wird.
  • Cumulative Layout Shift: Zeigt an in wie weit sich die Elemente einer Seite während oder nach dem erstmaligen anzeigen noch einmal verschieben. Hier ist ein sehr guter Wert < 0,1

Accessibility

Google Lighthouse Accessibility Ergebnis

Bei Accessibility (Zugänglichkeit) wird angezeigt wie die Seite für körperlich eingeschränkte Menschen zugänglich ist. Dabei geht es z.B. darum ob Bilder einen alternativen Text oder die Sprachausgabe der Seite ausreichend unterstützt wird. Wer mehr dazu erfahren möchte kann auch auf Hilfe Seite von Google nachlesen wie man seine Webseite zugänglicher machen kann.

Best Practices

Google Lighthouse Best Practices Ergebnis

Bei den Best Practices handelt es sich um eine Menge an Dingen die rund um die eigene Webseite generell verbessert werden können. Jeder Web-Entwickler sollte auf alle Punkte die geprüft werden mal einen Blick werfen und evtl. sogar noch etwas dazulernen.

SEO

Google Lighthouse SEO Ergebnis

SEO zeigt die typischen generellen technischen Dinge auf die für die SEO Bewertung wichtig sind. SEO Bedeutet Search Engine Optimization und dient dazu bei Google und auch bei anderen Suchmaschinen so gut wie möglich dazustehen bzw. für bestimmte Suchwörter auch gefunden zu werden.

PWA

Google Lighthouse PWA Ergebnis

Diese Prüfung zeigt auf wie gut die Webseite als Progressiv Web App ist. Eine PWA ist für mobile Endgeräte optimiert, verhält sich sehr ähnlich wie eine native mobile App und kann z.B. wie eine App mit App Icon abgelegt werden.
In meinem Beispiel für coodoo.de sieht man, dass wir diesen Bereich überhaupt nicht betrachtet haben.

Warum ist Google Lighthouse wichtig?

Google Lighthouse hilft die Webseite optimiert, zugänglich und vor allem für Suchmaschinen zu entwickeln. Somit stellt man schon einmal durch Metriken die der größte Suchmaschinenbetreiber herausgibt sicher, dass die Webseite gut angenommen werden kann. Deswegen sollte wirklich jeder Web-Entwickler Google Lighthouse kennen, verstehen und auch anwenden.

Ist man auf die Positionierung bei Google oder z.B. Bing angewiesen muss man die Prüfung regelmäßig wiederkehrend durchführen. Zum einen ändern sich die Kennzahlen bei der Bewertung von Webseiten von Zeit zu Zeit und zum Anderen können schon Kleinigkeiten bei der Weiterentwicklung der Webseite dazu führen, dass die Bewertung schlechter wird und man somit auch im Ranking gegenüber seinen Konkurrenten verliert.

--

--