FireFox Web Development Extensions
Nov
15
2007
A must for all web designers and app programmers is FireFox with a selection of time-saving and handy extensions that can increase your productivity.
Highlight errors in coding, validate HTML/CSS, inspect DOM, quickly view your pages with elements enabled/disabled with a selection of FireFox web development extensions. The following article contains a list of 30 web development extensions for FireFox. I don’t use all the extensions personally, but I find the following to be most useful:
- IE View Lite -Right-click in Firefox to instantly load the page in Internet Explorer. Great way of testing CSS compatibility across FF/IE.
- Firebug – Inspect, view and edit your coding. View things as they happen dynamically in the DOM. A great resource for debugging code errors, and testing JS/CSS/HTML and debugging Ajax.
- Web Developer – Extremely useful tool that lets you disable JS, Meta refresh, disable CSS or view print.css. Disable images and view information about the HTML page. View page at different screen resolution. An indispensable and must have tool for web designers/developers.
- MeasureIt – Drag an opaque box over images, tables and columns to get exact pixel dimensions.
- ColorZilla – Use this tool to find out colours used on websites.
There are a few extensions mentioned in the article that I am interested in testing.
- Greasemonkey – Allows you to customize the way web pages look and function.
- FirePHP – FirePHP shows you what your PHP code does to generate the page you are currently looking at.
