Displaying html structure

Two days ago a read a "post on Angie McKaigs Blog":http://www.angiemckaig.com/archives/2004/10/24/assortedsweets20041024/index.html referring to the "3d CSS Zen Garden":http://www.stuffandnonsense.co.uk/archives/3dcsszen_garden.html of Malarkey. She also said:

bq. What would be really cool is if someone could make a script that would do this with any web page, complete with the pretty graphics.

Which i did, but without the pretty graphics, since that's just css and code fiddling. A small difference with Malarkey's picture is that i show all elements, so if you have multiple tags with the same (or no) class, i show them all. Also, it has some other shortcomings which i intend to fix in a next version.

So here is the "script":http://www.markijbema.nl/static/htmlstructure/showstructure.cgi , here is the "highlighted source":http://www.markijbema.nl/static/htmlstructure/code.html and here is the "downloadable source":http://www.markijbema.nl/static/htmlstructure/show_structure.pl.txt.

Your mileage with the results may vary. How usable the rendering is really depends on what elements a site uses for the structure. A few examples.

• "CSS Zen Garden":http://www.markijbema.nl/static/htmlstructure/showstructure.cgi?url=http%3A%2F%2Fwww.csszengarden.com%2Fzengarden-sample.html
• "Anne van Kesteren":http://www.markijbema.nl/static/htmlstructure/showstructure.cgi?url=http%3A%2F%2Fwww.annevankesteren.nl%2F

The second isn't really helpful of course. So i'll make it possible to define what to display as block, what as semiblock, etc in the form in the next version.

Update: What i forgot to mention is that it only works with XHTML