Mozilla Firefox as a Web Developer Tool
Published on May 24, 2005 in Design, FirefoxThe Firefox web browser is fast becoming known as an excellent browser, but it is not as well recognized as a great web developer tool. Though not an exhaustive list, the following Firefox extensions allow a web developer to more easily create and manage a web site. Obviously some extensions will be more valuable to some developers than to others, but the Aardvark, Colorzilla, and Web Developer extensions should be considered an essential part of any developer’s toolbox.
- Aardvark is an excellent CSS debugger with a bunch of keyboard modifiers. Shows things such as the element name and id or class name of a selected element.
- Colorzilla is an eyedropper tool with several other useful functions. Hovering over an element will show color info, DOM path info, and X,Y offset from the previous click. In addition, Colorzilla provides a magnifying tool and a color mixer.
- Fangs presents a textual representation of a web page, similar to the way it would be read by a screen reader.
- Fireftp is a FTP client which allows for easy access to a FTP server.
- LinkChecker checks every link on a web page to find bad links. LinkChecker’s simple color coding scheme makes it easy to spot a bad link, quickly, on any page.
- Live HTTP Headers displays information about the HTTP headers on a page.
- MeasureIt draws a ruler across a web page to display the width, height, or alignment of any page element.
- User Agent Switcher allows FireFox to identify itself as a different web browser, such as IE or Opera, to a web server.
- View Rendered Source is another way to view the source of a web page in a color-coded and/or nested mode.
- The Web Developer extension adds a toolbar to the browser which contains various
web developer tools designed to allow for easy viewing of various information about a web page. It will outline elements on a page, display the size of images, give CSS and form information, disable certain elements on a page, and much more.
Note: I have omitted some extensions, such as the Edit CSS extension, that an extension in the list provides much of the same functionality as. Secondly, the links point to the developer’s page not the Mozilla Firefox extension page.