Page 1 of 3 In this multi-part series, we are going to learn all about Firebug, the premier (and free) web development tool for Firefox. Part 1 is an overview of the plugin, including installing, and basic operation of Firebug. In future sections I will provide a detailed explanation of many of Firebug's amazing features.
Firebug is a great tool for web developers. Once you've learned all the options that the Firebug tool offers, you'll wonder how you ever developed web sites without it.
In this first section, we'll provide a brief explanation as to what Firebug and Firefox are, provide instructions on installing both, and then explain the basic settings of opening and closing and enabling and disabling Firebug.
The Firebug plugin for Mozilla Firefox enables on the fly debugging, editing, and monitoring of a web site's CSS, HTML, DOM, and JavaScript, though these edits aren't saved on the fly. Firebug also provides other web development tools, such as HTTP header monitoring, file download time, image download speed and so on.
Firebug enables JavaScript debugging, on-the-fly HTML editing, and CSS inspection down to the element level. Firebug provides information on all DOM elements within a page, and enables you to view all assets that make up a web page, down to the asset level.
Firebug was written by Joe Hewitt, one of the original Firefox creators. Firebug is so powerful and useful, that people have developed plugins for the Firebug plugin. We'll discuss the plugins for Firebug in Part 12 of this series.
Mozilla Firefox is a free and open source web browser. With approximately 20% of the market share, Firefox is the second-most popular browser after Internet Explorer (IE). Mozilla Firefox version 3.0 was launched in June 2008, but most users are still using Firefox 2, which is still being supported by Mozilla.
Firefox is much more web standards compliant than IE, implementing current web standards and implementing anticipated likely additions to the standards that are currently being written by the W3C. Firefox includes tabbed browsing, spell checking, a download manager, and all other features you need from a web browser. Firefox also allows for the addition of third party add-ons. Due to the fact Firefox was built to be extensible, there are many very cool add-ons created by third-party developers. You may want to try some of the more popular ones, which include NoScript (allows you to control what JavaScript sites can run in your browser), FoxyTunes (a media player toolbar), StumbleUpon (discover new web sites), Adblock Plus (an ad blocking utility), the Web Developer toolbar and, of course, Firebug. Because of the standards compliance, and the excellent web development tools, as a developer of web sites, you should be developing primarily in Firefox and checking all other Grade-A browsers for compatibility.
Keywords
Firebug, Firefox
