Lesson Tip: Use the Firefox Developer Plugins
These will be some of the most invaluable extension you will use in Firefox when developing your website. What the tools offer are a live preview of all the changes that you make to your style sheets. It also allows you to view the attributes you assign to the style sheet, where they are used in the page and are seperated by distinctive colours to help ease understand (id’s are green, class’s are red).
With the tools installed, it will save you having to use and install 10 different other tools, such as Topstyle (yuck!). It offers a plethora of other otipn including drop down links to validation pages, a one click view source button, the ability to outline any element within a page be it tables, block level element, links with attributes etc. But there’s more!
You can also view the block size of the elements within your page, allowing you to better judge the margins, length, width and height of your page and adjusting it precisely – no more guessing how much more you need to add or subtract. View speed reports witha quick links, display image paths, dimensions find broken images within a page.
These tools are just a Godsend for designing and if you use FF I certainly recommend you use it.
The main page can be found here:
The developer plugin can be found here:
The CSS editor can be found here:
- The topic ‘Lesson Tip: Use the Firefox Developer Plugins’ is closed to new replies.