Skip to content
Pandus

Recommended practice Priority: Moderate

The "Skip to content" link does not work

The page has a skip link, but the place it points to does not exist or cannot receive focus. This is a recommended practice beyond the WCAG 2.2 AA level.

This text was translated automatically and has not been reviewed by a native speaker yet.

Why it matters to your customers

Keyboard users press "Skip to content" expecting to jump past the menu, but nothing happens or focus goes back to the top. They then have to Tab through the whole header and menu on every page, which makes browsing and checkout slow and tiring.

Who is affected

  • keyboard users
  • screen reader users
  • people with motor disabilities

How to fix it

Make sure the skip link's href (for example #MainContent) matches the id of an element that exists on every page, usually the <main> element. If that target is not focusable by default, add tabindex="-1" to it. Test it: load the page, press Tab once, then Enter; the next Tab should land inside the main content.

On Shopify

Most themes put the skip link in layout/theme.liquid, pointing to the id of the main content. If a custom template or section changed or removed that id, restore it in the Liquid code.

On Shoptet (CZ)

Decided by the template. If you added your own skip link through custom code, check that its target exists; otherwise ask Shoptet or a partner.

On PrestaShop

Check the theme's layout .tpl files: the skip link's target id must match an element present on every page type, including product and cart pages.

On WooCommerce

The skip link usually comes from the theme's header template and its target from the content template. Page builders and blank templates often drop the target; add the matching id in the child theme or in the builder's settings.

Standards

Not a WCAG success criterion: a recommended practice that makes the site easier to use.

Automated check: axe-core rule skip-link. dequeuniversity.com, github.com, www.w3.org

All rules we check