Firefox Web Development
Using the Web Developer extension to develop and debug web sites
Chris Pederick
Webmaster Jam Session 2008
This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
1

What is Web Developer?
An extension for Firefox, Flock and Seamonkey that adds a menu and a toolbar to
the browser with various web developer tools.
• Disable • Images
• Cookies • JavaScript
• CSS • Validation
• Forms
This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
2

Information
• View CSS
• View JavaScript
• Firebug
• View Image Information
• View Color Information
• View Document Size
This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
3

Debug
• View Style Information
• Display Element Information
• Display Id & Class Details
• Show Hidden Elements
• Display Ruler
• Display Line Guides
This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
4

Edit
• Edit CSS
• Search
• Position
• Stick
• Edit HTML
• View Cookie Information
This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
5

Less Well-Known Features
• Display Topographic Information
• Validate Local CSS/HTML
• Clear HTTP Authentication
• View Generated Source
• View Document Outline
• Persist Features
This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
6