The Art of DOM

by Jon Henshaw

Most of the people who read this entry will have no idea what I’m about to say. With that preface, I present to you the HTML DOM visualization of FamilyResource.com. HTML is the language Web pages are written in and the DOM is the document object model. In this case the DOM for HTML consists of objects like tables, anchors and images. Now that I’ve completely lost you, enjoy the art — I mean, the HTML DOM visualization of this website’s home page.

What do the colors mean?

  • 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

fr-dom.png

You can create your own HTML DOM visualization at the Websites as Graphs Web page.

Share and Enjoy:These icons link to social bookmarking sites where readers can share and discover new web pages.
  • blinkbits
  • BlinkList
  • blogmarks
  • co.mments
  • connotea
  • del.icio.us
  • De.lirio.us
  • digg
  • Fark
  • feedmelinks
  • Furl
  • LinkaGoGo
  • Ma.gnolia
  • NewsVine
  • Netvouz
  • RawSugar
  • Reddit
  • scuttle
  • Shadows
  • Simpy
  • Smarking
  • Spurl
  • TailRank
  • Wists
  • YahooMyWeb

This entry was posted on Sunday, June 4th, 2006 at 3:35 pm and is filed under Lifestyles, Arts and Crafts. 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.

WordPress database error: [Table './family_wordpress/wp_comments' is marked as crashed and should be repaired]
SELECT * FROM wp_comments WHERE comment_post_ID = '435' AND comment_approved = '1' ORDER BY comment_date

Leave a Reply



Google