Geek Toy of the Week

Websites as Graphs

May 28, 2006

Ever wondered how clean the structure of your website was?  Ever wanted to know how old-fashioned or hip-and-2.0 your markup is?  Need a new reason to love Google’s home page even more?  Well, now you can see your website’s markup unfold before your eyes with the Websites as Graphs HTML DOM Visualizer Applet.  Simply enter a URL and a nucleotide-like graph unfurls, coming to rest at its most expansive and beautiful.

How does DT’s index page stack up?  Well, the structure is mostly broken down in div’s, as you can see from the green dots.  There are numerous orange dots for the paragraph and line breaks, blue dots galore for our many links, a few localized yellow dots for the search form, and gray dots everywhere due to the high quantity of list, heading, and other “other” tags.  Oh, and a couple red dots for the main table in the middle.

Be sure to visit Aharef: Websites as graphs for the legend to the dots (blue means links, for example, while green shows <div> tags), and to see several other sites visualized.