Skip to content

Technique G59:Placing the interactive elements in an order that follows sequences and relationships within the content

Applicability

All technologies that contain interactive elements and define a default tab order for interactive elements.

This technique relates to 2.4.3: Focus Order (Sufficient).

Description

The objective of this technique is to ensure that interactive elements receive focus in an order that follows sequences and relationships in the content. When designing the content, the interactive elements such as links and form controls are placed in the content so that the default tab order follows the sequences and relationships in the content. Each technology defines its default tab order, so the mechanism for placing the controls in the content will depend on the technology used.

As an example, in HTML, the default focus order follows the order in which elements appear in the content source. When the order of the HTML source matches the visual order of the Web page, tabbing through the content follows the visual layout of the content. When the source order does not match the visual order, the tab order through the content must reflect the logical relationships in the content that are displayed visually.

Examples

  • A form contains two text input fields that are to be filled in sequentially. The first text input field is placed first in the content, the second input field is placed second.
  • A form contains two, side-by-side sections of information. One section contains information about an applicant; the other section contains information about the applicant's spouse. All the interactive elements in the applicant section receive focus before any of the elements in the spouse section. The elements in each section receive focus in the reading order of that section.

Tests

Procedure

  1. Determine the order of interactive elements in the content.
  2. Determine the logical order of interactive elements.
  3. Check that the order of the interactive elements in the content is the same as the logical order.

Expected Results

  • Check #3 is true.
Back to Top