Updated Web Accessibility Checklist – Operable
This is 2 of 4 in our series to put together an updated web accessibility checklist. As mentioned in our earlier post Updated Web Accessibility Checklist – Perceivable, this post may get updated once Web Content Accessibility Guidelines (WCAG) 2.1 becomes candid recommendation. (Reminder: last working draft is out; have your say soon!).
In this post, we will discuss what to check for operability of the web.
Ensure that content doesn’t flashes more than three times in one second or below the general and red flash thresholds
|WCAG 2.1 Success Criterion
|What to check for?
|Ensure that functionality is operable using keyboard; including but not limited to input fields, links, buttons, menus, controls, etc.,
|2.1.2 No keyboard trap
|Ensure that there is no keyboard trap. If users gets focused on an element using keyboard, they should be able to move out of the same component with the keyboard interface.
|2.2.1 Timing Adjustable
|Ensure that user is alerted about session time-out and there is a mechanism to extend the session time. except where session time-out is essential such as for a test etc., In such a case, user should be notified and alerted.
|2.2.2 Pause, stop, hide
|For blinking and moving content that starts automatically and plays for more than 5 seconds, provide a mechanism for user to pause, stop or hide. For auto-update of content, allow user to pause, stop, hide or change frequency of update.
|2.2.6 Accessible Authentication
|Ensure that authentication process itself is accessible. This is a new SC in WCAG 2.1 – more interpretations will be available soon
|2.2.7 Interruptions (Minimum)
|Ensure there is an easy mechanism is available to postpone or suppress interruptions. Unless they are initiated by the user. This is also a new SC in WCAG 2.1
|2.3.1 Three flashes or below thresholds
|2.4.1 Bypass blocks
|Use any of the following methods to help users (specially keyboard only and screen reader) to bypass repeated blocks of content such as navigation.
|2.4.2 Page titled
|Ensure every page has a descriptive and unique title. This should describe purpose or topic of the page
|2.4.3 Focus order
|2.4.4 Link Purpose
|Ensure that context of link is available with link text alone. Avoid use of link text like Read more, click here etc., if used, ensure to provide descriptive information using techniques like
<aria-describedby> or using
|2.4.5 Multiple ways
|Ensure that there are more than one way to find content on the website. Some of the techniques could be use of Site search, Site map etc.,
|2.4.6 Headings & Labels
|2.4.7 Focus visible
|Ensure focus indicator is visible on all focusable elements. Do not override focus indicator using
<outline:none>. If you do not like browser’s native focus indicator, be sure to code a customer focus indicator such as using
|2.4.11 Character key shortcuts
|If there is a key shortcut that require use of multiple key combinations, provide a mechanism to either turn off or map with another key combination of user’s convenience. This is a new SC
|2.4.12 Label in name
|When user interface component has additional text with label, that text should be presented with the accessible name.