How do you audit more complex keyboard navigation situations like where a component exposes more content?

Question

How do you audit more complex keyboard navigation situations like where a component exposes more content?

Answer

So let's say you have a component like a combo box. When testing for keyboard operability, you must test beyond the functionality of the component that's expanding content. Any interactive components within it should also be tested. If you have a combo box, the input field that you type into also needs to be keyboard navigable. If you have options to go through, those need to be able to be navigated with arrow keys. Also, if you have an accordion that's displaying links, the keyboard focus should move right into the content that's exposed so you can interact with the links and open them. So when you're testing, make sure if anything receives focus inside content that's exposed, it's also able to be interacted with, and that it does, at the bare minimum, receive that focus.

Free Tools to Continue Learning

Accessible Web Company Logo

Accessible Web RAMP

Monitor your website and manage your progress towards WCAG conformance.

Accessible Web Company Logo

Accessible Web Academy

Career specific courses to help power up your accessibility knowledge.