Firefox is my development browser of choice, and has been for a long time (since Firebird 0.6 from what I remember). The browser on its own has a basic set of tools for debugging but with extensions you can turn it into the perfect tool for developing websites.
Note: This is in no way a comprehensive list; there are hundreds out there to choose from, these are the few that I use every day. You only need to take a quick search of delicious to find “X number of Firefox extensions you must use!!” lists; I’m not a big of those types or posts as they all seem to post the same info.
One word of warning when using Firebug; make sure you disable / close it when you aren’t using it as it will increase page render time massively.
Web Developer Toolbar
Colorzilla is one of those extensions that you don’t realise how much you use it until it isn’t available to you. This little tool allows you to hover over any colour (color) on a page and it will give you the corresponding Hex / RGB value. Great for when you don’t want to go hunting through a stylesheet for the colour.
It has a few options I very rarely use such as the colourpicker and the ability to save favourite colours, I prefer Photoshop and a notepad to be honest but each to their own I guess.
For a long time I was a FlashFXP user; that was until I stumbled upon FireFTP. The extension embeds an FTP client directly into a Firefox tab! My favorite feature (which is in most FTP clients) is the ability to keep local and server folders in sync. It’s also possible to drag files directly from a folder on you computer straight to the server (not vice versa though unfortunately).
One feature I wish it had was the ability to ignore certain file types when uploading e.g. .svn folders. It’s possible to get round this issue by hiding hidden files / folders; then of course you fail to upload the hidden .htaccess file and break your URLs…. oh well not a bad compromise when it’s free to use (the author does accept donations which go to a generous charity for children).
Fireshot is one of many screenshot tools available for Firefox; it comes in both free and pro versions, but I’ve never needed any of the pro features. Gone of the days of pressing the “Prnt Scrn” button and stitching long pages together, Fireshot does it all for you. Another great feature is the ability to screenshot Flash on a page which doesn’t usually show up using print screen.
My final extension is HTML Validator, this places a small icon in the bottom right of your status bar and tells you when it runs into invalid HTML. Now I don’t always use this but its good when you are editing large pages and your layout is breaking due to a missing closing tag; it may not solve the issue but it will give you a line number of where to start looking.
I would recommend disabling the plug-in by default then creating a ‘whitelist’ of sites you wish it to be enabled, as it can seriously slow down your browser.
If you have any recommendations for extensions let me know, maybe I’m missing a treat in that “must use!” extension.