Saturday, June 23, 2007

Blog Toolbox 2 - Web Developer Toolbar

If you are a beginner with html and css styling, want to expand existing skills or learn new techniques, the Web Developer Toolbar is a valuable tool. You are able to view and work with the source code of sites that have elements you are interested in, and work with the generated content of xml or database created content.

I used it extensively when I was learning web building and still use it regularly for such things as working on the styling of my beta blogger site.

Main Features

For editing
  • Edit HTML - opens a small window at the bottom of your screen for you to edit the html while viewing the results in the top window. You can then save the html.
  • View generated Source - opens up the page source code in a new window/tab. You can copy all or part of the code and paste it into another application to edit it or to practise styling before editing your css template. This is particularly useful for template based applications such as blog platforms or CMS programs where the html output is generated by xml or databases.
  • View Source With - allows you to specify a program you wish to edit a page with - eg notepad, dreamweaver, photoshop.
  • View and edit CSS and Style Information
  • View JavaScript.
Image tools
  • Image Information - displays all the images and image details on a separate page/ta Outline images with empty alt attributes
  • Display Image File Sizes and image dimensions
Other Page information
  • View Color Information Display Element Information - a nifty feature allowing you to highlight parts of the page and find out various information such as ID, class, CSS inheritance and color.
  • View Document Size, Meta Tag Information, Link Information, Page Alt Attributes
  • Outline External Links
  • Display Id & Class Details
  • Display Block Size
Utilities
  • Magnifier
  • Ruler
  • Display page at various window sizes - eg 800x600, 1024x768 etc
  • Validate HTML, CSS, Links, Feeds

More information and downloads:

tag , , alexa

No comments:

Saturday, June 23, 2007

Blog Toolbox 2 - Web Developer Toolbar

If you are a beginner with html and css styling, want to expand existing skills or learn new techniques, the Web Developer Toolbar is a valuable tool. You are able to view and work with the source code of sites that have elements you are interested in, and work with the generated content of xml or database created content.

I used it extensively when I was learning web building and still use it regularly for such things as working on the styling of my beta blogger site.

Main Features

For editing
  • Edit HTML - opens a small window at the bottom of your screen for you to edit the html while viewing the results in the top window. You can then save the html.
  • View generated Source - opens up the page source code in a new window/tab. You can copy all or part of the code and paste it into another application to edit it or to practise styling before editing your css template. This is particularly useful for template based applications such as blog platforms or CMS programs where the html output is generated by xml or databases.
  • View Source With - allows you to specify a program you wish to edit a page with - eg notepad, dreamweaver, photoshop.
  • View and edit CSS and Style Information
  • View JavaScript.
Image tools
  • Image Information - displays all the images and image details on a separate page/ta Outline images with empty alt attributes
  • Display Image File Sizes and image dimensions
Other Page information
  • View Color Information Display Element Information - a nifty feature allowing you to highlight parts of the page and find out various information such as ID, class, CSS inheritance and color.
  • View Document Size, Meta Tag Information, Link Information, Page Alt Attributes
  • Outline External Links
  • Display Id & Class Details
  • Display Block Size
Utilities
  • Magnifier
  • Ruler
  • Display page at various window sizes - eg 800x600, 1024x768 etc
  • Validate HTML, CSS, Links, Feeds

More information and downloads:

tag , , alexa

No comments: