Skip to main content

Semantic Page Shell Pattern

<body>
  <header>...</header>
  <nav aria-label="Primary">...</nav>
  <main>...</main>
  <footer>...</footer>
</body>

Why It Works​

  • Clear landmarks
  • Cleaner accessibility story
  • Better maintainability than generic wrapper stacks

What's Next​