HTML5 Page Structure

HTML5 Page Structure

The HTML5 specification has added quite a few interesting and useful tags for structuring your markup. For a majority of everyday uses, these tags will replace many of our typical div entries from our code. more browsers are getting compatible with it and with the iPhone choosing this as it’s main multimedia language.

<!DOCTYPE HTML> <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Title</title>
    </head>
    <body>
        <header>
            <nav>
                <ul>
                    <li>Home</li>
                    <li>Contact</li>
                </ul>
            </nav>
        </header>
        <section>
            <article>
                <header>
                    <h2>H2 Title</h2>
                    <p>Posted on <time datetime="2012-07-28T13:00:24+01:00">July 28th 2012</time></p>
                </header>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
            </article>
            <article>
                <header>
                    <h2>Article</h2>
                    <p>Posted on <time datetime="2012-07-26T13:00:24+01:00">July 26th 2012</time></p>
                </header>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
            </article>
        </section>
        <aside>
            <h2>Contact Us</h2>
            <p>It is a long established fact that a reader will be distracted</p>
        </aside>
        <footer>
            <p>Copyright © 2011 - Zymphonies.com. All rights reserved.</p>
        </footer>
    </body>
</html>
Tag: