Designer verbringen viel Zeit mit sich wiederholenden Aufgaben - der Auswahl von Farbpaletten, der Überprüfung von Schriftarten, dem Testen der Reaktionsfähigkeit und der Suche nach Inspiration. Viele dieser Schritte lassen sich mit den richtigen Browser-Plugins automatisieren oder erheblich beschleunigen.
In diesem Artikel werden 34 praktische Tools vorgestellt, die mit Google Chrome kompatibel sind. Sie rationalisieren Ihren Arbeitsablauf, reduzieren Routineaufgaben und bieten Ihnen schnellen Zugriff auf alles, was Sie brauchen.
In diesem Artikel werden 34 praktische Tools vorgestellt, die mit Google Chrome kompatibel sind. Sie rationalisieren Ihren Arbeitsablauf, reduzieren Routineaufgaben und bieten Ihnen schnellen Zugriff auf alles, was Sie brauchen.
Inhalt:
Was sind Browser-Erweiterungen und wie installiert man sie?
Browser-Erweiterungen (auch Plugins genannt) sind kleine Tools, die Ihrem Browser neue Funktionen hinzufügen und Ihnen helfen, bestimmte Aufgaben zu erledigen, ohne auf Dienste von Drittanbietern auszuweichen. Sie finden diese Erweiterungen in den offiziellen Stores der einzelnen Browser:
-
Chrom -
Mozilla Firefox -
Oper -
Microsoft Edge
Alle in diesem Artikel vorgestellten Plugins sind mit Google Chrome kompatibel.
Opera und Firefox verfügen über separate Versionen der Erweiterungen, die Sie über die Suche nach dem Titel in den jeweiligen Stores finden können. Die meisten der hier aufgeführten Tools sind kostenlos, einige bieten jedoch erweiterte Funktionen gegen eine Gebühr.
Opera und Firefox verfügen über separate Versionen der Erweiterungen, die Sie über die Suche nach dem Titel in den jeweiligen Stores finden können. Die meisten der hier aufgeführten Tools sind kostenlos, einige bieten jedoch erweiterte Funktionen gegen eine Gebühr.
So installieren Sie eine Browsererweiterung:
1
Öffnen Sie den Erweiterungsspeicher Ihres Browsers.
2
Suchen Sie die Erweiterung anhand ihres Namens.
3
Öffnen Sie die Seite der Erweiterung und klicken Sie auf die Schaltfläche "Installieren".
4
Bestätigen Sie die Installation, indem Sie die Eingabeaufforderungen des Browsers befolgen.
5
Nach der Installation erscheint das Symbol der Erweiterung in der oberen Symbolleiste oder im Browsermenü. Der Browser zeigt dann an, wo sich das Symbol befindet.
6
Wenn Sie sich bei der Erweiterung anmelden oder zusätzliche Einstellungen konfigurieren müssen, klicken Sie auf das Symbol, um die Optionen zu öffnen.
Farbige Werkzeuge
ColorZilla - Wählen Sie Farben von jeder Seite
ColorZilla ermöglicht es Ihnen, jede Farbe auf einer Seite zu identifizieren und die gesamte Palette zu analysieren. Es kann CSS-Farbverläufe generieren, harmonische Farbkombinationen vorschlagen (komplementär, triadisch, analog, etc.) und eine Historie der zuletzt gewählten Farben führen. Es funktioniert wie ein Pipetten-Werkzeug in Grafik-Editoren und liefert Farbcodes im HEX-, RGB- oder HSL-Format.
Es eignet sich perfekt, um eine Logofarbe auf einer Website zu identifizieren, eine Palette zu erstellen oder einen Farbverlauf zu entwickeln, der zum Farbschema der Website passt.
ColorZilla ermöglicht es Ihnen, jede Farbe auf einer Seite zu identifizieren und die gesamte Palette zu analysieren. Es kann CSS-Farbverläufe generieren, harmonische Farbkombinationen vorschlagen (komplementär, triadisch, analog, etc.) und eine Historie der zuletzt gewählten Farben führen. Es funktioniert wie ein Pipetten-Werkzeug in Grafik-Editoren und liefert Farbcodes im HEX-, RGB- oder HSL-Format.
Es eignet sich perfekt, um eine Logofarbe auf einer Website zu identifizieren, eine Palette zu erstellen oder einen Farbverlauf zu entwickeln, der zum Farbschema der Website passt.
Site Palette - Erstellen einer Farbpalette
Site Palette analysiert die Farben einer Webseite und erstellt gebrauchsfertige Paletten. Sie können Paletten in den Formaten Google Palette oder Adobe Swatch exportieren.
Es ist ein großartiges Werkzeug für die Inspiration oder die Arbeit mit Referenzen - wenn Sie beispielsweise eine Website neu gestalten und die ursprüngliche Farbbalance beibehalten möchten, hebt die Erweiterung die wichtigsten Farbtöne hervor.
Site Palette analysiert die Farben einer Webseite und erstellt gebrauchsfertige Paletten. Sie können Paletten in den Formaten Google Palette oder Adobe Swatch exportieren.
Es ist ein großartiges Werkzeug für die Inspiration oder die Arbeit mit Referenzen - wenn Sie beispielsweise eine Website neu gestalten und die ursprüngliche Farbbalance beibehalten möchten, hebt die Erweiterung die wichtigsten Farbtöne hervor.
Typografie-Tools
WhatFont - Identifizierung von Schriftarten auf der Seite
WhatFont erkennt Schriftarten, die irgendwo auf einer Website verwendet werden. Das Plugin zeigt den Namen, die Größe, die Farbe und die Familie der Schriftart an. Es arbeitet schneller als die eingebauten Entwicklertools.
Verwenden Sie es, wenn Sie schnell Schriftarten auf einer Website identifizieren müssen - ohne die Entwicklertools öffnen zu müssen.
WhatFont erkennt Schriftarten, die irgendwo auf einer Website verwendet werden. Das Plugin zeigt den Namen, die Größe, die Farbe und die Familie der Schriftart an. Es arbeitet schneller als die eingebauten Entwicklertools.
Verwenden Sie es, wenn Sie schnell Schriftarten auf einer Website identifizieren müssen - ohne die Entwicklertools öffnen zu müssen.
Aktivieren Sie einfach die Erweiterung und bewegen Sie den Mauszeiger über einen beliebigen Textblock - die Informationen zur Schriftart werden in einem kleinen Pop-up-Fenster angezeigt.
Font Ninja - Schriftarten im Browser ausprobieren
Font Ninja erkennt Schriftarten und lässt Sie diese direkt im Browser "ausprobieren". Sie können Ihren eigenen Text eingeben und sehen, wie er in verschiedenen Schriftarten aussieht. Die Erweiterung funktioniert sowohl mit Google Fonts als auch mit kommerziellen Schriften und zeigt sofort die Preise an.
Sie ist hilfreich, wenn Sie eine ungewöhnliche Schriftart testen möchten, bevor Sie sie für ein Designprojekt kaufen.
Font Ninja erkennt Schriftarten und lässt Sie diese direkt im Browser "ausprobieren". Sie können Ihren eigenen Text eingeben und sehen, wie er in verschiedenen Schriftarten aussieht. Die Erweiterung funktioniert sowohl mit Google Fonts als auch mit kommerziellen Schriften und zeigt sofort die Preise an.
Sie ist hilfreich, wenn Sie eine ungewöhnliche Schriftart testen möchten, bevor Sie sie für ein Designprojekt kaufen.
Wie man Schriftarten für eine Website oder einen Artikel auswählt
Google Font Previewer - Schriftarten testen, ohne CSS zu bearbeiten
Mit Google Font Previewer können Sie verschiedene Schriftarten ausprobieren, ohne Ihren CSS-Code zu ändern. Es ersetzt vorübergehend die Typografie ausgewählter Elemente oder der gesamten Seite, so dass Sie eine Vorschau darauf erhalten, wie eine Schriftart im Kontext aussieht.
Verwenden Sie es, wenn ein Kunde Sie bittet, "mit den Schriftarten herumzuspielen" - Sie können ein visuelles Beispiel zeigen, ohne den Code zu berühren. Mit der Erweiterung können Sie auch eine Sammlung häufig verwendeter Schriftarten für den schnellen Zugriff speichern.
Mit Google Font Previewer können Sie verschiedene Schriftarten ausprobieren, ohne Ihren CSS-Code zu ändern. Es ersetzt vorübergehend die Typografie ausgewählter Elemente oder der gesamten Seite, so dass Sie eine Vorschau darauf erhalten, wie eine Schriftart im Kontext aussieht.
Verwenden Sie es, wenn ein Kunde Sie bittet, "mit den Schriftarten herumzuspielen" - Sie können ein visuelles Beispiel zeigen, ohne den Code zu berühren. Mit der Erweiterung können Sie auch eine Sammlung häufig verwendeter Schriftarten für den schnellen Zugriff speichern.
Bilder, Video- und Audio-Tools
Image Downloader - Bilder von jeder Seite speichern
Mit diesem Tool können Sie Bilder von jeder Website herunterladen. Es scannt die Seite und sammelt alle Bilder in einem einzigen Fenster, so dass Sie alles auf einmal herunterladen oder nur die Bilder auswählen können, die Sie benötigen.
Wenn Sie z. B. ein Moodboard auf Pinterest erstellt haben, können Sie alle Bilder des Boards mit einem Klick herunterladen.
Mit diesem Tool können Sie Bilder von jeder Website herunterladen. Es scannt die Seite und sammelt alle Bilder in einem einzigen Fenster, so dass Sie alles auf einmal herunterladen oder nur die Bilder auswählen können, die Sie benötigen.
Wenn Sie z. B. ein Moodboard auf Pinterest erstellt haben, können Sie alle Bilder des Boards mit einem Klick herunterladen.
Wenn diese Funktion aktiviert ist, öffnet sich ein separates Fenster, in dem alle Bilder der aktuellen Seite angezeigt werden. Hinweis: Bezahlte Stockfotos werden mit Wasserzeichen heruntergeladen.
SVG Grabber - Extrahieren von SVG-Dateien von einer Website
Mit SVG Grabber können Sie alle SVG-Dateien von einer beliebigen Website anzeigen, kopieren und herunterladen. Einmal aktiviert, zeigt es alle Vektorbilder auf der Seite mit einer "Download"-Schaltfläche unter jedem einzelnen an.
Perfekt, um ein Firmenlogo im SVG-Format zu extrahieren, wenn Sie keine Zeit haben, die Dateien anzufordern.
Mit SVG Grabber können Sie alle SVG-Dateien von einer beliebigen Website anzeigen, kopieren und herunterladen. Einmal aktiviert, zeigt es alle Vektorbilder auf der Seite mit einer "Download"-Schaltfläche unter jedem einzelnen an.
Perfekt, um ein Firmenlogo im SVG-Format zu extrahieren, wenn Sie keine Zeit haben, die Dateien anzufordern.
Wie man ansprechende Bilder auf Fotobeständen findet
Icons8 - Illustrationen zu Google Docs hinzufügen
Mit diesem Plugin können Sie Icons und Bilder aus der umfangreichen Icons8-Bibliothek direkt in Google Docs, Slides und Sheets einfügen, ohne Dateien manuell herunterladen oder hochladen zu müssen.
Hervorragend geeignet für Moodboards oder Kundenpräsentationen - Sie können Illustrationen schnell suchen und einfügen, ohne die Registerkarte zu wechseln.
Mit diesem Plugin können Sie Icons und Bilder aus der umfangreichen Icons8-Bibliothek direkt in Google Docs, Slides und Sheets einfügen, ohne Dateien manuell herunterladen oder hochladen zu müssen.
Hervorragend geeignet für Moodboards oder Kundenpräsentationen - Sie können Illustrationen schnell suchen und einfügen, ohne die Registerkarte zu wechseln.
Video DownloadHelper - Videos von jeder Website speichern
Laden Sie Video- und Audioinhalte direkt von Webseiten herunter. Das Plugin kann auch Dateien in Formate wie MP4, MKV oder WebM konvertieren.
Es ist nützlich, wenn Sie ein Video hochladen müssen, aber der Kunde nur eine Version hat, die auf einer Videoplattform gehostet wird, nicht aber die Originaldatei.
Laden Sie Video- und Audioinhalte direkt von Webseiten herunter. Das Plugin kann auch Dateien in Formate wie MP4, MKV oder WebM konvertieren.
Es ist nützlich, wenn Sie ein Video hochladen müssen, aber der Kunde nur eine Version hat, die auf einer Videoplattform gehostet wird, nicht aber die Originaldatei.
Werkzeuge zur Seitenanalyse und -bearbeitung
Page Ruler - Messen von Seitenelementen
Messen Sie jedes Element auf einer Seite, einschließlich der Ränder und Abstände zwischen Blöcken. Unterstützt mehrere Einheiten: Pixel, Prozentwerte, Millimeter und mehr.
Sie können damit überprüfen, ob ein Layout den technischen Spezifikationen entspricht, oder die Proportionen in visuellen Referenzen analysieren.
Messen Sie jedes Element auf einer Seite, einschließlich der Ränder und Abstände zwischen Blöcken. Unterstützt mehrere Einheiten: Pixel, Prozentwerte, Millimeter und mehr.
Sie können damit überprüfen, ob ein Layout den technischen Spezifikationen entspricht, oder die Proportionen in visuellen Referenzen analysieren.
CSS Peeper - CSS-Stile anzeigen
Zeigen Sie die Stile eines beliebigen Elements auf einer Seite an: Farben, Schriftarten, Abstände und Größen. Mit dem Tool können Sie auch Illustrationen, Dokumente, Layout-Dateien und Videos untersuchen.
So können Sie die Arbeit anderer Designer studieren oder Ihre eigene Layout-Implementierung überprüfen.
Zeigen Sie die Stile eines beliebigen Elements auf einer Seite an: Farben, Schriftarten, Abstände und Größen. Mit dem Tool können Sie auch Illustrationen, Dokumente, Layout-Dateien und Videos untersuchen.
So können Sie die Arbeit anderer Designer studieren oder Ihre eigene Layout-Implementierung überprüfen.
Visual Inspector UI - Bearbeiten von Webseitenelementen
Ändern Sie Stile und Text auf der Seite im Handumdrehen - passen Sie Abstände, Farben, Typografie und mehr an, ohne den Code zu bearbeiten.
Das macht es perfekt für schnelle Vorschauen; wenn ein Kunde zum Beispiel die Farbe einer Schaltfläche geändert haben möchte, können Sie die Aktualisierung sofort zeigen, bevor Sie irgendwelche Codeänderungen vornehmen.
Ändern Sie Stile und Text auf der Seite im Handumdrehen - passen Sie Abstände, Farben, Typografie und mehr an, ohne den Code zu bearbeiten.
Das macht es perfekt für schnelle Vorschauen; wenn ein Kunde zum Beispiel die Farbe einer Schaltfläche geändert haben möchte, können Sie die Aktualisierung sofort zeigen, bevor Sie irgendwelche Codeänderungen vornehmen.
Wenn Sie neu bei No-Code-Lösungen sind, verwenden Sie diesen exklusiven Promo-Code, um einen Monat lang den Tilda Personal Plan anstelle der üblichen 2-wöchigen Testversion zu erhalten.
Siehe Anweisungen für die Aktivierung
Wappalyzer - Website-Technologien identifizieren
Entdecken und analysieren Sie die Technologien hinter Websites: Programmiersprachen, Frameworks, CMS, CRMs, Analysetools und mehr.
Dies ist nützlich für Marktforschung, Konkurrenzanalysen, SEO-Audits und die Verbesserung der Website-Sicherheit.
Entdecken und analysieren Sie die Technologien hinter Websites: Programmiersprachen, Frameworks, CMS, CRMs, Analysetools und mehr.
Dies ist nützlich für Marktforschung, Konkurrenzanalysen, SEO-Audits und die Verbesserung der Website-Sicherheit.
Das Plugin zeigt die Ergebnisse in einem Popup-Fenster an und ermöglicht den Export der Daten.
Broken Link Checker - tote Links finden
Führen Sie Tiefen-Scans auf Websites durch, um defekte Links, fehlende Bilder und Weiterleitungsfehler zu erkennen. Er kann auch Beiträge, Seiten, Kommentare und benutzerdefinierte Felder analysieren. Defekte Links können unterschiedlich gestaltet werden. Sie können auch von der Indizierung durch Suchmaschinen ausgeschlossen werden, um Ihre Rankings zu schützen. Tilda bietet auch ein eigenständiges Webtool, mit dem sich einzelne Seiten oder ganze Websites mit wenigen Klicks auf defekte Links überprüfen lassen.
Führen Sie Tiefen-Scans auf Websites durch, um defekte Links, fehlende Bilder und Weiterleitungsfehler zu erkennen. Er kann auch Beiträge, Seiten, Kommentare und benutzerdefinierte Felder analysieren. Defekte Links können unterschiedlich gestaltet werden. Sie können auch von der Indizierung durch Suchmaschinen ausgeschlossen werden, um Ihre Rankings zu schützen. Tilda bietet auch ein eigenständiges Webtool, mit dem sich einzelne Seiten oder ganze Websites mit wenigen Klicks auf defekte Links überprüfen lassen.
Lighthouse - Prüfung der Website-Performance
Führen Sie eine umfassende Prüfung der Leistung Ihrer Website, der SEO, der Benutzerfreundlichkeit und der Einhaltung der PWA-Best Practices durch.
Es wird ein Bericht erstellt und es werden Möglichkeiten zur Behebung von Problemen wie übergroßen Bildern oder fehlenden Meta-Tags vorgeschlagen.
Perfekt für die Durchführung einer schnellen Selbstprüfung vor der Veröffentlichung.
Führen Sie eine umfassende Prüfung der Leistung Ihrer Website, der SEO, der Benutzerfreundlichkeit und der Einhaltung der PWA-Best Practices durch.
Es wird ein Bericht erstellt und es werden Möglichkeiten zur Behebung von Problemen wie übergroßen Bildern oder fehlenden Meta-Tags vorgeschlagen.
Perfekt für die Durchführung einer schnellen Selbstprüfung vor der Veröffentlichung.
Tools für Screenshots und Bildschirmaufnahmen
GoFullPage - Erfassen von vollständigen Screenshots
Erfassen Sie Screenshots ganzer Seiten oder ausgewählter Bereiche und exportieren Sie sie dann als PNG-, JPEG- oder PDF-Dateien in verschiedenen Papiergrößen.
Erfassen Sie Screenshots ganzer Seiten oder ausgewählter Bereiche und exportieren Sie sie dann als PNG-, JPEG- oder PDF-Dateien in verschiedenen Papiergrößen.
Loom - Videoanleitungen aufzeichnen
Zeichnen Sie Ihren Bildschirm auf und fügen Sie Sprachaufnahmen hinzu. Ideal, um Kunden Design-Entscheidungen zu erklären, Feedback mit Teamkollegen auszutauschen oder kurze Video-Tutorials zu erstellen. Sie können wählen, ob Sie den gesamten Bildschirm oder nur einen einzelnen Browser-Tab aufnehmen möchten.
Zeichnen Sie Ihren Bildschirm auf und fügen Sie Sprachaufnahmen hinzu. Ideal, um Kunden Design-Entscheidungen zu erklären, Feedback mit Teamkollegen auszutauschen oder kurze Video-Tutorials zu erstellen. Sie können wählen, ob Sie den gesamten Bildschirm oder nur einen einzelnen Browser-Tab aufnehmen möchten.
Werkzeuge für Prototyping und Tests
Window Resizer - Testen Sie Layouts auf verschiedenen Auflösungen
Vorschau, wie Ihr Design auf verschiedenen Bildschirmgrößen aussieht. Enthält Voreinstellungen für gängige Geräte: Handys, Tablets, Laptops und Desktops. Sie können auch benutzerdefinierte Größen für spezielle Anforderungen erstellen.
Vorschau, wie Ihr Design auf verschiedenen Bildschirmgrößen aussieht. Enthält Voreinstellungen für gängige Geräte: Handys, Tablets, Laptops und Desktops. Sie können auch benutzerdefinierte Größen für spezielle Anforderungen erstellen.
Perfect Pixel - Vergleichen Sie den Entwurf mit dem endgültigen Layout
Legen Sie ein halbtransparentes Bild Ihres ursprünglichen Entwurfs über die Website, um die pixelgenaue Ausrichtung zu überprüfen. Dies funktioniert auch für den Vergleich von Vektorgrafiken wie Logos oder Symbolen auf verschiedenen Geräten.
Legen Sie ein halbtransparentes Bild Ihres ursprünglichen Entwurfs über die Website, um die pixelgenaue Ausrichtung zu überprüfen. Dies funktioniert auch für den Vergleich von Vektorgrafiken wie Logos oder Symbolen auf verschiedenen Geräten.
Das Plugin enthält eine Reihe gängiger Gerätegrößen, so dass Sie zwischen ihnen wechseln und die Reaktionsfähigkeit leicht testen können.
Google Tag Assistant - Überprüfung von GTM-Tags
Verwenden Sie ihn, um verschiedene Google Tag Manager-Integrationen zu erkennen, zu überprüfen und Fehler zu beheben. Es kann Ihnen dabei helfen, sicherzustellen, dass Analysetools und Skripte von Drittanbietern richtig eingerichtet sind. Das Plugin scannt den Code, hebt Probleme hervor und schlägt Korrekturen vor.
Nützlich während eines technischen Audits - insbesondere zur Überprüfung der Datenverfolgung.
Verwenden Sie ihn, um verschiedene Google Tag Manager-Integrationen zu erkennen, zu überprüfen und Fehler zu beheben. Es kann Ihnen dabei helfen, sicherzustellen, dass Analysetools und Skripte von Drittanbietern richtig eingerichtet sind. Das Plugin scannt den Code, hebt Probleme hervor und schlägt Korrekturen vor.
Nützlich während eines technischen Audits - insbesondere zur Überprüfung der Datenverfolgung.
Visuelle Inspiration
Muzli - Referenzen finden
Diese Erweiterung bringt Ihnen frische Ideen von Plattformen wie Dribbble, Behance und Awwwards. Passen Sie Ihren Feed an, um sich auf bestimmte Kategorien wie E-Commerce, Landing Pages, Typografie usw. zu konzentrieren. Wenn Sie z. B. an einem Online-Shop arbeiten, öffnen Sie einfach die Erweiterung, stellen Sie die richtigen Filter ein, und erkunden Sie ähnliche Website-Designs.
Diese Erweiterung bringt Ihnen frische Ideen von Plattformen wie Dribbble, Behance und Awwwards. Passen Sie Ihren Feed an, um sich auf bestimmte Kategorien wie E-Commerce, Landing Pages, Typografie usw. zu konzentrieren. Wenn Sie z. B. an einem Online-Shop arbeiten, öffnen Sie einfach die Erweiterung, stellen Sie die richtigen Filter ein, und erkunden Sie ähnliche Website-Designs.
Das Plugin macht es einfach, jederzeit zu Muzli zu wechseln, um visuelle Trends zu erkunden oder nach Stichworten oder Themen zu suchen.
Evernote Web Clipper - Ideen speichern
Clip-Ideen und Bildmaterial aus dem Internet in ein digitales Notizbuch. Speichern Sie Ihre Lieblingsfarben, -animationen, -übergänge, -symbole, -schriftarten und -artikel. Markieren Sie alles, um später leicht darauf zugreifen zu können.
Clip-Ideen und Bildmaterial aus dem Internet in ein digitales Notizbuch. Speichern Sie Ihre Lieblingsfarben, -animationen, -übergänge, -symbole, -schriftarten und -artikel. Markieren Sie alles, um später leicht darauf zugreifen zu können.
Auf Pinterest speichern - Moodboards erstellen
Speichern Sie jede Idee aus dem Web auf Pinterest. Erstellen Sie Boards mit Referenzen, Moodboards oder Sammlungen von Bildern zur Inspiration. Inklusive visueller Suche, um ähnliche Bilder zu finden. Perfekt, wenn ein Kunde seine eigenen Referenzen mitteilt - Sie können sofort ähnliche Ideen finden.
Speichern Sie jede Idee aus dem Web auf Pinterest. Erstellen Sie Boards mit Referenzen, Moodboards oder Sammlungen von Bildern zur Inspiration. Inklusive visueller Suche, um ähnliche Bilder zu finden. Perfekt, wenn ein Kunde seine eigenen Referenzen mitteilt - Sie können sofort ähnliche Ideen finden.
Instapaper - Artikel offline lesen
Speichern Sie Artikel und Designzusammenfassungen, um sie später zu lesen. Organisieren Sie Inhalte in Ordnern und greifen Sie von jedem Gerät aus darauf zu - auch ohne Internetzugang, z. B. im Flugzeug.
Speichern Sie Artikel und Designzusammenfassungen, um sie später zu lesen. Organisieren Sie Inhalte in Ordnern und greifen Sie von jedem Gerät aus darauf zu - auch ohne Internetzugang, z. B. im Flugzeug.
Werkzeuge zur Workflow-Optimierung
Zeitmanagement
Bardeen - Workflow-Automatisierung
Erstellen Sie individuelle Automatisierungen für Routineaufgaben. Wenn ein Kunde beispielsweise eine Rückmeldung per E-Mail sendet, kann Bardeen eine Trello-Karte mit einer To-Do-Liste erstellen und eine Bestätigungsnachricht senden. Funktioniert mit Tools wie Google Sheets, Zoom und Trello.
Erstellen Sie individuelle Automatisierungen für Routineaufgaben. Wenn ein Kunde beispielsweise eine Rückmeldung per E-Mail sendet, kann Bardeen eine Trello-Karte mit einer To-Do-Liste erstellen und eine Bestätigungsnachricht senden. Funktioniert mit Tools wie Google Sheets, Zoom und Trello.
Todoist - Aufgaben organisieren
Planen und priorisieren Sie Aufgaben, setzen Sie Fristen und erhalten Sie Erinnerungen. Mit dem Tool können Sie berufliche und private Aufgaben trennen und auf gemeinsamen Listen mit Kollegen oder der Familie zusammenarbeiten.
Planen und priorisieren Sie Aufgaben, setzen Sie Fristen und erhalten Sie Erinnerungen. Mit dem Tool können Sie berufliche und private Aufgaben trennen und auf gemeinsamen Listen mit Kollegen oder der Familie zusammenarbeiten.
Mit dem Plugin können Sie Ihre täglichen Aufgaben - ob privat oder beruflich - organisieren, ohne auf Dienste von Drittanbietern zurückgreifen zu müssen.
StayFocusd - Ablenkungen beseitigen
Blockieren Sie den Zugriff auf ablenkende Websites während der Arbeitszeit. Die Begrenzung der Zeit, die Sie auf sozialen Medien oder Unterhaltungswebsites verbringen, kann Ihnen helfen, sich zu konzentrieren und Ihre Produktivität zu steigern.
Blockieren Sie den Zugriff auf ablenkende Websites während der Arbeitszeit. Die Begrenzung der Zeit, die Sie auf sozialen Medien oder Unterhaltungswebsites verbringen, kann Ihnen helfen, sich zu konzentrieren und Ihre Produktivität zu steigern.
Momentum - Einrichten eines Arbeitsbereichs
Ersetzen Sie die neue Registerkarte durch - ein Dashboard für Produktivität: Aufgabenliste, Fokus-Timer, Quicklinks und inspirierendes Zitat - alles in einer Ansicht.
Ersetzen Sie die neue Registerkarte durch - ein Dashboard für Produktivität: Aufgabenliste, Fokus-Timer, Quicklinks und inspirierendes Zitat - alles in einer Ansicht.
Toggl - Verfolgen Sie den Zeitaufwand
Erfassen Sie, wie viel Zeit Sie für jede Aufgabe aufwenden. Dies ist vor allem für neue Designer hilfreich, da es so einfacher ist, Zeitschätzungen zu verbessern, genaue Zeitpläne für Projekte zu erstellen und realistische Fristen festzulegen.
Erfassen Sie, wie viel Zeit Sie für jede Aufgabe aufwenden. Dies ist vor allem für neue Designer hilfreich, da es so einfacher ist, Zeitschätzungen zu verbessern, genaue Zeitpläne für Projekte zu erstellen und realistische Fristen festzulegen.
Verwaltung der Registerkarten
OneTab - offene Registerkarten zusammenfassen
Fasst alle offenen Registerkarten in einer einzigen Liste zusammen. Wenn Sie z. B. eine Zielgruppe recherchieren und Dutzende von Registerkarten geöffnet haben, aber plötzlich zu den Kundenbearbeitungen wechseln müssen, genügt ein Klick, um alles für später zu speichern. Dadurch wird Ihr Arbeitsbereich aufgeräumt und der Arbeitsspeicher entlastet. Sie können alle Registerkarten auf einmal oder eine nach der anderen wiederherstellen.
Fasst alle offenen Registerkarten in einer einzigen Liste zusammen. Wenn Sie z. B. eine Zielgruppe recherchieren und Dutzende von Registerkarten geöffnet haben, aber plötzlich zu den Kundenbearbeitungen wechseln müssen, genügt ein Klick, um alles für später zu speichern. Dadurch wird Ihr Arbeitsbereich aufgeräumt und der Arbeitsspeicher entlastet. Sie können alle Registerkarten auf einmal oder eine nach der anderen wiederherstellen.
Toby for Tabs - organisieren Sie Ihre Tabs
Bringen Sie damit Ordnung in Ihren Browser. Organisieren Sie Tab-Gruppen in Arbeitsbereichen und wechseln Sie bei Bedarf zwischen ihnen.
Beginnen Sie Ihren Tag mit einer voreingestellten Gruppe von arbeitsbezogenen Tabs und schließen Sie sie am Abend, ohne dass etwas verloren geht: . Alles wird geräteübergreifend synchronisiert - machen Sie auf genau da weiter, wo Sie aufgehört haben, sogar von einem anderen Computer aus.
Bringen Sie damit Ordnung in Ihren Browser. Organisieren Sie Tab-Gruppen in Arbeitsbereichen und wechseln Sie bei Bedarf zwischen ihnen.
Beginnen Sie Ihren Tag mit einer voreingestellten Gruppe von arbeitsbezogenen Tabs und schließen Sie sie am Abend, ohne dass etwas verloren geht: . Alles wird geräteübergreifend synchronisiert - machen Sie auf genau da weiter, wo Sie aufgehört haben, sogar von einem anderen Computer aus.
Sicherheit
HTTPS Everywhere - sichern Sie Ihre Verbindung
Verwenden Sie es, um Ihre Verbindungen in der Öffentlichkeit zu sichern. Das Tool zwingt Websites dazu, HTTPS zu verwenden - auch wenn sie das standardmäßig nicht tun - und verschlüsselt die Daten, die Sie online senden und empfangen. Es ist besonders nützlich, wenn Sie in Cafés oder Coworking-Spaces arbeiten, was es zu einem großartigen Tool für freiberufliche Designer macht.
Verwenden Sie es, um Ihre Verbindungen in der Öffentlichkeit zu sichern. Das Tool zwingt Websites dazu, HTTPS zu verwenden - auch wenn sie das standardmäßig nicht tun - und verschlüsselt die Daten, die Sie online senden und empfangen. Es ist besonders nützlich, wenn Sie in Cafés oder Coworking-Spaces arbeiten, was es zu einem großartigen Tool für freiberufliche Designer macht.
AdGuard - blockiert alle Anzeigen
Machen Sie Ihr Surferlebnis angenehmer, indem Sie alle Arten von lästiger Werbung blockieren - einschließlich YouTube-Videoanzeigen, Pop-ups, Banner, native Werbung usw. Es deaktiviert auch Tracker, die Ihre Online-Aktivitäten überwachen, beschleunigt das Laden von Seiten und reduziert den Datenverbrauch.
Machen Sie Ihr Surferlebnis angenehmer, indem Sie alle Arten von lästiger Werbung blockieren - einschließlich YouTube-Videoanzeigen, Pop-ups, Banner, native Werbung usw. Es deaktiviert auch Tracker, die Ihre Online-Aktivitäten überwachen, beschleunigt das Laden von Seiten und reduziert den Datenverbrauch.
Einmal installiert, funktioniert es automatisch auf allen Websites - Sie müssen es nicht mehr ein- oder ausschalten.
LastPass - speichern Sie Ihre Passwörter
Mit LastPass können Sie Ihre Passwörter sicher speichern, verwalten und automatisch ausfüllen. Es verschlüsselt Ihre Daten, um Lecks zu verhindern, und synchronisiert sie mit allen Ihren Geräten. Wenn Sie sich auf einer neuen Website anmelden, kann LastPass ein sicheres Passwort für Sie generieren.
Mit LastPass können Sie Ihre Passwörter sicher speichern, verwalten und automatisch ausfüllen. Es verschlüsselt Ihre Daten, um Lecks zu verhindern, und synchronisiert sie mit allen Ihren Geräten. Wenn Sie sich auf einer neuen Website anmelden, kann LastPass ein sicheres Passwort für Sie generieren.
Nützliche Plugins Spickzettel
Um Ihnen die Suche zu erleichtern, finden Sie hier eine Liste von Plugins mit einem kurzen Überblick über ihre Funktionen. Speichern Sie die Liste, testen Sie verschiedene Tools und wählen Sie die aus, die für Sie am besten geeignet sind.
ColorZilla - Wählen Sie eine Farbe, erstellen Sie eine Website-Palette, generieren Sie einen CSS-Farbverlauf.
Site Palette - extrahieren Sie das Farbschema einer Website, exportieren Sie es in Google Palette oder Adobe Swatch.
Site Palette - extrahieren Sie das Farbschema einer Website, exportieren Sie es in Google Palette oder Adobe Swatch.
WhatFont - identifiziert Schriftarten auf jeder Website.
Font Ninja - probiert Schriftarten aus, prüft kommerzielle Lizenzen.
Google Font Previewer - testet Schriftarten, ohne CSS zu bearbeiten.
Font Ninja - probiert Schriftarten aus, prüft kommerzielle Lizenzen.
Google Font Previewer - testet Schriftarten, ohne CSS zu bearbeiten.
Icons8 - Icons und Illustrationen direkt in Google Docs einfügen.
Image Downloader - Bilder und Icons von jeder Webseite herunterladen.
SVG Grabber - SVG-Dateien extrahieren und herunterladen.
Video DownloadHelper - Video oder Audio von jeder Webseite herunterladen.
Image Downloader - Bilder und Icons von jeder Webseite herunterladen.
SVG Grabber - SVG-Dateien extrahieren und herunterladen.
Video DownloadHelper - Video oder Audio von jeder Webseite herunterladen.
Page Ruler - misst Seitenelemente und Abstände.
CSS Peeper - prüft Schriftarten, Farben und Stile auf jeder Webseite.
Wappalyzer - erkennt, welche Technologien eine Website verwendet.
Visual Inspector UI - bearbeitet vorübergehend Stile und testet Layoutänderungen.
Broken Link Checker - findet defekte Links und Bildfehler.
Lighthouse - führt eine vollständige technische Prüfung einer Website durch.
CSS Peeper - prüft Schriftarten, Farben und Stile auf jeder Webseite.
Wappalyzer - erkennt, welche Technologien eine Website verwendet.
Visual Inspector UI - bearbeitet vorübergehend Stile und testet Layoutänderungen.
Broken Link Checker - findet defekte Links und Bildfehler.
Lighthouse - führt eine vollständige technische Prüfung einer Website durch.
GoFullPage - nehmen Sie ganzseitige Screenshots auf und kommentieren Sie sie.
Loom - nehmen Sie Ihren Bildschirm mit Voiceover auf.
Loom - nehmen Sie Ihren Bildschirm mit Voiceover auf.
Window Resizer - prüft responsive Layouts.
Perfect Pixel - vergleicht Ihr Layout mit dem Originaldesign.
Google Tag Assistant - Fehlerbehebung bei GTM-Tags.
Perfect Pixel - vergleicht Ihr Layout mit dem Originaldesign.
Google Tag Assistant - Fehlerbehebung bei GTM-Tags.
Muzli - erforscht Designtrends und findet visuelle Referenzen.
Auf Pinterest speichern - sammelt visuelle Ideen und erstellt Moodboards.
EvernoteWeb Clipper - speichert Ideen und organisiert sie nach Kategorien.
Instapaper - erstellt eine Offline-Leseliste.
Auf Pinterest speichern - sammelt visuelle Ideen und erstellt Moodboards.
EvernoteWeb Clipper - speichert Ideen und organisiert sie nach Kategorien.
Instapaper - erstellt eine Offline-Leseliste.
Bardeen - Automatisieren Sie Routineaufgaben über Ihre Tools hinweg.
Todoist - Planen und priorisieren Sie Ihre Aufgaben.
StayFocusd - Blockieren Sie ablenkende Websites während der Arbeitszeit.
Momentum - Verwandeln Sie Ihren neuen Tab in ein Produktivitäts-Dashboard.
Toggl - Verfolgen Sie den Zeitaufwand für Aufgaben.
Todoist - Planen und priorisieren Sie Ihre Aufgaben.
StayFocusd - Blockieren Sie ablenkende Websites während der Arbeitszeit.
Momentum - Verwandeln Sie Ihren neuen Tab in ein Produktivitäts-Dashboard.
Toggl - Verfolgen Sie den Zeitaufwand für Aufgaben.
Toby for Tabs - organisiert Registerkarten in Arbeitsbereichen.
OneTab - fasst alle Registerkarten in einer einzigen Liste zusammen.
OneTab - fasst alle Registerkarten in einer einzigen Liste zusammen.
HTTPS Everywhere - sorgt für sichere Verbindungen auch auf Nicht-HTTPS-Websites.
AdGuard - blockiert Werbung, Tracker und Pop-ups.
LastPass - speichert und synchronisiert Passwörter auf all Ihren Geräten.
AdGuard - blockiert Werbung, Tracker und Pop-ups.
LastPass - speichert und synchronisiert Passwörter auf all Ihren Geräten.
Zum Anzeigen in voller Größe antippen und für später speichern
Zum Anzeigen in voller Größe antippen und für später speichern
Wenn Ihnen der Artikel gefallen hat, teilen Sie ihn mit Ihren Freunden. Vielen Dank dafür!
Lesen Sie auch:
Kostenloses Kursbuch über das Entwerfen, Einrichten und Betreiben von
Landing Pages mit hoher Konversionsrate
Landing Pages mit hoher Konversionsrate
Kostenloser praktischer Leitfaden für Webanimation mit Beispielen und Techniken,
und Tipps zu ihrer Verwendung
