Firebug, A Big Help For Creating and Designing Websites

Add comments

Actually this is only if you are using the web browser Firefox though…
If you are not, maybe you should consider switching to it because it’s free and what they say is true : it is safer, more secure & highly customizable.

So, What Is Firebug ?
Firebug is a Firefox add-on which allows to inspect the code of pretty much everything that constitutes a web page.
With Firebug, you will be able to view, edit and debug (live) the following components : HTML, CSS (Cascading StyleSheets) and the javascript.

The HTML

	You can see from the right picture how Firebug works. The HTML code can be seen in the form of a tree on the left side of the screen. When selecting an item (an HTML tag) from this tree, you can see live of which part of the design it corresponds on your website.
In the example, I have selected the div tag which corresponds to the right column and it appears in light blue.In addition, the style (css) applied on the selected HTML tag is displayed on the right side of the screen. The HTML code is modifiable and the results can be seen right away! Excellent for experimenting with design…

The CSS

Viewing and editing the CSS code is super easy as well. Just click on an item and modify with another value… lively your website shows the changes.

Exploring The Javascript And DOM object

Javascript is kind of hard to debug sometimes. Well if you do have to debug or code some javascript for your website or blog, then Firebug is what you are looking for. You can see and edit BUT you can put breakpoints and follow the code step by step! Makes things much easier for developing…