20 Google Chrome Extensions für Webdesigner und Programmierer

Google Chrome Extensions für Webdesigner und Programmierer

Wegen der prak­ti­schen Addons war Firefox bisher mein abso­luter Lieblings-Browser. Doch die kleinen Helfer gibt es inzwi­schen auch für Google Chrome. Und die soge­nannten Google Chrome Extensions haben wirk­lich so einiges zu bieten, um das Leben von Webdesignern und Programmierern zu ver­süßen. Come, have a look ;-)

1. Eye Dropper

Google Chrome Extensions für Webdesigner und Programmierer

Mit Eye Dropper kannst du die ver­wen­deten Farbwerte auf Webseiten bestimmen und speichern.

2. MeasureIt

Google Chrome Extensions für Webdesigner und Programmierer

Willst du wissen, wie breit die Sidebar deiner Lieblings-Webseite ist? Mit MeasureIt kannst du es ganz ein­fach nachmessen.

3. Lorem Ipsum Generator

Google Chrome Extensions für Webdesigner und Programmierer

Falls du Blindtexte für dein Webdesign brauchst, hilft dir diese Chrome Erweiterung. Du kannst sogar bestimmen, wie viele Paragraphen oder Wörter du benötigst.

4. Pixlr Grabber

Google Chrome Extensions für Webdesigner und Programmierer

Mit dem Pixlr Grabber kannst du bestimmte Elemente einer Webseite oder einen kom­pletten Screenshot kopieren, und an das Bildbearbeitungs-Tool Pixlr wei­ter­leiten oder auf deinem Computer speichern.

5. Color Picker

Google Chrome Extensions für Webdesigner und Programmierer

Color Picker gibt dir den HEX oder RGB-Farbwert jeder aus­ge­wählten Farbe, zusätz­lich kannst du eigenen Farbwerte erzeugen.

6. Aviary Screen Capture

Google Chrome Extensions für Webdesigner und Programmierer

Mit Aviary Screen Capture kannst du Screenshots einer Seite direkt an das Online-Tool Aviary wei­ter­leiten, und das Bild dort weiterbearbeiten.

7. Picnik

Google Chrome Extensions für Webdesigner und Programmierer

Noch ein Tool mit dem du Bilder oder ganze Screens spei­chern kannst, um sie dann mit dem Bildbearbeitungs-Tool Picnik zu bearbeiten.

8. Snippy

Google Chrome Extensions für Webdesigner und Programmierer

Mit Snippy kannst du Elemente einer Webseite in einem Account spei­chern, um sie später wieder zu nutzen, z.B. in ein Google Dokument einzufügen.

9. Pendule

Google Chrome Extensions für Webdesigner und Programmierer

Pendule ist ein wahres All-Rounder Tool für Programmierer. Du kannst CSS oder JavaScript im Browser deak­ti­vieren, den Quellcode einer Webseite ana­ly­sieren, Farbwerte und Größen bestimmen und und und…

10. Firebug Lite

Google Chrome Extensions für Webdesigner und Programmierer

Firebug Lite ist auf jeden Fall ein »Must Have« für alle Programmierer. Das Tool anayl­siert den Code einer Webseite, und hilft so Fehler aus­findig zu machen.

11. IE Tab

Google Chrome Extensions für Webdesigner und Programmierer

Die IE Tab-Extension ist prak­tisch beim Test einer Webseite auf Browser-Kompatibilität. Mit einem Klick bekommst du eine Ansicht deiner Webseite im Internet Explorer.

12. Resolution Test

Google Chrome Extensions für Webdesigner und Programmierer

Resolution Test zeigt Ansichten deiner Webseite in ver­schie­denen Screen-Auflösungen an.

13. Web Developer Toolbar

Google Chrome Extensions für Webdesigner und Programmierer

Die Chrome Variante des beliebten Addons hilft eben­falls mit etli­chen prak­ti­schen Features bei der Programmierung und Fehleranalyse deines Codes.

14. Speed Tracer

Google Chrome Extensions für Webdesigner und Programmierer

Speed Traver ana­ly­siert, welche Elemente deiner Webseite das Laden im Browser verlangsamen.

15. Copy wit­hout Formatting

Google Chrome Extensions für Webdesigner und Programmierer

Du benö­tigst Text ohne Formatierung? Dann ist diese prak­ti­sche Extension ist genau das Richtige für dich.

16. Chrome SEO

Google Chrome Extensions für Webdesigner und Programmierer

Page Ranks, Backlinks, Anzahl der Bookmarks…die Chrome SEO Extensions weiss ein­fach alles.

17. BuildWith

Google Chrome Extensions für Webdesigner und Programmierer

Mit BuildWith erfährst du welche Tools, Plugins, JavaScript-Libraries für eine Webseite ver­wendet werden.

18. Plain Clothes

Google Chrome Extensions für Webdesigner und Programmierer

Plain Clothes zeigt dir alle Webseiten nackt, also ohne CSS-Formatierung an.

19. Chrome Sniffer

Google Chrome Extensions für Webdesigner und Programmierer

Ein prak­ti­sche Extensions mit der du schnell her­aus­finden kannst, auf wel­chem CMS, Blog-Plattform, Shopsystem eine Webseite auf­ge­baut ist.

20. Domain Availability Checker

Google Chrome Extensions für Webdesigner und Programmierer

Wenn du eine spon­tane Idee für eine neue Domain hast, erfährst du mit dieser Extensions sekun­den­schnell, ob die Domain noch zu haben ist.

Wie gefallen dir die Extensions von Google Chrome? Kennst du wei­tere Extensions, welche die täg­liche Arbeit als Webworker erlei­chern? Ich freue mich wie immer auf deine Tipps!

7 Kommentare

  1. Oli

    Hallo zusammen, tolle Sammlung die mir sehr zuspricht. Wenn ihr jetzt noch aus Resolution Text Resolution Test macht stimmt alles :-)
    *schlau­scheisser aus*

    Vg
    Oli

  2. Ellen

    @Oli: Danke dir für den Hinweis, Oli, ist prompt erle­digt :-) Du weißt ja, immer diese Freitage… ;-)

    Viele Grüße
    und ein schönes Wochenende
    Ellen

  3. Dennis

    Hallo Ellen,

    wirk­lich schöne Über­sicht, da kann man den Chrome ja end­lich auch zur Webentwicklung nutzen :)
    Nur ein kleiner Hinweis - du linkst auf die inof­fi­zi­elle Firebug Version (= nicht vom Firebug Team). Diese wurde ver­öf­fent­licht als es noch keine offi­zi­elle gab. Der Autor emp­fiehlt mitt­ler­weile selbst auf die Version des Firebug Teams umzu­steigen (»NOTE: Firebug lite team has made their own exten­sion, I recom­mend you down­load it.«).

    Hier der Link zur offi­zi­ellen Version: http://bit.ly/bgteOR

  4. Dennis

    Sorry noch was ver­gessen: Besser als der Firebug sind übri­gens die ein­ge­bauten »Chrome Developer Tools«. Einfach mal mit der rechten Maustaste irgendwo auf die Seite kli­cken und »Element über­prüfen« klicken.

  5. Ellen

    @Dennis: Genial! Vielen Dank für den Hinweis auf die offi­zi­elle Firebug-Verison. Hehe, so klappt das gleich viel besser ;-)

    Auch den Link im Artikel habe ich auf die offi­zi­elle Version geändert :-)

    In die Chrome Developer Tools habe ich bisher erst kurz rein­ge­schaut. Ich möchte mir das aber unbe­dingt noch genauer anschauen. Sieht näm­lich echt klasse aus, was man damit alles machen kann!

    Vielen herz­li­chen Dank auch für diesen Tipp, Dennis, und viele Grüße :-)

  6. Daniel

    Bin ja eigent­lich Firefox-Extentions-Fan bisher,aber wenns bei Chrome mitt­ler­weile genauso gute Werkzeuge gibt, lohnt sich sich die Nutzung vllt mehr als nur zum BrowserTest. Zumal FF4 meine Lieblings-Addons nicht­mehr will, kann ein umschwenken doch mal neuen Adds die Chance geben.

Hinterlasse eine Antwort

Pflichtfelder sind mit * markiert.

*


Top