HTML Markup Map

HTML Markup Map 1This post is stolen from Sir Joel. Check this out, slap in your web page and it’ll make a graph of your site’s markup. The two generated images included in this post are from a website that I’m working on. It’s still bare so the images are very few. I placed all my effort on not using tables. More samples and explanations here.

HTML Markup Map 2I was supposed to post more sample graphs from popular sites with good and bad markup but the two bad sites that I tested was messed up it caused the browser to crash. They’re Inq7, Manila Bulletin and Filmcrowd. Filmcrowd uses a tableless layout (for the main parts) but there are parts that still used tables.

Shifting to tableless layouts isn’t that hard. It’s just a matter of getting used to.