Website as graphs

I just found out about this cool way to visualize websites. I must say that not only the end result, but also the way it builds the image is pretty fun to watch. What is does really is translate the tags of the HTML into colored dots. The colors are used for the tags in the following way:

  • 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 the result for 'Cross The Breeze, you can find more results at the website of the guy who created it or at Flickr (tagged: websitesasgraphs). Nifty results for instance for BoingBoing.net, almost fireworks.

HTMLGraph.JPG
Or just try it for yourself here.

[Via Google Blogoscoped]

Published by

Kris Hoet

My name is Kris Hoet and this is my blog dedicated to subjects such as advertising, gadgets, interactive, internet, movies, games … and whatever things that interest me. More at https://crossthebreeze.com/about-cross-the-breeze/

Leave a Comment

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s