Rule ID: ace-nav-target-size

Evaluate whether interactive touch targets meet the minimum size and spacing requirements for motor accessibility

WCAG 2.2 (AA) 2.5.8: Target Size Blind Low Vision Mobility Legal Risk

What This Rule Checks

For users with motor impairments or those using touch devices, small or closely spaced interactive elements like buttons and links can be difficult to tap accurately. The WCAG guidelines recommend a minimum touch target size to ensure that these elements are easy to activate, improving accessibility for all users.

Who Is Affected

This issue primarily affects: Blind users, who rely entirely on screen readers or braille displays to navigate and interact with content; Low Vision users, who may use screen magnification, custom fonts, or high-contrast modes; Mobility users, who navigate using keyboards, switches, voice control, or other assistive input devices.

Why This Matters

Small touch targets are difficult or impossible to activate for users with motor impairments, tremors, or limited dexterity. WCAG 2.5.8 (Target Size Minimum) requires at least 24×24 CSS pixels. This is a Level AA requirement in WCAG 2.2.

How to Fix

Make sure that clickable or interactive elements have a sufficient size and adequate spacing between them. This helps users interact with buttons, links, and other controls easily without accidentally activating the wrong element.

Code Examples

Incorrect Markup Solutions:

Code example

/* Touch target too small */
.small-btn {
  width: 16px;
  height: 16px;
  padding: 0;
}

Copy

Correct Markup Solutions:

Code example

/* Meets WCAG 2.2 minimum of 24x24px */
.touch-btn {
  min-width: 44px;
  min-height: 44px;
  padding: 8px 12px;
}

/* For inline links, ensure adequate spacing */
.inline-link {
  padding: 4px 0;
  display: inline-block;
}

Copy

Common Mistakes to Avoid

Making icon buttons smaller than 24x24px without adequate spacing from other targets.
Not accounting for padding when calculating touch target size.
Placing small interactive elements too close together without spacing.
Testing only with a mouse and not with touch or stylus input.

Tip: Keyboard navigation is essential for users who cannot use a mouse. Ensure all interactive elements are reachable via the Tab key and operable via Enter or Space. Test focus visibility and focus order on every page.

Related WCAG Criteria

2.5.8: Target Size