What's wrong
Without a skip link, keyboard users must press Tab dozens of times across header menus before reaching the page content.
Who it affects
People with motor disabilities or repetitive strain injury navigating via keyboard or switch controls.
How to fix on Shopify
Place `<a href="#MainContent" class="skip-to-content-link visually-hidden-focusable">Skip to content</a>` at the top of `layout/theme.liquid`.
Code example
Problematic Code
LIQUID
<!-- No skip link before header -->
<header class="header">...</header>
<main id="MainContent">...</main>Recommended Accessible Code
LIQUID
<a href="#MainContent" class="skip-to-content-link visually-hidden-focusable">
{{ 'accessibility.skip_to_text' | t }}
</a>
<header class="header">...</header>
<main id="MainContent" tabindex="-1">...</main>How to check your fix
Reload the page and press the Tab key once. The 'Skip to content' link must become visible with a clear focus ring, and pressing Enter must move focus directly to the main element.