Webpages as Graphs
Here’s an applet that traverses the html of a web page and turns it into a nifty graphic visualisation. Great for making the underlying structure clear. (Developed by Ahare)
The great thing about this is the colour coding for the pages.
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’m not convinced that it is the most useful tool, although it does tell us the something about the amount of tables, links etc on a page, the tree like visualisation doesn’t best make comparison between quantity of items clear. A bar chart of each element would be better for that. Fun nonetheless.
Here is a graph of the web page, sarahwaterson.net
graph of the index page.
Here is a graph of Amazon:
graph of amazon's frontpage
