What's new in WCAG 2.2, and how does it apply to our work at Watermark?

Version 2.2 of the Web Content Accessibility Guidelines (WCAG) was published as a “W3C Recommendation” Web Accessibility Standard on October 5, 2023. The update removes a success criterion and adds nine new ones. It can be found here: WCAG 2.2.

This article reviews what changed with the update and how it applies to our work at Watermark. Five criteria relate to data input (as parts of Guideline 2.5 Input Modalities and Guideline 3.3 Input Assistance). In particular, WCAG introduces for the first time requirements related to authentication. Three criteria relate to focus, a concern belonging to Guideline 2.4 Navigable. The last one aims to ensure users can find help, which pertains to Guideline 3.2 Predictable.

This article assumes understanding of WCAG's structure (Principles, Guidelines, Success Criteria) and conformance levels (A, AA, AAA). If you are not familiar with them, the section WCAG 2 Layers of Guidance of that document offers a good primer.

Input

Some of the updates relate to input modalities, which are the ways users operate functionality beyond the keyboard. Two of the new criteria specifically concern pointer gestures, a topic of concern for users with limited mobility, especially relevant in light of the increasing use of mobile devices. This is the case of criterion 2.5.7 Dragging Movements (AA), which stipulates that user interfaces relying on dragging should also provide an alternative.

Consider a list that can be reorganized by dragging an item up or down. Adding up and down arrow buttons on the side of the selected item to perform that action would fulfill the requirement.

Target size is also of great importance for people with reduced mobility. They should be able to activate a target without accidentally activating another. There was already a requirement for the size of clickable elements, 2.5.5 Target Size, but it only applied at the highest conformance level. The WCAG 2.2 update renames it 2.5.5 Target Size (Enhanced) (AAA) and creates 2.5.8 Target Size (Minimum) (AA). Targets should be at least 24x24 CSS pixels. There are several exceptions, for instance if the target is in a block of text.

The three other criteria related to input are aimed at improving the experience of users with cognitive issues by helping them avoid and correct mistakes. Criterion 3.3.7 Redundant Entry (A) states that the same information should not be required twice in the same process.

In order to fulfill this criterion, the information previously entered by the user can be auto-populated or made available for the user to select. For instance, a "same as billing address" checkbox auto-filling the delivery address would meet the requirement.

3.3.8 Accessible Authentication (Minimum) (AA) and 3.3.9 Accessible Authentication (Enhanced) (AAA) aim to ensure users can log in without being required cognitive tasks such as puzzle solving (CAPTCHA) or memorizing (password, one-time passcode…). One notable exception is stated as follows: "A mechanism is available to assist the user in completing the cognitive function test." It means you may require the user to enter a password as long as copying and pasting is possible and/or entry by password managers is supported.

Use appropriate semantics on form fields to ensure password managers can find them and autofill the user's data. See Hidde de Vries's article for more information. Please note that disabling copying and pasting, a common practice on password fields, fails this criterion.

Keyboard focus

WCAG already had a criterion to ensure focus is visible for keyboard users, 2.4.7 Focus Visible. Three new criteria add more specificity. Firstly, the element in focus should not be off-screen or hidden behind other content. It should be at least partially visible at conformance level AA (2.4.11 Focus Not Obscured (Minimum)), and fully visible at conformance level AAA (2.4.12 Focus Not Obscured (Enhanced)).

To fulfill this requirement, ensure the element gaining focus is brought into view if it was off-screen. When using modals, ensure the rest of the page cannot be focused with the keyboard while the modal is open (use the dialog HTML element or implement trap focus). Ensure the element in focus is always visible when tabbing through the page at 400% zoom.

Secondly, a minimum size (2px) and contrast ratio (3:1) for the focus indicator are specified by criterion 2.4.13 Focus Appearance (AAA).

Consistent Help

Criterion 3.2.6 Consistent Help (A) requires that help, when it is provided, be found in the same place across multiple pages, so that people who need help can find it easily.

Parsing (removed)

The evolution of technologies made criterion 4.1.1 Parsing obsolete. It required the HTML document to have no parsing errors (start and end tags, proper nesting, no duplicate attribute, no duplicate IDs…). Assistive technologies no longer directly parse HTML, they rely on browsers instead, which in turn have evolved and can handle malformed markup. When incorrect markup causes accessibility issues they are handled by other criteria, like 1.3.1 Info and Relationships and 4.1.2 Name, Role, Value. As a result this criterion is no longer needed.

Summary

To wrap up, here's a list of the new criteria grouped by the principles and guidelines they relate to:

As a reminder, Watermark has adopted WCAG 2.2, level A and AA as our go forward target for conformance. Criteria AAA should be respected when applicable as they improve the overall accessibility of our products.

Back to Top