ThinkLemon

I think there used to be a tagline about (tag)soup here… anyway…

Jump to the navigation
Jump to the content

Also visit:

Visualising the DOM for fun

The Document Object Model, or DOM as it is known better, is usually visualised as a tree. For instance with the Internet Explorer Developer Toolbar or DOM Inspector / Firebug for Firefox. But there are other more fun ways, like Aharef did.

Thinklemon DOM graph

The above graph is a funky representation of ‘all’ nodes in the HTML of the ThinkLemon homepage. The blue dots represent links (<a>), the orange ones block-level elements like <p> & <blockquote>, the grey ones probably are list-items (<li>), etc. The grey blob at the lower-left presumably is the meta-info in the <head>, whereas the grey/blue extensions to the right and top is all the navigational stuff found at the bottom of these pages.

See Aharef: Websites as graphs for a further explanation and a chance to play with it yourself. And when you’re fed up you can also take a look at that other visualiser, GoogleBrowser.

Via: Fredscapes

This entry was posted on Sunday, May 28th, 2006 at 3:14 pm and is filed under Internet, Utilities, WebDev, Development, ThinkLemon, General. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.