Artifacting DOM Tree

Over at this site you can get a cool graphic representation of your website. Basically, this Java Applet lets you see the HTML tag hierarchy that your site uses to lay out your content. Below is what the DOM tree at Artifacting looks like. What does that mean for people like me and you? Unique, cool, tropical flower-like pictures, I guess. This Flickr set has graphic site-maps for a bunch of other blogs.

Graphic Site Map for Artifacting
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

6 thoughts on “Artifacting DOM Tree”

  1. Pingback: The Web Pen Blog

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top