The View from the Moon

All | Miscellaneous | Personal | Solaris

« Solaris Challenge... | Main | Whoohoo! gtkam &... »

Thursday December 02, 2004

Three Cheers for Firefox's "Web Developer"

Wow. If you ever have to spend time writing HTML or CSS, have I got a treat for you. Check out the Web Developer Extension written by Chris Pederick.

This thing is great because it lets you reveal the structure of your page, including anchors, blocks, deprecated elements, image meta-data, edit the CSS of a page, validate HTML, CSS, and other characteristics, and make good choices about accessability. It also includes handy buttons which take you to the relevant standards. It's thoughtfully organized, and has attractive, colorful icons.

Probably the two features which really made my jaw drop are Display Topographic Information which re-renders your page to show you the level of nesting using topographic-map style colors; and View Style Information, which converts your mouse cursor to a crosshair. As you mouse over different page elements, it shows you the "path" to the object. So on this page, when you mouse over The View from the Moon in the title, you see:

    html > body > table > tbody > tr > td.title > div > div.website_title

in the status bar. Clicking on the element pops up a new tab which contains the style information pertinent to that element. So if you ever wondered "how did they do that?" or "what do I have to do to the CSS to affect this element?" it's now trivial to figure out.
(2004-12-02 01:27:20.0) Permalink Comments [3]
Trackback: http://blogs.sun.com/dp/entry/three_cheers_for_firefox_s

Comments:

I agree, that is one of the best Firefox extensions out there. Another tool that I find useful when developing websites is called URLInfo. It's nothing new, but it consolidates many tools and utilities into one simple, easy to use interface.

Posted by Jason Santos on December 02, 2004 at 06:21 AM PST #

Dan, that is good. Now you've not just helped me with Solaris beta; you've made a pretty good contribution to my real work too. Thanks!

Posted by Peter T on December 05, 2004 at 01:25 PM PST #

Most of the features in that extension really come from http://www.squarefree.com/bookmarklets/ . In bookmarlet form, you can use many of the tools in MSIE and Opera.

Posted by Dan Nelson on December 08, 2004 at 08:00 AM PST #