Neu in Lighthouse 11

Adam Raine
Adam Raine
GitHub
Jasmine Yan
Jasmine Yan
GitHub

Lighthouse ist ein Tool zur Prüfung von Websites, das Entwickler mit Möglichkeiten und Diagnosen unterstützt, die Nutzererfahrung auf ihren Websites zu verbessern.

Lighthouse 11 ist sofort über die Befehlszeile bis npm, in Chrome Canary und in PageSpeed Insights verfügbar. Sie werden dann in Chrome 118 in der stabilen Chrome-Version angezeigt.

Eine vollständige Liste der Änderungen finden Sie im Änderungsprotokoll 11.0.

Aktualisierung der Kategorie „Bedienungshilfen“

Die Kategorieaktualisierungen umfassen neue automatische Prüfungen, eine verbesserte Gewichtung und priorisierte manuelle Prüfungen, um Entwicklern die Zugänglichkeit ihrer Websites zu verbessern.

Neue Audits und Gewichtung

Seit Lighthouse 10.0 wurden 13 neue Prüfungen zur Barrierefreiheit hinzugefügt:

  • aria-allowed-role
  • aria-dialog-name
  • aria-text
  • html-xml-lang-mismatch
  • image-redundant-alt
  • input-button-name
  • label-content-name-mismatch
  • link-in-text-block
  • select-name
  • skip-link
  • table–duplicate-name
  • table-fake-caption
  • td-has-header

Zusätzlich zu den neuen Prüfungen wurden die Gewichtungen aller Prüfungen aktualisiert, damit sie den entsprechenden Auswirkungen der aXe-Regel besser entsprechen. Genaue Details zu den neuen Audits und Gewichtungen finden Sie in der Dokumentation zur Lighthouse-Bewertung der Barrierefreiheit.

Sichtbarkeit der manuellen Prüfung

Lighthouse hat schon immer einige manuelle Prüfungen durchgeführt, die nicht automatisch getestet werden können, aber dennoch als Checkliste zur Überprüfung wichtiger Funktionen enthalten sind. Der Bereich „Manuelle Prüfung“ wird jetzt automatisch maximiert, wenn alle automatisierten Prüfungen bestanden wurden.

Ein Lighthouse-Bericht mit erweiterten manuellen Prüfungen in der Kategorie „Bedienungshilfen“

Das betont, dass das Bestehen aller automatisierten Prüfungen und eine Bewertung von 100 für Barrierefreiheit keine Garantie dafür ist, dass die geprüfte Seite zugänglich ist. Manuelle Tests sind weiterhin wichtig. Außerdem wurden die manuellen Prüfungen neu angeordnet, um mit den einfachsten Prüfungen zu beginnen.

Änderungen an bestehenden Audits

Interaction to Next Paint (INP)

INP ist nicht mehr experimentell, daher wurde der Messwert von experimental-interaction-to-next-paint nach interaction-to-next-paint verschoben.

Service Worker

Ein Service Worker ist nicht mehr erforderlich, damit eine Seite in Chrome als PWA installiert werden kann. Daher wurde die service-worker-Prüfung aus der Lighthouse-PWA-Kategorie entfernt.

Ressourcenübersicht

Die resource-summary-Prüfung wurde aus dem Lighthouse-Bericht entfernt. Statistiken zu Netzwerkanfragen können weiterhin mithilfe der ausgeblendeten network-requests-Prüfung kompiliert werden:

const {lhr} = await lighthouse('https://example.com');
const networkRequests = lhr.audits['network-requests'].details.items;
const resourceSummary = {};

for (const request of networkRequests) {
  let total = resourceSummary[request.resourceType] || 0;
  total += request.resourceSize;
  resourceSummary[request.resourceType] = total;
}

console.log(resourceSummary);

Alte Navigation

Das Flag --legacy-navigation für die Befehlszeile, die Funktion legacyNavigation() in der Node API und das Kästchen „Legacy-Navigation“ im Bereich „Entwicklertools“ wurden entfernt. Damit ist ein jahrelanger Übergang der Lighthouse-Infrastruktur abgeschlossen, um Nutzerflüsse zu unterstützen.

Running Lighthouse

Lighthouse ist verfügbar in den Chrome-Entwicklertools, npm (als Knotenmodul und Befehlszeilentool) und als Browsererweiterung (in Chrome und Firefox). Darüber hinaus wird er auch für verschiedene Google-Dienste wie PageSpeed Insights eingesetzt.

Verwenden Sie die folgenden Befehle, um die Lighthouse Node CLI auszuprobieren:

npm install -g lighthouse
lighthouse https://www.example.com --view

Lighthouse-Team kontaktieren

So gehen Sie vor, wenn Sie die neuen Funktionen, Änderungen in Lighthouse 11 oder andere Themen im Zusammenhang mit Lighthouse besprechen möchten: