This is why FireFox rocks! (the only downside is one can never stop at one) Starting with the Basic must have extensions. These are the first ones for me to install on new machines, and evangelize to clients.
- Firebug: a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.
- Web Developer: Adds a menu and a toolbar with various web developer tools. like live CSS edit.
- FireFTP: a FTP client within Fire Fox.
- Screengrab. does what is says on the tin.
- ColorZilla: Advanced Eyedropper, ColorPicker, Page Zoomer and other colorful goodies…
- MeasureIt: Draw out a ruler to get the pixel width and height of any elements on a web page.
- IE View (Windows only): Lets you load pages in IE with a single right-click, or mark certain sites to *always* load in IE.
- CSSViewer :A simple CSS property inspector.
- Extended Copy Menu: Provides the option to copy selection as plain text or html…
- FireColour :a handy Colour Picker and Converter. Its gives the colour values in 20 colour models. The conversions for HEX, RGB and XYZ to 20 models.
- JSView: be aware of js and css a page uses.
Then there are the are more advanced tools, used as needed:
- JSONView:View JSON documents in the browser.
- Regular Expressions Tester: Testing Tool for regular expressions with color highlighting
- Unicode Input Tool/Converter: Unicode lookup and chart view to find international characters or symbols; converts entities or character references (hex and dec) into Unicode and back.
- XPather: XPath generator, editor, inspector and simple extraction tool.
- RESTTest:Construct custom HTTP requests to directly test requests against a server .
and FireBug extensions (extensions to an extension), which make it even more useful:
- FireRainbow :Javascript syntax highlighting
- YSlow: From Yahoo, YSlow analyzes web pages and tells you why they’re slow based on Yahoo’s rules for high performance web sites.
- FireQuery a collection of Firebug enhancements for jQuery.
- CodeBurner for Firebug: CodeBurner is a Firefox add-on that integrates with Firebug, to extend it with reference material for HTML and CSS.
- Firecookie: Firecookie is an extension for Firebug that makes possible to view and manage cookies in your browser.
- CSS Usage: view which CSS rules are actually used.
- Firefinder for Firebug: Finds HTML elements matching chosen CSS selector(s) or XPath expression
It is also worth while searching for fire bug info and extensions or got Get Firebug (and Get Firebug extensions ).