HTML5: Your visual blueprint™ for designing rich web pages and applications

DECLARE HEADER AND FOOTER LAYOUT ELEMENTS

The header and footer elements are new in the HTML5 semantic layout design, although their idea has been around for quite some time. Previously, a simple <div> tag, or even a table, would create headers and footers. These elements are purely optional, but they help you understand your page layout at a glance:

<body>
   <header>
    Body header content
  </header>
  Main body content
  <footer>
    Body footer content
  </footer>
</body>

Use <header> and <footer> within any semantic layout element. For example, you could use the <section> tag, described later in this chapter in “Declare Section and Article Layout Elements,” and assign the section a header or footer, if you so choose.

The header and footer elements will ...