HTML5 Basic Semantic Structure

This is a basic semantic structure of HTML5.

HTML5

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title></title>
        <!--[if lt IE 9]>
        	<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <link href="styles/screen.css" rel="stylesheet" type="text/css">
    </head>

    <body>
        <div class="wrapper">
            <header>
            </header>

            <aside>
                <nav>
                    <ul>
                    	<li><a href="#">Home</a></li>
                    </ul>
                </nav>
            </aside>

            <article class="content">
            </article>

            <footer>
            </footer>
        </div><!-- END .wrapper -->
    </body>
</html>

HTML5 CSS

/*html5 display rule*/
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, nav, menu, nav, section, summary {
	display: block;
}

Leave a Reply