Nearly every browser has an integrated suite of developer tools that can help debug and develop websites, but Firefox has been lacking in that area by default. Firefox didn't need an integrated suite of web development and debugging tools since it was quite extensible, and had a powerful add-on for all who needed development tools, FireBug. FireBug is still available, and popular, and continues to be developed for each new Firefox release. But if you were always excited to learn about how the web works, now Firefox will put the tools straight in your hands.
So why does Firefox need its own set of developer tools? The intention of Firefox developers is to have a better alternative to traditional developer tools such as FireBug, Opera Dragonfly, and other similar developer tools available in other browsers. While these tools are quite powerful and useful, they can be heavy and try to offer all features, from editing the styles, to editing the HTML, the console, etc. all in the same interface under different tabs.
The way Mozilla developers are approaching the integration of developer tools in the browser is to have each aspect of web development as its own separate tool, focussed on one job. Instead of a new FireBug-like panel that tries to do it all, Firefox's new developer features divide the task among multiple components. After all HTML, CSS and JavaScript are distinct languages with very different syntax. A tool optimized for one will not work well with the other, and Firefox developers are thus trying to make a separate tool to edit each type of content. So if you are a designer and want to just play with the CSS of the page without bothering with the other stuff, now you can do that.
Some of these components have been in development for a long time, and have already landed in previous versions of Firefox, while some are still to come. Firefox 10, 11 and beyond will bring a number of exciting tools, but before we talk about them, lets look at the features already available.
The Web Console
This feature has been available since Firefox 4, and has received incremental improvements since then. The web console offers a way to inspect the opened web page via a command line interface, and to run small operations on the contents of the page. It also displays any debugging messages, errors, and other useful information such as network activity. Each log entry can be clicked to reveal more information.
