No history yet

WCAG 2.2 Standards

Meet WCAG 2.2

The Web Content Accessibility Guidelines (WCAG) have evolved. While the foundational principles of WCAG 2.1 AA remain the legal benchmark for accessibility in many jurisdictions, the professional standard has moved forward. Released in October 2023, WCAG 2.2 introduces nine new success criteria to address modern web challenges. These additions don't replace the old rules; they build on them to create an even more inclusive web.

Adopting WCAG 2.2 AA isn't just about future-proofing your work. It's about committing to a higher standard of usability for everyone, especially for users with motor, cognitive, and visual disabilities.

Keeping Focus Visible

One of the most common frustrations for keyboard-only users is losing track of their position on a page. Sticky headers, footers, or non-modal dialogs often cover the element that currently has keyboard focus. This makes navigation impossible.

The new Focus Not Obscured (Minimum) criterion (2.4.11, Level AA) tackles this directly. It requires that when a user interface component receives focus, no part of it is hidden by other content.

Practically, this means your CSS and JavaScript must account for fixed-position elements. When an element receives focus, you may need to programmatically scroll the page to ensure the focused element is fully in view.

Beyond Drag and Drop

Drag-and-drop interfaces are common for tasks like reordering lists or uploading files. However, they can be impossible for users who have difficulty with fine motor control or who use alternative input devices like voice commands or switches.

Dragging Movements (2.5.7, Level AA) mandates that for any action requiring a dragging movement, a single-pointer alternative must exist. This means a user can accomplish the same task with simple clicks or taps.

For example, a sortable list where items are reordered by dragging should also have up and down arrow buttons next to each item to move it one position at a time.

This doesn't mean you must get rid of drag-and-drop functionality. It just means it can't be the only way to perform an action.

Sizing Up Targets

Small buttons and links are difficult to tap accurately, especially on mobile devices or for users with motor impairments. WCAG 2.1 addressed this with a Level AAA criterion, but WCAG 2.2 introduces a more achievable Level AA requirement.

Target Size (Minimum) (2.5.8, Level AA) requires that interactive targets have a size of at least 24 by 24 CSS pixels. There are some exceptions. For example, if the target is in a line of text or if the spacing around the target is large enough to prevent accidental clicks, a smaller size might be acceptable. But for standalone icons and buttons, 24x24 is the new minimum.

Smarter Logins and Forms

Two new criteria focus on reducing cognitive load during common tasks like logging in and filling out forms.

First, Accessible Authentication (Minimum) (3.3.8, Level AA) aims to eliminate authentication methods that rely on cognitive tests. This means you cannot require users to solve a puzzle, transcribe text from an image (like a classic CAPTCHA), or recall information like a username or password from memory to log in. This is a huge win for users with cognitive disabilities.

What's allowed? Methods that don't rely on these tests, such as:

  • Copying and pasting a password from a password manager.
  • Using third-party login services (e.g., "Log in with Google").
  • Object recognition CAPTCHAs (e.g., "Click on all the bicycles"), provided they have accessible alternatives.
  • Receiving and entering a code sent via email or SMS.

Developers must integrate accessibility checks throughout the development process, utilizing semantic markup (e.g.,

,
,
) and applying ARIA attributes only when necessary to enhance assistive technology compatibility.

Second, Redundant Entry (3.3.7, Level A) addresses the annoyance of re-entering the same information within a single process. If a user has already entered information, it should either be auto-populated or available for them to select in subsequent steps.

A classic example is a checkout flow that asks for a shipping address and then a billing address. If the user indicates they are the same, they should not have to type the address again.

Quiz Questions 1/5

A user is navigating your website using only their keyboard. When they tab to a link in the main content area, a sticky header at the top of the page completely covers the focused link. Which new WCAG 2.2 criterion does this scenario fail?

Quiz Questions 2/5

According to the WCAG 2.2 "Dragging Movements" criterion, websites must remove all drag-and-drop functionality to be accessible.

While WCAG 2.1 AA is the current legal standard in many places, adopting the 2.2 AA criteria is now the professional expectation for creating truly inclusive and high-quality digital experiences. It shows a commitment to all users and prepares your work for the future.