Tool-Tipp

Mit dieser Chrome-Erweiterung wird das Editieren deiner Website zum Kinderspiel

(Screenshot: canvasflip.com)

Editieren ohne den Quellcode zu öffnen? Mit dieser Chrome-Erweiterung ist das kein Problem! Wir stellen euch Visual Inspector vor.

Googles Chrome ist für die meisten Webentwickler die erste Wahl. Was besonders an der guten Performance liegt, den großartigen Dev-Tools sowie der nahezu unüberschaubaren Flut an Erweiterungen – die den Funktionsumfang des Browsers erweitern und ihn so zu einem noch mächtigeren Werkzeug machen.

Jede noch so kleine Änderung im Code live zu schieben wäre ein enormer Aufwand. Und das schlimmste: Die Änderung wäre live, es kann also jeder sehen, dass der Button jetzt nicht mehr blau sondern grün ist. Auch das Screendesign für solche Änderungen anzupassen lohnt sich nicht. Und hier kommen Browser-Erweiterungen ins Spiel! Visual Inspector ist eine davon und will das Editieren zum Kinderspiel machen.

Visual Inspector: Kinderleichtes editieren


Visual Inspector ist eine kostenlose Chrome-Erweiterung und ein Live-Editor, mit dem CSS-Änderungen im Browser schnell umgesetzt werden können. Zum Ändern der Styles werden keine Coding-Skills benötigt, denn der Quellcode wird gar nicht erst geöffnet.

Die Erweiterung öffnet sich als schickes und selbsterklärendes Overlay, das besonders Designern gefallen könnte. Visual Inspector bietet unter anderem Möglichkeiten zum Inspizieren und Messen, auch von Farbe und Typografie. Außerdem lassen sich Design und Text editieren. Besonders praktisch ist das Exportieren der Änderung als PNG-Datei, so können Anpassungen schnell untereinander abgestimmt werden.

(Screenshot: t3n.de)

In Visual Inspector wird außerdem die gesamte Farbpalette sowie Font-Sammlung ersichtlich. Unter Assets sind zusätzlich alle sich auf der Seite befindenden Bild-Dateien zum Download verfügbar.

Ganz ohne Coding-Skills kommen Anwender leider nicht davon, zumindest nicht, wenn sie die Änderungen am Ende live schieben müssen. Um sich allerdings ein temporäres Bild von einer möglichen Anpassung zu machen, ist Visual Inspector eine schnelle Möglichkeit zur Visualisierung.

Außerdem interessant:

 

Zur Startseite
Bitte beachte unsere Community-Richtlinien

Wir freuen uns über kontroverse Diskussionen, die gerne auch mal hitzig geführt werden dürfen. Beleidigende, grob anstößige, rassistische und strafrechtlich relevante Äußerungen und Beiträge tolerieren wir nicht. Bitte achte darauf, dass du keine Texte veröffentlichst, für die du keine ausdrückliche Erlaubnis des Urhebers hast. Ebenfalls nicht erlaubt ist der Missbrauch der Webangebote unter t3n.de als Werbeplattform. Die Nennung von Produktnamen, Herstellern, Dienstleistern und Websites ist nur dann zulässig, wenn damit nicht vorrangig der Zweck der Werbung verfolgt wird. Wir behalten uns vor, Beiträge, die diese Regeln verletzen, zu löschen und Accounts zeitweilig oder auf Dauer zu sperren.

Trotz all dieser notwendigen Regeln: Diskutiere kontrovers, sage anderen deine Meinung, trage mit weiterführenden Informationen zum Wissensaustausch bei, aber bleibe dabei fair und respektiere die Meinung anderer. Wir wünschen Dir viel Spaß mit den Webangeboten von t3n und freuen uns auf spannende Beiträge.

Dein t3n-Team

4 Kommentare
Tobias Keller

Ich weiß ja nicht,
mir reichen die Chrome eigenen Dev-Tools, ein Color-Picker und
was zum Pixel messen.
Aber für „Laien“ bestimmt ganz interessant,

Antworten
Twibbi

Visual Inspector muss man wirklich ausprobieren.

Antworten
Heinz

Ich bin Laie. Wie Tobias bereits geschrieben, für mich ist das Tool sehr interessant.

Antworten
Zip
Zip

Coding, ganz ohne Coding-Skills, toll! Wenn man einfach grundlegend lerne würde was man anbietet, dann wäre man ohne visuelle Tools schneller und exakter unterwegs und wüsste womöglich sogar noch was man tut.

Antworten

Melde dich mit deinem t3n Account an oder fülle die unteren Felder aus.

Bitte schalte deinen Adblocker für t3n.de aus!

Hey du! Schön, dass du hier bist. 😊

Bitte schalte deinen Adblocker für t3n.de aus, um diesen Artikel zu lesen.

Wir sind ein unabhängiger Publisher mit einem Team bestehend aus 65 fantastischen Menschen, aber ohne riesigen Konzern im Rücken. Banner und ähnliche Werbemittel sind für unsere Finanzierung sehr wichtig.

Danke für deine Unterstützung.

Digitales High Five,
Stephan Dörner (Chefredakteur t3n.de) & das gesamte t3n-Team

Anleitung zur Deaktivierung