HTML Guide

The <footer> element represents a footer for its nearest sectioning content, and has an implicit role of contentinfo, so specifying this role is redundant.

The following example marks a <div> as a footer specifying its role:

<div role="contentinfo">
  <h2>Footer</h2>
  <!-- footer content -->
</div>

Using the <footer> element instead is recommended:

<footer>
  <h2>Footer</h2>
  <!-- footer content -->
</footer>

A <header> section can’t include any <footer> section inside.

The footer element represents a footer for its nearest ancestor sectioning content or sectioning root element. A footer typically contains information about its section such as who wrote it, links to related documents, copyright data, and the like.

Footers don’t necessarily have to appear at the end of a section, though they usually do. In any case, they can’t go nested inside a <header> section.