ptg16476052374 LESSON 13: Structuring a Page with HTML5
<div id="footer">
Copyright 2015-2016
</div>
</body>
</html>As you can see, the page is constructed using <div> tags that represent typical sections
included in a web page. I chose the classes and IDs for this page to correspond exactly to
the equivalent tags in HTML5. Using the new elements, here’s how the same page would
be constructed:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>A Typical Website </title>
</h ead>
<body>
<header>
<h1>A Typical Website </h1>
<nav id="topmenu">
<ul>
<li><a href="/">Home</a></li>
<li><a href="/products.html">Products</a></li>
<li><a href="/about.html">About</a></li>
<li><a href="/contact.html">Contact</a></li>
</ul>
</nav>
</header><article>
<h2>A Headline</h2>
<p>The text of an article.</p>
<aside>
<p>This is an aside.</p>
</aside>
<p>More article text.</p>
</article><footer>
Copyright 2015-2016
</footer>
</body>
</html>As you can see, this page has no <div> tags. Instead, I’ve used the new top-level ele-
ments in HTML5 to represent the structure of the page. One of the key design goals of
HTML5 was to make HTML better represent the structure of web pages the way devel-
opers are actually building them.