This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung →
Target sizes and pointer input: 24×24 pixels and what depends on it
Controls need a target area of at least 24×24 pixels, unless they're spaced far enough apart or sit within body text. Anything that works with a gesture or a drag movement also needs a simple way to do it with a single pointer action.
- Target size is new in WCAG 2.2, and it mostly hits toolbars, close icons, and row actions in tables. A 16-pixel icon only meets it if enough spacing remains around it — the area counts, not the image.
- Drag movements affect sliders, sortable lists, and map sections. Anyone who can't hold a hand steady needs an alternative for this: buttons, input fields, keyboard operation.
- "Label in name" is unassuming but has real consequences for voice input: if a button is visibly named "Submit" but is called "Send form" in the code, the voice command won't find it.
FAQ
Does 24×24 pixels apply to every element?
No. Exempt are links within body text, elements with enough spacing between them, displays set by the browser, and cases where the size is essential to the meaning.
What counts as the target area?
The clickable area, not the icon. A small icon inside a bigger button is fine, as long as the button itself is large enough.
Why can't voice input find our button?
Because the accessible name differs from the visible label. The visible text must be contained in the accessible name — otherwise the user speaks a name the system doesn't recognise.