Firebug, Code Chrome

Add Firebug Lite's powerful Web development tools to the Chrome interface with this free extension.

Google Chrome is gaining popularity and acceptance as an alternative to Firefox and Internet Explorer, and not just among Web surfers; Web developers like Chrome's speed and flexibility as well as its open-source components. Firebug Lite for Google Chrome is a free extension that adds the functionality of the popular Firebug Web development tool to the Chrome interface. Firebug Lite lets you inspect and modify HTML in real time, analyze network performance and activity, and debug JavaScript with what is claimed to be the most advanced debugger available in a browser.

Installing Firebug Lite for Google Chrome was as simple as opening the page in Chrome, clicking the download link, and allowing the changes. The Firebug Lite icon appeared in the extensions space to the right of the toolbar; clicking it toggled the program's lower panel open and closed. This expandable, detachable panel spans the width of the Chrome interface. Its file menu has two entries: Inspect, to analyze the target Web page, and Clear, to reset the field. The tabbed tool tray contains entries entitled Console, HTML, CSS, Script, and DOM. A small arrow on the bottom frame toggled open a side panel for entering and running scripts. Navigation buttons let us deactivate Firebug Lite for the current page as well as open the program in a pop-up window, which let us move it around independent of Chrome.

Before using Firebug Lite, we watched the developer's brief video tutorial, which does a fine job of walking new users through the program's various tools. We navigated to a personal Web page and clicked Inspect. The HTML tab displayed the code in the main panel, while the smaller side panel opened with three tabs displayed: Style, Computed, and DOM, with DOM displaying comprehensive Java information. Following the tutorial's instructions, we were quickly able to alter the HTML enough to see a visible change in the site but without doing any harm. Clicking CSS opened the Cascading Style Sheets tool and a drop-down menu on the main taskbar listing all the associated sites for inspection.

Firebug Lite for Chrome does too much to cover it all adequately here, but all you really need to know is this: It's free, it integrates seamlessly with Chrome, and it works very well indeed.

CNET Top 5
Companies Apple could buy with their billions
Apple's sitting on a massive pile of cash. Here are five interesting ways they could spend it.
Play Video
 

Member Comments