html5: basic structure

by prettyscripts on 2011-09-01 11:56

htmlhtml5

html5 introduces new elements to clearly defines structure of a page. html5 is not fully ready as the specification is still work-in-progress and not fully supported by most browsers. however many developers have already developed websites with html5 / css3.

it's time to start working on it.

here's a basic html5 doc template.

Code:

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<html lang="en">  
<head>
    <meta charset="utf-8" />
    <title>...</title>
    <meta name="description" content="...">
    <meta name="author" content="...">
    <link ref="stylesheet" type="text/css" href="style.css?v=1.0" />
    <!-- mobile viewport optimisation -->
    <meta name="viewport" content="width=device-width,initial-scale=1">
 
    <!--[if lt IE 9]>  
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>  
    <![endif]-->  </head>
<body>
    <header>...</header>
    <nav>
        <ul>...</ul>
    </nav>
    <article>
        <section>
        </section>
    </article>
    <footer>...</footer>
</body>
</html>