Navigation elements are consistent across pages

Navigation that changes location or order between pages violates users' mental model of the site, forcing screen reader users and keyboard navigators to re-learn the layout on every page. WCAG 2.2 SC 3.2.3 (Consistent Navigation) is a Level AA requirement. Users with cognitive disabilities are disproportionately affected — unpredictable navigation increases error rates and abandonment. For any product requiring repeat visits, inconsistent navigation erodes trust.

Render your navigation from a single shared component in the root layout so it cannot diverge between pages.

// app/layout.tsx — navigation is defined once, appears everywhere
export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        <SiteHeader /> {/* Single source of truth for nav */}
        <main>{children}</main>
        <SiteFooter />
      </body>
    </html>
  )
}

If some pages need additional navigation (e.g., a docs sidebar), add it as a supplemental landmark, never in place of the primary nav. Audit every distinct layout file to confirm the primary nav component and its link order are identical.