One good thing about HTML5 is that it is 100% compatible with code written for prior versions of HTML. Thus a document that was written for HTML4.1 can be converted to HTML5 without fear of breaking anything.
The problem comes after you have written your beautiful semantic code only to find that it doesn't render properly in older versions of some browsers. This is because the new elements (header, aside, section, etc.) are not understood in the prior specifications and therefore are not rendered.
No fear, there is a quick fix..
By adding the following conditional script in the head section of your HTML document, non-compliant browsers will create 'dummy' elements to make the CSS styling possible.
<!-- JavaScript that creates dummy elements for each type of html5 tag. This ensures they are rendered properly in IE8 and earlier -->
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
This method is good, but is also dependent on Google servers, which we all know go down from time to time. The below code is a manual way of doing the same thing, using pure CSS.
/* browser support for html5 elements */
article,
aside,
hgroup,
header,
footer,
figure,
figcaption,
nav,
section {
display: block;
}
There are several libraries that help accomplish this same thing. Normalize.js and Modernizr.js to name a couple. Modernizr is particularly useful when you need to perform some feature detection tests.