FireFox: Plugins für WebDesigner, Programmierer, Web-Developer

14. August 2010 | 5 Kommentare

Logo: FireFox BrowserEs gibt viele nützliche Plugins für den FireFox , die gerade für die Internet-Programmierung enorm wichtig sind und mir das tägliche Arbeiten deutlich erleichtern.

Sie allein sind schon Grund genug, auf den InternetExplorer zu verzichten. Diese sollen hier kurz beschrieben werden. (Das Dokument wir aktualisiert!!)

Web Developer Toolbar
Das ultimative Tool zur Seitenanalyse. Hier lassen sich alle DIVs, Objekte, Formulare und Bezeichner, Skripte etc. ausgeben. Außerdem kann man die Seite auf Konformität mit W3C, WAI, CSS usw. testen. Besonders praktisch sind die Tatenkombinationen Strg+Shift+C, um sich alle, mit der aktuellen Seite verknüften StyleSheets ausgeben zu lassen – das spart enorm Zeit und Herumsuchen nach CSS-Dateien. Mit Strf+Shift+S schaltet man alle StyleSheets aus und entdeckt so auch alle verstecken Elemente mit einem Tastendruck. Es gibt noch einiges mehr zu entdecken, aber das macht lieber selbst.

FireBug
Soeben erst entdeckt und sofort verliebt. Ein Wahnsinns-Tool fürs Programmieren. So ähnlich wie bei einem WISIWYG-Editor kann man sich in einem oberen Rahmen die Seite anzeigen lassen und im unteren Bereich wird einem sofort der entsprechende Quelltext und sogar noch die CSS-Attribute für das gerade ausgewählte Element angezeigt. Nie wieder Quelltext anzeigen und rumsuchen! Ein schöner Tag heute! Danke Eike!

Search Status
Google Page Rank und Alexa Page-Rank-Anzeige für die aktuelle Seite.

IE View [de]
Zeigt mit der rechten Maustaste ein Kontextmenü mit „Diese Seite im Internet Explorer anzeigen“ an – Praktisch um die Seite im IE zu testen, der ja doch noch immer ein bisschen kritischer auf den Quellcode blickt als Freund FireFox.

Measure It
„Maßbox“ (Lineal) in der Statusbar, um per Maus die Höhe und Breite von Seiteninhalten zu messen. Das erspart einen das ständige SceenShots machen, um Abstände zwischen einzelnen Objekten zu messen.

Color Zilla Color Picker
Ein Tool, das der Pipette von Photoshop entspricht. Damit kann man auf eine bestimmte Stelle auf der Webseite klicken und erhält von dieser Stelle den Farbwert in HEX- und RGB-Werten.

PrefBar
Oh, diese Ding benutze ich schon seit Jahren. Damit kann man JavaScript, Flash, Bilder abschalten, Cache, History und Cookies Löschen, die Fenstergröße auf Standardmaße wie 1024×768 heruntersetzen. Ich weiß nicht, wie Menschen ohne diese Erweiterung leben können.

View Source Chart [zeigt in sehr übersichtlicher Form den Quellcode an und hat dafür auch ein paar praktische ShotCuts an Board, mit dem man z.B. mit einem Tastendruck alle eingebunden CSS-Dateien angezeigt bekommt.]

Web Developer Toolbar [deutsch]
Ein tolles, nützliches, kaum zu beschreibendes Funktionenmonster. Damit kann sich alle Objekte mit Beschriftung der Seite anzeigen lassen, auf tausend Konformitäten und auch auf Barrierefreiheit testen.

Screen Grap [deutsch]
Erstellt einen Screenshot der aktuell angezeigten Webseite, auch über den sichtbaren Bereich hinaus, um diesen dann in Form einer PNG- oder JPEG-Datei auf der Festplatte abzuspeichern oder ihn in die Zwischenablage zu kopieren.

CSS Reloader
Jeder Webdeveloper hat schon gefühlte 10 Jahre auf Reloads von Seiten gewartet – dabei hat man doch nicht die Seite, sondern nur die CSS-Datei neu bearbeitet. Eigentlich braucht nur die einen Reload. Dafür hilft der CSS Reloader. Mit F9 wird nur die CSS-Datei neu geladen und nicht die ganze Seite.

Irgendwann tippe ich diesen Text mal noch ein bißchen ausführlicher…

Ähnliche Artikel:

Meta-Daten



5 Kommentare

Auch mal Kommentieren:

Kommentar