Firefox Web Development

Using the Web Developer extension to develop and debug web sites.

Transcript

1. Firefox Web Development Chris Pederick Using the Web Developer extension to develop and debug web sites 1 Webmaster Jam Session 2008 This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
2. What is Web Developer? • Disable • Cookies • CSS • Forms • Images • JavaScript • Validation 2 An extension for Firefox, Flock and Seamonkey that adds a menu and a toolbar to the browser with various web developer tools. This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
3. Information • View CSS • View JavaScript • Firebug • View Image Information • View Color Information • View Document Size 3 This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
4. Debug • View Style Information • Display Element Information • Display Id & Class Details • Show Hidden Elements • Display Ruler • Display Line Guides 4 This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
5. Edit • Edit CSS • Search • Position • Stick • Edit HTML • View Cookie Information 5 This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License
6. Less Well-Known Features • Display Topographic Information • Validate Local CSS/HTML • Clear HTTP Authentication • View Generated Source • View Document Outline • Persist Features 6 This presentation is distributed under the terms of the Creative Commons Attribution-Noncommercial-Share Alike 3.0 License