Yugien
Theme

footer

The HTML <footer> element marks closing information for a page, article, section, or other content block. It often contains authorship, copyright, contact, or related links.

What you will learn

Site-wide footer

<footer>
  <p>&copy; 2026 Example Company</p>
  <nav aria-label="Footer">
    <a href="/contact">Contact</a>
    <a href="/privacy">Privacy</a>
  </nav>
</footer>

A page can have one site-wide footer near the end of the body. Give a navigation group an accessible label when its purpose could be confused with another navigation area.

Article or section footer

<article>
  <h2>An article</h2>
  <p>Article content...</p>
  <footer>Written by Alex ยท Updated 2026-09-05</footer>
</article>

A footer can belong to the nearest sectioning content, such as an article. Use it for information about that content, not simply because an element happens to appear at the bottom of the screen.

Do not use it for layout alone

If a box only needs styling or positioning and has no closing-content meaning, use a class on an appropriate element or a div. Choose footer for its semantics, then style it with CSS.

Related pages