I'll spare you the awful joke about Firefox and its new hair extentions and get right to it. Over the past few months I have been a collector of useful Firefox extensions – mostly in the vein of Web Standards/Java Script/Accessible Web Development.

I wanted to point out some extensions that I found useful in hope that you will also find them useful in your journey’s as well and who knows maybe someone may point a great one out that I somehow missed. I have put links to the install page below the extension title for your convenience – yeah I know -- that’s just the kind of guy I am.

Dom Inspector

https://addons.mozilla.org/firefox/1806/

This is very useful if having to do some JS/XML work, It will easily illustrate where those dreaded text nodes are and allow you to stop wondering why object.parentNode.nextSibling.nextSibling.lastChild.firstChild.nodeName is returning “mulletMan”.

Gmail Notifer

https://addons.mozilla.org/firefox/173/

I think anybody whom has Gmail and Firefox has this extension already – “it’s pretty much the best extension ever” (Napoleon Dynamite reference in case you missed it)

ColorZilla

https://addons.mozilla.org/addon.php?id=271

This is a built in color selector which sits in the bottom left hand corner of the browser and makes it real easy to get any color from any comp, image or website that is open inside of Firefox. Not a huge time saver .. but I have always hated opening another program just to do one simple thing like copying a hexcode to a clipboard – now to find that darn Mozilla ruler extention.

LiveHTTP Headers

http://livehttpheaders.mozdev.org/

This is incredibly useful to see what headers are being passed, also to know which files are requested.

I learned (of course the hard way) that images that are display:none are indeed requested by the browser and downloaded, so don’t build your image gallery on the assumption that display:none prevents images from being downloaded – because its just not true dammit. But had I known about this feature/extension it would have saved me a lot of work.

BugMeNot

http://roachfiend.com/archives/2005/02/07/bugmenot/

A must have for EVERYONE, this will allow you to anonymously gain access to a particular section of a website which requires a free membership login. Do you have 3 LATimes.com user registrations? Then you are like me and everyone else – you need BugMeNot! Just right click on the form and choose “bug me not” – you’re in.

Web Developer 1.02

https://addons.mozilla.org/addon.php?id=60

This is a simple must have for every developer – it does so much may could cause your head to explode. If you get only one extension off this list, this needs to be it. Some of my favorite functionality includes the live CSS edit, outlining block elements, view-style information, disable CSS and W3C local code validation.

Sage

https://addons.mozilla.org/firefox/77

Sage is an FF extension for RSS junkies all over. I never liked the “live bookmarks feature” in Firefox, Sage enables you to bookmark pages and their RSS feeds will get added to your “sage feeds” and then a simple [ALT + S] will bring up your favorite feeds and update them. Brilliant!

Venkman JavaScript Debugger

http://getahead.ltd.uk/ajax/venkman

Finally recreated for Firefox 1.5 Venkman is the Swiss Army Knife for all JavaScript developers. You can put breaks into code (like alerts) and it will let you know what all objects and variable values are. If you have ever had more than 3 simultaneous alerts(); on a JavaScript function – you need Venkman. He’s good at busting JS bugs as he is Ghosts! Now we just need to find something for the dreaded IE JavaScript debugging.

IE Tab

https://addons.mozilla.org/addon.php?id=141

Now with a click of a mouse in Firefox you can change from the Firefox DOM to the IE Dom in all its buggy glory. I think this is great – no longer do you need to keep both memory beasts open at the same time, and previewing in IE is one click away.

JSView and HTMLValidator

https://addons.mozilla.org/addon.php?id=2076
https://addons.mozilla.org/firefox/249/

JSView will let you also view the source of any included JavaScript style or Included CSS file. This along with HTMLValidator which turns your view source window into a live validator you’ll be stomping out un-encoded ampersands and bad selectors like Barry Bonds and the game of baseball. It can also be fine tuned to also provide accessibility validation if so inclined.

HTML Validator also puts a small icon in the bottom right hand corner of the browser window to let you know as soon as a document you are working on goes sour. Great for anyone whom is trying to keep things valid.