Where's your focus?

Hi again,

If you’re testing your store with a keyboard (and you know you should be) - what happens when you add a product to your cart?

On many stores, especially Shopify stores, you’ll choose your options - size, colour, quantity - click Add to cart, and a drawer slides in from the side, showing your order total, a checkout button, maybe free-shipping.

Visually, that’s where your attention goes.
But is your keyboard focus there too?

In every store I’ve reviewed this month, the answer was no.

What actually happens?

The cart opens - and visually you’re there, but the keyboard user isn’t.

Instead of moving through the cart, the focus stays on the product page, behind the cart - continuing through the normal tab order: size guide, FAQs, returns.

And not where they expected to be.

They can’t reach the checkout button, can’t close the cart, and might not even be aware that it’s open. This small disconnect breaks the flow, adds frustration, and chips away at trust.

📹 Watch this in action: Comparing two user experiences.

What should happen instead?

The Web Content Accessibility Guidelines are clear: focus should move to where the user expects it to be.

In this case, that’s the cart drawer.

When the cart opens, the keyboard focus should move inside it - ideally on the heading - and stay there until it’s closed.
When the user presses Escape or clicks away, focus should return neatly to the “Add to cart” button they started from.

That is what “fixed” looks like. And it’s an easy win.

A single, seamless movement that makes every customer - visual, non-visual, mouse, or keyboard - feel like the site is working with them, not against them.

Because accessibility isn’t about adding features.

It’s about keeping focus - visual and otherwise - exactly where your customers are.