Showing posts with label aside. Show all posts
Showing posts with label aside. Show all posts

Monday, 15 November 2010

HTML5 tags I am currently using

Why would I write this article?
It's just to give you a flavour of the HTML5 features I have found to be reliable and how I use them. There is a simple template below, but essentially they are <header></header>, <footer></footer>, <section></section>, <article> </article> and <aside></aside>.
Of course, you may be thinking, he's not using proper HTML5 html and meta tags. That's because the new ones are not currently accepted by the W3C Validators.

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>HTML5 example</title>
<style type="text/css">
body
{
 font-family:Sans-serif;
}
#mainPage, header, footer
{
 margin:0 auto;
 width:30.8em;
 *width:30em;
}
#leftContent
{
 float:left;
}
#rightContent
{
 float:right;
}
footer
{
 clear:both;
}
</style>
<!--[if IE]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]-->
</head>
<body>
<header>
    <h1>My header</h1>
</header>
<section id="mainPage">
    <section id="leftContent">
        <article>Article 1</article>
        <article>Article 1</article>
    </section>
<aside id="rightContent">Content on the aside</aside>
</section>
<footer>Footer</footer>
</body>
</html>