Tab Orderings Correct and Logical

This is a technique for testing:

WCAG 2.0: Guideline 1.3 Adaptable: Create content that can be presented in different ways (for example simpler layout) without losing information or structure. Understanding Guideline 1.3

2.1.2 No Keyboard Trap: If keyboard focus can be moved to a component of the page using a keyboard interface, then focus can be moved away from that component using only a keyboard interface, and, if it requires more than unmodified arrow or tab keys or other standard exit methods, the user is advised of the method for moving focus away. (Level A) How to Meet 2.1.2 | Understanding 2.1.2

2.4.3 Focus Order: If a Web page can be navigated sequentially and the navigation sequences affect meaning or operation, focusable components receive focus in an order that preserves meaning and operability. (Level A) How to Meet 2.4.3 | Understanding 2.4.3

3.2.3 Consistent Navigation: Navigational mechanisms that are repeated on multiple Web pages within a set of Web pages occur in the same relative order each time they are repeated, unless a change is initiated by the user. (Level AA) How to Meet 3.2.3 | Understanding 3.2.3

Overview

It helps to prioritise information on a web site so the most important items are presented early on especially if the user is dependent on tabbing round a web page using the keyboard.   When the page is viewed in a text only layout the tab order needs to flow naturally.  (example taken from Amazon.co.uk)

Amazon text view


However, the sequence of tabbing can be set up with a tab index so that each element is provided in an order defined by the author of the web site. There is also the need to ensure the keyboard user can enter and leave a form or widget such as a calendar and even an audio / video player.

Method

Testing for tab order of links is a relatively easy exercise using the Tab Key or the Firefox Accessibility Extension will offer numbers to show the order of links in their dialog window and the Web Developer Firefox add-in offers a tab index check (example taken from the same Amazon.co.uk page as above)


Amazon tab index and links


Looking out for highlighted areas and outlines can help when checking that tabbing into and out of forms, widgets and other controls such as those found on media players is possible.  There is a Flash video of tabbing around the Web2Access menu and into the search form on Keyboard Access.  Access Keys and Browser keyboard shortcut keys may also have been used for navigation.

Advice