Mit der Dotcom-Monitor Website-Überwachungslösung können Sie ein Lighthouse Report Monitoring Device (Web Page Monitoring Solution) erstellen und konfigurieren, um Die Leistung, Suchmaschinenoptimierung (SEO) und andere Website-Metriken automatisch zu überwachen.

Was ist Google Lighthouse?

Google Lighthouse ist ein Open-Source-Tool, um die Geschwindigkeit und Leistung der Website zu überwachen. Es überwacht Ladezeit, Zugänglichkeit, SEO von Webseiten, progressive Web-Apps und eine erweiterte Liste von Best Practices. Lighthouse wurde in PageSpeed Insights (PSI) integriert und Benutzer können nun Berichte zu Leistungsdaten überprüfen. Darüber hinaus verwendet PageSpeed Insights eine Kombination aus Labor- und realen Daten, während Lighthouse nur Labordaten zum Erstellen von Berichten verwendet.

PageSpeed Insights-Metriken helfen, Einblicke in die Wahrnehmung der Webseitengeschwindigkeit eines Benutzers zu geben, die zu einem Faktor für SEO-Rankings geworden ist. So wichtig es auch ist, eine großartige Lighthouse-Bewertung anzustreben, die wir in diesem Artikel unten mehr behandeln, ist wichtig, was Sie mit diesen Lighthouse-Empfehlungen tun, um die Webseitenleistung zu verbessern, indem Sie die wahrgenommenen und tatsächlichen Ladezeiten von Webseiten verringern.

Lighthouse simuliert das Laden einer Webseite in einem realen Browser unter realen Bedingungen (verlorene Pakete, schlechte Verbindung usw.) und generiert den Bericht mit Scores, die Audit-Metriken widerspiegeln. Darüber hinaus enthält der Bericht Vorschläge zur Verbesserung der Websitegeschwindigkeit und der Leistungsbewertungen. Neben isolierten Tests können Lighthouse-Berichte in der Webentwicklung äußerst nützlich sein, um Änderungen in den Ergebnissen über einen Zeitverlauf zu vergleichen.

Wenn es jedoch um wiederkehrende Website-Tests geht, scheint die manuelle Ausführung von Lighthouse in jedem Testfall nicht effizient zu sein. In diesem Artikel werden wir die Art und Weise der automatischen Ausführung der Überwachung mit Dotcom-Monitor besprechen.

So nutzen Sie den Leuchtturmbericht effektiver

Jedes Mal, wenn Sie Webseiteninhalte verbessern, um SEO-Anforderungen zu erfüllen, müssen Sie möglicherweise Änderungen in der SEO-Bewertung vor und nach Verbesserungen nachverfolgen. Im Falle von SEO ist ein einmaliger Check nicht sinnvoll. Das Gegenteil ist der Fall. Es ist notwendig zu überwachen, wie SEO-Scores sich im Laufe der Zeit und regelmäßig ändern.

Angenommen, Sie möchten Einen Einblick in die Auswirkungen von Webseitenaktualisierungen haben, da sie sich auf Leistungsmetriken beziehen, ohne die Berichte manuell für jede Version abrufen zu müssen. Darüber hinaus kann sich die Optimierung der Websitefunktionalität manchmal auf eine bestimmte Leistungsmetrik auswirken. Wenn Sie beispielsweise daran arbeiten, die Zeit zu verkürzen, die zum Laden von Inhalten auf einer Webseite benötigt wird, müssen Sie sich auf Änderungen in den Partituren “First Contentful Paint” oder “First Meaningful Paint” konzentrieren und sicherstellen, dass die Punktzahl nicht abfällt. Wir werden diese Metriken in diesem Artikel ausführlicher erläutern.

 

Konfigurieren eines Lighthouse-Berichts mit Dotcom-Monitor

Dotcom-Monitor kann einen Lighthouse-Bericht mit der angegebenen Häufigkeit generieren, um Änderungen in einer bestimmten Webseitenmetrik zu überwachen. Das Hauptmerkmal der Lösung ist die Überwachung einer bestimmten Überwachungsmetrik. Sie können eine Metrik auswählen und einen Fehlerschwellenwert festlegen, um Warnungsbenachrichtigungen zu erhalten, wenn eine überwachte Punktzahl anicht im akzeptablen Bereich liegt. Darüber hinaus können Sie Die Warnungen auf Fehler konfigurieren, die beim Ausführen von Lighthouse aufgetreten sind, einen Überwachungsplaner angeben und geplante Berichte über die Überwachungsergebnisse einrichten.

Sobald das Überwachungsgerät konfiguriert wurde, können Sie Lighthouse-Berichte aus dem Dotcom -Monitor Online-Berichtabrufen.

Einrichten eines Leuchtturmberichtsaudits

Url

Geben Sie die URL ein, die Sie mit Lighthouse überwachen möchten. Die URL-Adresse sollte genau so gebildet werden, wie Sie sie in einem Browser verwenden würden, z. B. http://www.example.com. Sie müssen die http:// oder https:// am Anfang der Adresse angeben. Zu diesem Zeitpunkt können Sie auch alle GET-Parameter am Ende Ihrer URL einfügen.

Lighthouse Report Metriken

Dotcom-Monitor ermöglicht die Überwachung und Warnung für eine bestimmte Webseitenüberwachungsmetrik. Das System überwacht die ausgewählten Metrikergebnisse im Leuchtturmbericht. Wenn der Fehlerschwellenwert für den Metrikwert angegeben ist und die Option Warnung auf Leuchtturmfehler ausgewählt ist, wird das Gerät in Fällen als fehlgeschlagen betrachtet, wenn die Punktzahl außerhalb des zulässigen Bereichs liegt. Um Benachrichtigungen zu erhalten, konfigurieren Sie Warnungen für das Gerät auf der Registerkarte Warnungen auf dem Bildschirm “Gerätebearbeitung”.

Außerdem können Sie geplante Berichte konfigurieren, die die Ergebnisse der ausgewählten Metriküberwachung basierend auf täglichen, wöchentlichen oder monatlichen Statistiken aggregieren. Wählen Sie eine Überwachungsmetrik aus den folgenden Lighthouse-Metriken aus, über die Warnungen und Berichte empfangen werden sollen. Der Leistungsbericht enthält verschiedene Metriken, und wir werden die folgenden Metriken besprechen.

Performance Gesamtpunktzahl

Die Gesamtbewertung “Leistung” ist der gewichtete Durchschnitt aller Leistungsmetriken. Stärker gewichtete Metriken haben einen größeren Einfluss auf die Gesamtbewertung der Leistung.

Erste zufriedene Farbe

Der erste Inhaltsbebilder (FCP) misst, wie lange der Browser benötigt, um den ersten DOM-Inhalt zu rendern, nachdem ein Benutzer zu Ihrer Seite navigiert. Eine gute First Contentful Paint Punktzahl ist alles unter einer Sekunde. Es ist wichtig, First Contentful Paint mit dem Begriff First Paint zu unterscheiden. First Paint ist, wenn irgendetwas als gerendert betrachtet wird, was so einfach sein könnte wie die Hintergrundfarbe der Seite selbst, aber es bietet keine relevanten Inhalte oder Informationen, die der Benutzer verwendet hat oder auf die er sich einlässt.

Die erste inhaltsbehaftete Farbe ist der Inhalt, der an den Benutzer geliefert oder gemalt wird. Für die meisten Webseiten ist dies in der Regel der oben genannte Inhalt, wie das Navigationsmenü oder ein Heldenbild, als Beispiel. Dies sind die ersten Aktuellen Inhalte, die Benutzern beim Laden der Seite angezeigt werden. First Contentful Paint bietet einen nützlicheren, realen Datenpunkt als First Paint.

Geschwindigkeitsindex

Der Geschwindigkeitsindex zeigt an, wie schnell der Inhalt einer Seite sichtbar aufgefüllt wird. Der Geschwindigkeitsindex wird ermittelt, indem Die Geschwindigkeit Ihrer Webseite gemessen und mit Daten von anderen Websites verglichen wird. Je niedriger der Speed Index-Score, desto besser die Performance. Jede Seite, die unter 4,3 Sekunden liegt, gilt als gut und wird mit einer grünen Farbcodierung angezeigt. Eine Seitengeschwindigkeit zwischen 4.4 und 5.8 gilt als moderate Geschwindigkeit und wird in Orange angezeigt. Schließlich gilt eine Seitengeschwindigkeit über 5,8 Sekunden als langsam und wird rot angezeigt.

Zeit für Interaktiv

Die Zeit zu Interaktiv( TTI) misst die Zeit, von der die Seite mit dem Laden beginnt, bis zu dem Zeitpunkt, zu dem die Wichtigstenunterressourcen geladen wurden, und sie ist in der Lage, zuverlässig auf Benutzereingaben zu reagieren. Eine angemessene Time to Interactive beträgt weniger als fünf Sekunden. Ein wichtiger Hinweis zur Zeit bis zu Interaktiv ist, dass Sie sicherstellen möchten, dass Benutzer mit Ihrer Website interagieren können, wenn Seiteninhalte wie Schaltflächen oder Links sichtbar werden. Ziel ist es, die Zeit zwischen First Contentful Paint und Time to Interactive so kurz wie möglich zu gestalten. Wenn Ihre Seite für die Bedienung dieses Inhalts eingerichtet ist, aber erst interaktiv ist, wenn das Skript geladen wurde, kann dies dazu führen, dass einige Benutzer verärgert werden.

Erste sinnvolle Farbe

Der erste sinnvolle Farbtupfer (FMP) misst, wenn der primäre Inhalt einer Seite sichtbar ist. Die erste sinnvolle Farbe ist die Zeit zwischen dem Beginn des Seitenladevorgangs und dem Rendern des primären, über dem Falten. First Meaningful Paint wird auf die gleiche Weise gemessen wie First Contentful Paint, das mit der tatsächlichen Website-Datenleistung bewertet wird. Je nachdem, wie die Seite zum Laden eingerichtet wird, können die Ersten sinnvollen Farben und die erste inhaltsbehaftete Farbe die gleiche Punktzahl aufweisen, jedoch in Fällen, in denen ein Inlineframe (iframe) verwendet wird, z. B. sind die Zeiten unterschiedlich. Eine Zeit unter zwei Sekunden gilt als schnell und wird grün angezeigt. Alles zwischen zwei und vier Sekunden ist mäßig und wird in Orange angezeigt. Schließlich ist alles über vier Sekunden langsam und wird rot angezeigt.

Erste CPU-Leerlauf

Der erste CPU-Leerlauf markiert das erste Mal, dass der Hauptthread der Seite leise genug ist, um Eingaben zu verarbeiten. Es kann die Zeit zwischen dem Laden der Seite und dem Laden der Seite betrachtet werden. Diese Punktzahl wird, wie andere in dieser Liste, durch den Vergleich Ihrer Seite mit Daten von anderen Websites bestimmt. Eine gute First CPU Idle Punktzahl ist jederzeit unter 4,7 Sekunden und wird grün angezeigt. Jede Zeit zwischen 4,8 und 6,5 Sekunden ist mäßig schnell und wird in Orange angezeigt. Schließlich ist jede Zeit über 6,5 Sekunden langsam und wird rot angezeigt.

Max. potenzielle erste Eingangsverzögerung

Die maximale potenzielle erste Eingabeverzögerung ist die Dauer der längsten Geräteausführung, die Ihre Benutzer erleben können, in Millisekunden. Mit anderen Worten, es ist die Zeit, die der Browser benötigt, um auf Benutzeraktionen zu reagieren, wie z. B. auf einen Link oder eine Schaltfläche zu klicken und diese Aktion zu verarbeiten. Eine schnelle Max Potential First Input Delay ist alles unter 130 Millisekunden und wird grün angezeigt. Alles, was mehr als 250 Millisekunden beträgt, gilt als langsam und wird rot angezeigt.

Barrierefreiheit Gesamtnote

Der Gesamtwert barrierefrei wird aufdie Möglichkeiten hin, die Zugänglichkeit Ihrer Website zu verbessern. Dabei geht es nicht nur darum, die Barrierefreiheit für Benutzer mit Behinderungen sicherzustellen. Selbst kleinste Korrekturen, wie z. B. making sicher, dass HTML-Elemente korrekt betitelt und implementiert sind, kann einen langen Weg gehen, um die Zugänglichkeit für alle Benutzer sicherzustellen, die auf Ihren Webseiten landen.

Best Practices Gesamtbewertung

Der Best Practices Overall Score stellt sicher, dass Ihre Seite den Best Practices der Branche folgt, z. B. gültiges JavaScript, Bilddimensionen, Verschlüsselung und mehr. Dieser Abschnitt bietet auch einen Überblick über die verschiedenen Elemente, die das Lighthouse-Audit bestanden oder nicht bestanden haben, zusammen mit Empfehlungen

SEO Gesamtpunktzahl

Die SEO Overall Scores stellen sicher, dass Ihre Seite für das Ranking der Suchmaschinenergebnisse optimiert ist. Die Lighthouse-Prüfung zeigt beispielsweise an, dass es relevante Titel und Metabeschreibungen, erfolgreichen Statuscode und mehr für die angegebene Seite gibt. Dieser Abschnitt enthält auch Elemente, die die Prüfungskriterien nicht erfüllten und auf SEO-Verbesserung und -Optimierung überprüft werden müssen.

Fehlerschwellenwert

Legen Sie einen akzeptablen Punktebereich für eine ausgewählte Metrik fest. Wenn die Punktzahl außerhalb des Bereichs liegt, wird das Gerät als fehlgeschlagen markiert. Um Benachrichtigungen basierend auf dem von Ihnen festgelegten Schwellenwert zu erhalten, wählen Sie Ja im Feld Warnung auf Leuchtturmfehler aus.

DNS-Optionen

The DNS Options feature allows users to choose how domain name server (DNS) requests are conducted during a monitoring task.

To specify the mode of resolving hostnames, in the DNS Resolve Mode section, select one of the available modes. For more details on the feature configuration, see DNS Mode Options.

The Custom DNS Hosts section contains the mappings of IP addresses to hostnames.

To specify the mapping, enter the IP address and the host name in the corresponding fields.

Examples:

192.168.107.246   example.com user.example.com userauth.example.com tools.example.com
192.168.107.246   example.com
192.168.107.246   user.example.com
192.168.107.246   userauth.example.com

See also: DNS Mode Options.

 

Automatisieren Sie lighthouse Monitoring für eine bessere Benutzererfahrung

Es ist wichtig zu erkennen, dass Seitengeschwindigkeit und Seitenladezeit, obwohl eng verwandt, als separate Faktoren betrachtet werden sollten, wenn es um die Website-Leistung geht. Während sich die Ladezeit der Seite darauf konzentriert, zu messen, wie lange es dauert, bis alle Webseiteninhalte gerendert werden, was ein Faktor ist, wenn es darum geht, eine großartige Benutzererfahrung zu bieten, warten Benutzer nicht darauf, dass Ihre Webseiten vollständig geladen werden, bevor sie navigieren, klicken oder ihre nächsten Aktionen ausführen.

Mit den Lighthouse-Überwachungsberichten können Sie kontinuierlich messen und verfolgen, wie gut Ihre Webseiten im Laufe der Zeit abschneiden, und sicherstellen, dass Ihre Seiten die von PageSpeed Insights festgelegten Leistungsmetriken, Schwellenwerte und Best Practices erfüllen, sodass Sie sicher sind, dass Ihre Kunden und Benutzer ein schnelles Weberlebnis erhalten, unabhängig davon, wo sie sich befinden.

Zusätzliche Ressourcen zu Leuchtturmmetriken

Ausführlichere Beschreibungen der Lighthouse-Metriken finden Sie auf den folgenden Seiten:

https://developers.google.com/web/tools/lighthouse

https://web.dev/performance-scoring/