Semantic & Interactive

<header> & <footer>

Page or section header and footer landmarks.

1Landmark Regions

<header> and <footer> can wrap the whole page or a single article/section. Screen readers expose them as landmarks for quick navigation.

Example Code

<header>
  <h1>Acme Blog</h1>
  <nav>...</nav>
</header>

<article>
  <header><h2>Post title</h2></header>
  <p>Body...</p>
  <footer>Posted by Sam</footer>
</article>

<footer>
  <p>© 2026 Acme</p>
</footer>

Finished reading?

Mark this topic as complete to track progress.

HTML Form Validation

Next Topic

<main> Tag