html tag visualizer

February 11th, 2009 · No Comments

I stumbled upon a really cool website which will visualize any webpage into a graph.

It’s called Webpages as Graphs and it’s wicked cool.

From their page:

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

Here’s You can see the main site content on the left, and my sidebar with the links on all the blue explosions on the right.


And here’s my Project 365 site, at  I think it looks like a large firework.


My brother Ryan has a site at, and the intro page is just a picture and some text.  You can see the simplicity in the HTML structure in the visualization of his site.


My friend Ryan has an even simpler site at


When you put popular sites in, you can see the differences between a site with a simpler interface like Google verses a news site like CNN.





What a cool tool!  I, like many people I presume, have a facination with the visualization of data.  There was a book that my colleague told me about which was full of all sorts of graphs and charts and the interesting stories behind them.  I’m blanking on the name of it, but if anyone knows of this book please let me know.

Also, if you have any sites which look really cool definately share them here.

→ No CommentsCategories: culture | Tags: | 1,094 views

0 responses so far ↓

  • No comments yet. Go ahead and add one maybe why not?

Leave a Comment