HTML and CSS Reference
These can be perfectly valid reasons for having a web document that doesn't validate.
And while it may be controversial whether you should include said hack or CSS
technique, intentionally including a piece of invalid code can still be a part of good web
Validation should be seen as one of many tools in your web development toolbox, and
not the final say as to whether your page is coded correctly. That said, validating your
code is a great way to find unintentional errors in coding, and, all things being equal,
a valid HTML5 document is generally better than an invalid one.
2.8 Mapping HTML5 Elements to ID and Class Names
You aren't ready for HTML5 yet, but you want to code your site so that upgrading to
HTML5 in the future will be painless.
There may be legitimate reasons why you don't want to take the HTML5 plunge yet.
Perhaps you worry about browser support. Perhaps you like to keep things simple, and
you don't want to implement the myriad scripts and tweaks necessary to make an
HTML5 site compatible with all modern browsers.
However, you still appreciate the semantic markup of HTML5, and you'd like to code
your site so that, when all modern browsers catch up, your XHTML/HTML4 code will
be as ready as possible for the transition to HTML5.
Fortunately, it's quite simple to mirror the semantic structure of an HTML5 site using
div s labeled with HTML5-ish id and class names. Let's take a look at how this can be
done. We're going to create a simple blog front page, as shown in Figure 2-10 .
Looking at this site, we can pick out a few key structural elements:
• A body header, which contains the blog title and a navigation bar
• A section that contains two blog posts
• A footer
If we were coding this site in HTML5, we'd mark this up with various header and
footer tags, a nav tag, and article tags. However, as we're going to mark it up with
XHTML/HTML4 instead, we're going to mirror the structure and naming conventions
of HTML5 as closely as possible by using div s with id and class names.