Wow…

This is probably just about the most useful piece of software I have seen in a long time.
It’s a Mozilla & Firefox plugin full of STUFF for web developers.
It can outline blocklevel elements, table cells, or any other element you specify. Something that would be extremely useful on it’s own. I used to do that by manually adding border=”1″ bordercolor=”red” to table cells, or later, the equivalent CSS. Which whilst effective, was a hell of a lot more work than just clicking a button

It has the obligatory menu filled with validation features – HTML / CSS, Link validation, usability validation, and accessability validation.
You can get a quick overview of the layout by using the “Topographic Information”, view block sizes, and even get a report on how fast your page will load, and what you can do to improve it.

There’s also a whole heap of image related tools, (find broken images, display image dimensions, hide images, highlight images with no alt tags….), and options to quickly disable Javascript, Java, cookies and other such things, so as to aid you in cross browser compatibility.
But probably the most impressive feature is the CSS tools. You can click on an element in the page to see what CSS values it has (Assuming you have the DOM Inspector available), or you can replace the current stylesheet with one off your hard drive, or best of all, you can edit the CSS right there in the browser, and instantly see the effects. Once you’ve made your changes you can then save the modifed stylesheet so you can upload it to the server.
I really wish I had known about this extension earlier, as it’s going to make my life so much easier.

Live CSS Editing

Outlining Block Elements

Topographical view