WCAG 2.2 Target Size Minimum (2.5.8): Complete Touch Target Guide for Developers
A developer guide to satisfying the 24x24 CSS pixel bounding box rule, understanding inline text exceptions, and preventing mobile touch target overlap.
The definitive regulatory baseline for global digital accessibility. Understand the 4 POUR principles, the operational differences between WCAG 2.1 and 2.2 AA, and technical requirements across all Level A, AA, and AAA success criteria.
Digital accessibility compliance under W3C guidelines is not a binary badge or automated score. A website achieves WCAG compliance when every page, workflow, modal, document, and interactive element satisfies all testable success criteria specified under a designated conformance level (typically Level AA).
Conformant web design guarantees that users with visual, auditory, motor, speech, language, learning, and neurological disabilities can perceive, navigate, understand, and complete transactions independently. Automated scanners can accurately verify approximately 30% to 40% of these criteria; full legal and technical compliance requires rigorous manual validation using assistive technology like screen readers and keyboard-only interaction.
The W3C structures all accessibility rules into four foundational pillars known as POUR. If any one of these four principles is violated, users with disabilities are blocked from your digital property.
Information and user interface components must be presentable to users in ways they can perceive.
User interface components and navigation must be operable using diverse inputs.
Information and the operation of the user interface must be clear and predictable.
Content must be robust enough to be interpreted reliably by diverse user agents, including assistive tools.
The W3C categorizes success criteria into three tiers of conformance. Understanding where your legal liability begins and ends is essential for risk mitigation.
| Level | Purpose & Reach | Legal Status | Key Example Criteria |
|---|---|---|---|
| Level A | Basic digital accessibility. Addresses essential barriers that completely prevent disabled individuals from using the site. | Mandatory baseline (Failure guarantees legal exposure) | Alt text (1.1.1), Keyboard navigation (2.1.1), No keyboard trap (2.1.2), Page titled (2.4.2) |
| Level AA (Standard) | Comprehensive practical accessibility. Removes the major barriers experienced by the vast majority of disabled users. | Universal legal standard (ADA, Section 508, EAA, AODA) | Contrast 4.5:1 (1.4.3), Focus visible (2.4.7), Resize text 200% (1.4.4), Target size 24px (2.5.8), Redundant entry (3.3.7) |
| Level AAA | Specialized enhanced accessibility. Highly specific criteria designed for specialized software and maximum inclusivity. | Voluntary best practice (W3C does not recommend AAA for whole sites) | Contrast 7:1 (1.4.6), Sign language interpretation (1.2.6), Target size 44px (2.5.5) |
Published as an official recommendation in October 2023, WCAG 2.2 introduces 9 new success criteria and officially deprecates criterion 4.1.1 (Parsing). Here is what engineering teams must build to ensure future-proof compliance.
Focus indicators must have an area of at least a 2px perimeter border around the focused component and achieve at least a 3:1 contrast ratio between focused and unfocused states.
Any feature requiring dragging motion (such as Kanban boards, drag-and-drop file uploaders, or sliders) must provide a single-pointer alternative like buttons or keyboard-driven up/down actions.
Interactive targets must be at least 24 by 24 CSS pixels, or have sufficient spacing from adjacent targets so that a 24px circle centered on one does not intersect another target.
If support mechanisms (such as contact info, chat widgets, or FAQs) appear on multiple pages, they must appear in the same relative order across the site.
Information previously entered by the user in the same session (such as billing address matching shipping address) must be auto-populated or available for selection rather than retyped.
Login procedures cannot rely on cognitive function tests like memorizing passwords, transcribing puzzle CAPTCHAs, or solving arithmetic unless an alternative method (copy-paste, password manager support, WebAuthn) is provided.
The majority of federal demand letters and web lawsuits cite repetitive failures in four technical areas: media captions, keyboard focus visibility, interactive touch targets, and accessible authentication.
Under WCAG 1.2.2 (Captions Prerecorded, Level A), all video content featuring spoken dialogue must offer synchronized, accurate closed captions. Automated YouTube captions do not satisfy compliance if names, technical jargon, or cadence are obscured. Under WCAG 1.2.5 (Audio Description, Level AA), visual information not conveyed through spoken dialogue (onscreen charts, text slides, physical actions) must be narrated via secondary audio description tracks.
Synchronized closed captions (.vtt or .srt) for all pre-recorded video media containing audio speech.
Audio description track narrating visual-only transitions, slide content, and non-verbal actions.
Stripping outline styling using outline: none without replacing it with an accessible focus indicator violates both WCAG 2.1 (2.4.7) and WCAG 2.2 (2.4.11). Focus indicators must maintain a 3:1 contrast ratio against both the button background and adjacent elements.
Access our comprehensive 55-point technical audit checklist mapping every Level A and AA success criterion directly to DOM elements, code remediation snippets, and manual screen reader testing steps.
Access specific evaluation criteria, downloadable test checklists, code patterns, and technical guidelines across this regulatory domain.
A developer guide to satisfying the 24x24 CSS pixel bounding box rule, understanding inline text exceptions, and preventing mobile touch target overlap.
Step-by-step code patterns for :focus-visible styling, Tailwind ring-offset contrast rules, 2px outline thickness, and multi-layer keyboard rings.
Technical guidelines for removing cognitive function tests, supporting password managers, magic links, and deploying WebAuthn passkeys.
How to avoid redundant data entry across multi-step checkout and application forms with automatic population, session storage, and checkbox consent.
Engineering accessible alternatives for drag-and-drop boards, sliders, and reorderable lists using keyboard shortcuts and single-click buttons.
Side-by-side comparison of all 9 new WCAG 2.2 criteria, the removal of 4.1.1 Parsing, and an actionable audit checklist for development teams.