^{Read time: 50 seconds}

Do your wireframes or design mockups show a logical tab order for people using a keyboard, or other assistive technology, to navigate?

Steps to take

1. A user should be able to use the tab key to navigate to and activate every interactive element on a page.
2. Users should be able to tab through interactive items in a logical order, usually from left to right and top to bottom. Sometimes a logical order will be obvious to your front end team based on a simple layout. In more complicated layouts you may need to identify the tab order in your wireframes or mockups.
3. Each interactive element should have a visible focus state, work with your visual designer to make sure you’ve accounted for these.
4. Read our information about focus visible. It includes advice on best practice colour combinations.
5. Watch World Wide Web Consortium's (W3C) video about keyboard compatibility (47 seconds):

Web Content Accessibility Guidelines

• 1.3.2 Meaningful Sequence
• 2.4.3 Focus Order
• 2.4.7 Focus Visible

Next page: Focus