20. <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 example with new elements and WAI-ARIA landmark roles - robertnyman.com</title>
<link rel="stylesheet" href="css/base.css" type="text/css" media="screen">
<!--[if lte IE 8]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body id="index-page">
<div id="container">
<header role="banner">
<h1>HTML5 example <a href="http://robertnyman.com/html5">- To: Information and samples for HTML5 and related APIs</a></h1>
<p>This page has valid simple HTML5 markup with new elements complemented with WAI-ARIA landmark roles for accessibility</p>
</header>
<div id="demo-main" role="main">
<article id="demo-main-content">
<header>
<hgroup>
<h2>A title</h2>
<h3>Subtitle to the above title</h3>
</hgroup>
</header>
<section>
<p>Some content, created <time datetime="2009-10-14">October 14th 2009</time></p>
</section>
<section>
<p>Some more content - I guess you get the drift by now</p>
</section>
</article>
<aside id="demo-aside-content" role="complementary">
This is just a demo page to see HTML5 markup and WAI-ARIA landmark roles in action in a simple context
</aside>
</div>
<footer id="page-footer" role="contentinfo">
Created by <a href="http://robertnyman.com/">Robert Nyman</a>
</footer>
</div>
</body>
</html>
21. <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 example with new elements and WAI-ARIA landmark
roles - robertnyman.com</title>
<link rel="stylesheet" href="css/base.css" type="text/css"
media="screen">
<!--[if lte IE 8]>
<script src="http://html5shiv.googlecode.com/svn/trunk/
html5.js"></script>
<![endif]-->
</head>
22. <header role="banner">
<h1>HTML5 example <a href="http://robertnyman.com/html5">-
To: Information and samples for HTML5 and related APIs</a></h1>
<p>This page has valid simple HTML5 markup with new elements
complemented with WAI-ARIA landmark roles for accessibility</p>
</header>
23. <div id="demo-main" role="main">
<article id="demo-main-content">
<header>
<hgroup>
<h2>A title</h2>
<h3>Subtitle to the above title</h3>
</hgroup>
</header>
<section>
<p>Some content, created <time datetime="2009-10-14">October
14th 2009</time></p>
</section>
<section>
<p>Some more content - I guess you get the drift by now</p>
</section>
</article>
<aside id="demo-aside-content" role="complementary">
This is just a demo page to see HTML5 markup and WAI-ARIA landmark
roles in action in a simple context
</aside>
</div>