Firefox-Extension: FireBug
Gerade erst hatte ich meine persönliche Hitliste der Firefox-Erweiterungen sozusagen »als Post zementiert« da stellt Manuela heute eine neue vor, die wohl ganz schnell in meiner TOP 3 landen wird. FireBug ist kein neuer Film der Pixar Animation Studios, sondern eine multifunktionelle Erweiterung die in ihrem Funktionsumfang fast der gnadenlos guten WebDeveloper Extension Konkurrenz macht. Schwerpunktmäßig auf die Überprüfung und das Debugging von JavaScript und AJAX ausgelegt, bietet FireBug aber komplette Kontrolle über das Document Object Model (DOM) einer Webseite und so lassen sich auch CSS und XHTML prüfen, Fehler anzeigen und mehr. Über Optionen kann man die Fehlersuche auf bestimmte Bereiche einschränken, also z.B. nur JavaScript-Fehler anzeigen lassen u.ä.
Und ähnlich wie in der WebDeveloper Extension lassen sich alle Teile des DOM nicht nur betrachten, sondern Live und in Farbe auch bearbeiten. FireBug läßt sich nicht nur mit der Maus sonder auch mit der tastatur bedienen und letzteres ist in vielen Fällen sogar komfortabler und genauer, weil man sich mit den Cursor-Tasten gezielt durch das DOM arbeiten kann. Wer sich übrigens nach der Installation mit zwei FireBug-Fehlermeldungen alá:
FireBug.domUtils has no properties ... style.js (line 265)
konfrontiert sieht, der hat den DOM-Inspector des Firefox nicht installiert. In diesem Fall einfach den Firefox noch mal neu installieren und dabei nicht die Standardvariante wählen, sondern die Benutzerdefinierte (dort dann DOM-Inspector auswählen). Trotz seiner geringen Größe (55 kB) ist FireBug sehr umfangreich, schon ziemlich ausgereift und eine Pflicht-Extension für jeden Webentwickler. Einige Bugs sind natürlich noch enthalten, diese können jedoch im Forum von Joe Hewitt angesprochen und diskutiert werden. Gestern kündigte Hewitt darüber hinaus noch einen echten JavaScript-Debugger für die nächste Version des Käfers an. In seinem Blog gibt es regelmäßig Tips und Tricks zu diesem Tool.
Mit der Troika: WebDeveloper, FireBug und XRay sollte ein Webdesigner eigentlich rund um zufrieden sein, läßt sich doch der Code einer Webseite nunmehr in wirklich alle Einzelheiten zerlegen. Und wenn dann erst mal zwei (!) grüne Häkchen in der Statuszeile des Firefox erscheinen (HTML Tidy und FireBug), dann ist die Seite vom technischen Standpunkt her, wohl wirklich fehlerfrei.
Artikel: Firefox-Extension: FireBug
Datum: Thursday, 13. April 2006, 15:20 Uhr
Kategorien: Browser, Webdesign
Feed zum Beitrag: RSS 2.0 · Trackback: Trackback-URL
Diesen Artikel kommentieren.
Journal (Artikel)
17. April 2006
@ 23:21
Hi John,
wirklich ein nettes Tool der Firebug.
Lässt sich damit tatsächlich auch das CSS bearbeiten, so wie mit der Web-Developer-Toolbar?
Ich finde nur die Möglichkeit, Attribute von Tags im Quelltext zu ändern.
Grüße
Franziska
18. April 2006
@ 00:13
Hi Franziska,
Du hast Recht, CSS läßt sich nicht direkt editieren. Ich seh aber FireBug ohnehin eher als Ergänzung zur WebDeveloper Toolbar. Bugs Stärken liegen wohl vor allem im JavaScript/AJAX-Bereich.
Obwohl zumindest die Anzeige der CSS-Elemente und -Attribute sehr praktisch ist und den CSSViewer erspart. ;o)
John