Home / Blog / News & Wissen / Plugins für die Webentwicklung: Unsere liebsten Browser Add-ons für Google Chrome

Sep 15, 2021

Christine Boussios

Webentwicklung – 6 nützliche Browser-Erweiterungen für Chrome, um das Beste aus einer Website herauszuholen

Bei der Entwicklung einer Website können kleinste Details wichtig sein und einen großen Unterschied machen. Browser-Tools können die Entwicklung einer Webseite erleichtern. Sie liefern nützliche Informationen zur besseren Steuerung einer Seite und prüfen Metriken und Daten im Hintergrund, um aussagekräftige Informationen über die eigene Website zu erhalten.

Mit dieser Serie werfen wir einen Blick in die Browser unseres Teams und stellen Browser-Erweiterungen für Google Chrome vor, die täglich im Einsatz sind. Die meisten Add-ons finden Sie aber auch für andere gängige Browser wie Firefox, Safari und Co.

Page Monitor

Das Add-on Page Monitor lässt Ihren Internet-Browser Änderungen auf ausgewählten Websites überwachen. Mit dieser Erweiterung werden bestimmte Abschnitte, oder eine komplette Webseite überprüft. Mit nur zwei Klicks können Internetseiten zum Page Monitor hinzugefügt werden, der von da an über jede Änderung der Seite durch ein entsprechendes Symbol im Browser informiert. Die Überprüfungsintervalle können individuell angepasst und mit Benachrichtigungen versehen werden.

» Hier geht es zum Download für Page Monitor

Lighthouse

Als automatisiertes Open-Source-Tool dient Lighthouse der Verbesserung von Internetanwendungen. Das Add-on führt eine Reihe von Tests durch und untersucht so die zu prüfende Website. Im Anschluss erstellt Lighthouse einen Bericht, der Aufschluss gibt über Qualität und Leistung. Ein guter Ausgangspunkt für eine weitere Optimierung.

» Hier finden Sie das Browser Add-on Lighthouse

EditThisCookie

EditThisCookie ist der erste Cookie-Manager für Google Chrome. Cookies können gezielt gesucht, bearbeitet, blockiert oder gelöscht werden. Zudem besteht die Möglichkeit neue Cookies zu erstellen und alte zu schützen.

» Die Erweiterung EditThisCookie können Sie hier downloaden

Clear Cache

Wird der Cache nicht regelmäßig ausgemistet, kann dies die Ladezeit des Internetbrowsers maßgeblich verlangsamen. Die Anwendung Clear Cache kann mit nur einem einzigen Klick die Browser-Daten und den Cache löschen – ohne Pop-up-Benachrichtigungen oder Bestätigungsdialoge. Die zu löschenden Daten können individuell angepasst werden, um etwa Cookies global, oder nur für bestimmte Domains zu entfernen. So wird innerhalb weniger Sekunden der Cache geleert und ein reibungsloses Browsen garantiert.

» Zum Add-on Clear Cache gelangen Sie hier

Web Vitals

Das Add-on Web Vitals misst mit eigenen Metriken die Qualität von Interaktivität, Ladezeiten und Layout einer Website. Das Add-on umfasst drei wichtige Kernfunktionen:

Ambient Badge: Wenn eine URL aufgerufen wird, zeigt ein Symbol im Browser-Fenster mittels farblicher Marke an, ob die Metriken von Web Vitals getroffen, oder überschritten werden.
Details im Pop-up: Die einzelnen Werte werden beim Klick auf das Ambient-Badge Symbol aufgeschlüsselt. Das liefert Informationen, ob sich die metrischen Werte auf der Seite ändern und beispielsweise eine Nutzeraktion erfordern. So erhalten Sie einen aufschlussreichen Einblick darüber, ob sich Ihre individuellen Erfahrungen mit einer Website, auch mit denen anderer Nutzer derselben Seite decken.
HUD Overlay: In einem Heads Up Display, oder kurz HUD, zeigt eine dauerhafte Ansicht an, inwieweit sich die Core Web Vitals verändern, während eine Website entwickelt oder bearbeitet wird.

» Web Vitals können Sie hier herunterladen

Web Developer Toolbar

Die Web Developer Toolbar ermöglicht einen Blick in den Backstage-Bereich einer Website. Mit diesem smarten Tool können Entwickler-Informationen aus dem Hintergrund der Seite analysiert und ihr Gerüst sowie die Besonderheiten darstellen.

» Hier können Sie die Browser-Erweiterung Web Developer Toolbar herunterladen