Seit Anfang der Woche kann Firefox 10 heruntergeladen werden. Im Frühjahr wurde bekannt dass Firefox an Firebug vorbei, sein eigenes Set an Web Developer Tools bauen will und ging mit einer Konsole und einer Javascript-Sandbox an den Start.

Mit Firefox 10 hat man sich einen weiteren Schritt gen Firebug-Substitut hin bewegt: nun ist auch ein HTML-/CSS-Inspektor inkludiert.

Mit der Tastenkombination Apfel + Alt + i (Windows-/Linux-User schauen bitte selber nach) kann man auf der Seite ein beliebiges Element auswählen. Es klappt dann zuerst eine Leiste mit der DOM-Verschachtelung aus und per “HTML”- oder “Style”-Button auch ein Panel mit dem HTML-Code und den für das Element relevanten Selektoren.

Der “Properties”-Button schaltet das CSS-Panel zu einer Ansicht um, wie man sie von dem IE Web Developer Tools, aber noch nicht von Firebug kennt: einer Auflistung aller CSS-Attribute und von welchen Definitionen sie … ähm … definiert werden. Wenn man weiß, dass die Schriftgröße der Headline falsch ist, muss man sich nicht mehr durch diverse Selektoren kämpfen, die auf das A-, H1-, .entry-, H1.entry- oder sonstige Elemente wirken können, sondern kann sich gezielt das Attribut font-size stürzen und bekommt eine Liste der Selektoren die dieses Attribut ansprechen.

Ich weiß noch nicht, was ich von dem Ausbau der Web Developer Tools durch Firefox halten soll. “Konkurrenz belebt das Geschäft” für Firebug oder das Verschwenden von Energie die man woanders besser einsetzen könnte, als sich zu bemühen Firebug hinterherzuhecheln?

In den Menüs hat das Werkzeug schon für Chaos gesorgt, denn der Name “Web Developer” ist identisch mit der sehr populären Erweiterung “Web Developer” von Chris Pederick und so besitzt das Tools-Menü nun zwei gleichnamige Einträge.

Pedericks “Web Developer” lässt sich weiterhin ebenso problemlos nutzen wie sich auch Firebug mit Firefox “Web Developer Tools” co-existiert – auch wenn das Aufklappen von Firebug zusätzlich zu den Firefox-Tools nicht ästhetischen Höchstansprüchen genügen mag…

Firebug bleibt unverzichtbar. Die Firefox-Tools decken noch nicht alle Bereich in der entsprechenden Tiefe ab – und solange Farbwerte nur im RGB()-Format statt im Format wie sie Stylesheet angegeben wurden (i.d.R. Hex) sind die Tools nahezu unbrauchbar. Die Konsole kommt nicht an das “Net”-Tab von Firebug heran und im Javascript-Bereich ist anscheinend der alte, klobige DOM-Inspector inzwischen rausgeflogen und noch nicht ersetzt worden.

Ich bin auf die zukünftige Entwicklung von Firebug gespannt. Opera hat mit Opera Dragonfly ein ästhetisch sehr ansprechendes Konkurrenzprodukt herausgebracht und neue Webkit-Nightlies (genauso wie Preview-Versionen von Opera) bauen CSS-Style-Profiler ein: wie lange braucht es also um bestimmte CSS-Styles zu rendern.

Es macht deutlich dass im Web Design-Bereich auch die nächsten Jahre in nicht minder hohen Tempo fortschreiten werden, wie die letzten 2-3 Jahre.