How do you test keyboard navigation on a Shopify store?

Unplug your mouse and tab through the whole purchase path, from the homepage to order confirmation. If you can reach every interactive element, always see where focus is, and never get trapped, the keyboard basics are covered. Most stores fail at least one of the three.

The tab-through test

Start on the homepage and press Tab repeatedly. Every link, button, menu item, and form field should receive focus in a logical order, roughly top to bottom and left to right. Watch for elements that get skipped: custom-built quick-view buttons, social icons rendered as divs, and carousel controls are the usual suspects. If you can see it and click it with a mouse, you should be able to reach it with Tab.

Shift+Tab should walk you back the same way. If focus jumps somewhere unexpected on the way back, the tab order has been tampered with, usually by a positive tabindex value somewhere in the theme or an app embed.

Focus visibility

Reaching an element is only half the test. You need to see where you are. Many themes remove the default focus outline for aesthetic reasons and replace it with nothing, which leaves keyboard users navigating blind. As you tab, confirm that every focused element shows a visible indicator. A custom focus style is fine and often looks better than the browser default, but removing it outright is one of the most common WCAG failures on Shopify stores.

Skip links and traps

Two things separate an adequate store from a good one. First, a skip link: a link at the very top of the page that jumps past the header navigation to the main content. Without it, keyboard users tab through dozens of nav links on every single page. Second, no traps: cart drawers, search overlays, size-guide modals, and mobile menus must let you tab in and then tab or Escape back out. Test every overlay by opening it, tabbing through to the end, and confirming focus does not escape behind the overlay or get stuck inside it after closing.

What to record

Write down each failure with the page, the element, and what happened: skipped, invisible focus, or trapped. That list is your remediation ticket queue, and it doubles as evidence of a systematic review if a demand letter ever arrives. Re-run the same test after theme updates and app installs, because both routinely reintroduce the exact failures you just fixed.