Presented by Nick Batik, Pleiades Services
Firebug is a Firefox extension
To get it, go to Firefox menu under Tools > Add-ons and search for Firebug and install it into your browser.
Firebug allows you to go under the hood of your browser. You can view and change the code on any website to see what’s running and what you can do to modify it. All changes are temporary in your own browser and do not affect the live site. This is a great way to learn HTML and CSS as well as a great tool for designing new sites and modifying existing sites.
To turn on Firebug, look for the small lightning bug in your browser under the address bar. That will open up a window under the website content; you can also open it as a separate window.
From here, Nick demonstrated how to use Firebug, which is difficult to capture in a blog post. Until we can get his video uploaded, here are some links to tutorials you can check out:
- StudioPress’ tutorial: http://www.studiopress.com/tips/using-firebug
- Chris Coyier’s CSS-Tricks screencast: http://css-tricks.com/video-screencasts/15-introduction-to-firebug/
- The Firebug Tutorial Series: http://www.youtube.com/watch?v=tdIk2PztcL0
The Layout tab will show you how much space a selected element takes up on the page.