Question

Even the new HTML5 tags aren’t enough to describe structures without falling back to divs. What’s stopping me from changing:

<div class="post">
    <div class="userinfo">
        <span class="name">Casey</span>
        <img class="avatar" src="..." />
    </div>
    <div class="body">
        <p>blah blah blah</p>
        <p>blah blah blah</p>
        <p>blah blah blah</p>
    </div>
</div>

into something like:

<post>
    <userinfo>
        <name>Casey</name>
        <img class="avatar" src="..." />
    </userinfo>
    <pbody>
        <p>blah blah blah</p>
        <p>blah blah blah</p>
        <p>blah blah blah</p>
    </pbody>
</post>

To me, the second example is a lot cleaner. Is there anything (i.e., browser support) stopping me from doing this?

(I realize what it is is, essentially, XML, but in that case, the question becomes, “what does browser support look like for rendering XML web pages?”)

Answer 1

One reason is that Internet Explorer (and earlier versions of Firefox) don’t have a fallback for tags that are not defined and wind up ignoring them for both styling and nesting. Without a shiv, your site will break horribly in those browsers.