Developer Checklist

The following checklists are intended to guide developers on the implementation of success criterion for the keyboard. The checklists should be used during the development phase to ensure WCAG 2.0 compliance of keyboard use on the site and should form part of the unit testing phase undergone by developers when updating or creating new content or functionality.

Areas of importance to be reviewed for keyboard access are also covered specifically in the relevant category factsheet:

  • Navigation; Content; Coding; Forms and Interactive site features (e.g. Interactive Maps, Slideshow, Image Gallery etc).

Level A

KYB_A1: Keyboard trap

Details

Is the site keyboard accessible (i.e. there are no keyboard traps within the navigation, content, links, form elements, buttons or any other object control within interactive or static content of the site)?

Correct example(s)

N/A

Incorrect example(s)
Keyboard user is unable to tab out of this plugin.
Incorrect Example Of KYB_A1

KYB_A2i: Keyboard accessible

Details

Is all content keyboard accessible (i.e. all interactive features and static content can be fully accessed and operated with the keyboard alone)?

Correct example(s)

N/A

Incorrect example(s)
Dropdown navigation cannot be activated by the keyboard.
Incorrect Example of KYB_A2i

KYB_A2ii:

Details

Is all content keyboard accessible (i.e. the TITLE attribute has not been used on links to present information not otherwise present on the page

Correct example(s)
Example 1: <a href="newsletter.PDF">Newsletter(PDF, 1 MB)</a>
Example 2: <a href="newsletter.PDF">Newsletter</a>
Incorrect example(s)
Example 1: Title attribute has extra information
<a href="newsletter.PDF" title="PDF, 1 MB">Newsletter</a>
Example 2: Title attribute has same information
<a href="newsletter.PDF" title="newsletter">Article</a>

KYB_A2iii:

Details

Is all content keyboard accessible (i.e. the TITLE attribute has not been used on images to present information not otherwise present on the page)?

Correct example(s)
ALT attribute used.
<IMG id=fav_rd_18 alt="Add to Favourites" src="/fav_off.png">
Incorrect example(s)
TITLE attribute used.
Incorrect Example of KYB_A2iii

KYB_A3: Item presentation

Details

Does the item presentation (e.g. navigation, content, links, form elements, buttons or any other object control) change on keyboard focus?

Correct example(s)

Mouse hover
Presentation on mouse hover
Keyboard focus-same presentation change
Presentation on keyboard focus
Incorrect example(s)

Mouse hover
Incorrect Example of KYB_A3 on mouse hover
Keyboard focus- no presentation change
Incorrect Example of KYB_A3 on keyboard focus

KYB_AA1: Keyboard focus

Details

Is there a highly visible keyboard focus indicator on all items (e.g. navigation, content, links, form elements, buttons or any other object control)?

Note: Although this is a AA issue, its impact on users is very high and addressing it as if it were a Level A, high impact issue is recommended.

Correct example(s)
Visible keyboard focus indicator
Correct Example of KYB_AA1
Incorrect example(s)
No visible keyboard focus indicator
Incorrect Example of KYB_AA1

KYB_A4i:

Details

Does all content appear on keyboard focus (i.e. the appearance of content such as tool tips is consistent with its appearance on mouse over)?

Correct example(s)
On mouse over
Correct example of KYB_A4i on mouse over
On keyboard focus
Correct example of KYB_A4i on keyboard focus
Incorrect example(s)
On mouse over
Incorrect example of KYB_A4i on mouse over
On keyboard focus
Incorrect example of KYB_A4i on keyboard focus

KYB_A4ii:

Details

Is the keyboard focus order meaningful – does the TAB order preserve meaning and operability (i.e. the TABINDEX attribute has not been used as this may interfere with built-in logical tab order)?

Correct example(s)
TABINDEX is not used.
Incorrect example(s)
<input name="query" value="" size="50" class="QSInput" id="query" tabindex="3" type="text">

KYB_A5i: Keyboard operation

Details

Are standard keyboard shortcuts operable (i.e. the ACCESSKEY attribute has not been used as this may interfere with the shortcuts of the browser, operating system, or assistive technology)?

Correct example(s)
ACCESSKEY is not used.
Incorrect example(s)
<label class="QSLabel" accesskey="s" for="query">

KYB_A5ii:

Details

Are standard keyboard shortcuts operable (i.e. can the navigation be operated through standard keyboard means such as using the TAB key to move across the top menu and the up and down arrow keys to move up and down the navigation dropdown)?

Correct example(s)

The TAB key is used to move across top level items, opening sub menus as appropriate. The up and down arrow keys are used to move up and down the sub menu. Correct example of KYB_A5ii

Incorrect example(s)

Cannot open sub menu with the keyboard. Incorrect example of KYB_A5ii

KYB_A6: Content

Details

Is all page content and instructional text device-independent (i.e. “click” alone is not used)?

Correct example(s)

Use ‘select’ or provide a descriptive link.

Incorrect example(s)