Keep keyboard order aligned with card reading order

What to change

Ask for a logical sequence that remains understandable as the same cards change between desktop columns and a mobile list.

A worked example

Illustrative example

A two-column service collection is navigated across each row, matching its visible reading order. On a phone, the same sequence becomes a straightforward vertical list.

How to check the result

Accept when the order is consistent and meaningful at each layout, including after a return from a linked page.

A mistake to avoid

A desktop screenshot cannot reveal the underlying focus sequence or its behaviour when the layout collapses.

Your action checklist

Use these checks to prepare a discussion with your team or supplier. Tick a check when you have recorded the decision or evidence, rather than when a feature has simply been promised.

Decisions to recordSelect a page with several actionable cards and tab through them slowly. Compare the focus sequence with the order in which their headings are read.Resize the window and repeat. Ask the supplier to review any visual reordering that makes keyboard movement appear to jump backwards or skip a section.Open a card and return to the list. Confirm focus resumes at a useful place so the visitor can proceed to the next item.

Evidence, open questions and decisionsNext action and responsible role

Entries stay in this page and are not submitted to Kay & Co. Download your notes before leaving; the page does not save them.