Problem
The landing page (app/(root)/page.tsx) has no "Skip to content" link. Keyboard-only users must tab through every navigation item before reaching the main content, which is a significant usability barrier.
This violates WCAG 2.1 Success Criterion 2.4.1 (Bypass Blocks), a Level A requirement.
Proposed Fix
Add a visually-hidden skip link as the very first focusable element in the page:
<a
href="#main-content"
className="sr-only focus:not-sr-only focus:fixed focus:top-4 focus:left-4 focus:z-50 focus:px-4 focus:py-2 focus:bg-background focus:text-foreground focus:rounded-md"
>
Skip to main content
</a>
<main id="main-content" tabIndex={-1}>
{/* page content */}
</main>
Problem
The landing page (
app/(root)/page.tsx) has no "Skip to content" link. Keyboard-only users must tab through every navigation item before reaching the main content, which is a significant usability barrier.This violates WCAG 2.1 Success Criterion 2.4.1 (Bypass Blocks), a Level A requirement.
Proposed Fix
Add a visually-hidden skip link as the very first focusable element in the page: