HTML DOM Visualizer

May 28th, 2006

HTML DOM Visualizer allows you to visualize the DOM of your website as a set of linked coloured nodes (example for cow.neondragon.net).

HTML Dom for cow.neondragon.net

The black node is the root <html> node. Usually you’ll have two nodes branching off from it (head and body). Each element is represented by a different colour:

blue: for links (the A tag)
red: for tables (TABLE, TR and TD tags)
green: for the DIV tag
violet: for images (the IMG tag)
yellow: for forms (FORM, INPUT, TEXTAREA, SELECT and OPTION tags)
orange: for linebreaks and blockquotes (BR, P, and BLOCKQUOTE tags)
black: the HTML tag, the root node
gray: all other tags 

I don’t think this has any practical use but it’s pretty cool. You can get the Java Source Code from here

Related Posts

  1. Multi Cell Forms
  2. HTML/Javascript Levels
  3. CSS/Accessibility Levels
  4. XPath Checker (Microsummaries)
  5. Steve Jobs is not happy!

Trackback URI | Comments RSS

Leave a Reply