Make targets at least 44 by 44 pixels
W3C names its own criterion inside this technique, which makes it unusually easy to place. W3C lists C44 as sufficient for one criterion, 2.5.5 Target Size (Enhanced), which is Level AAA and sets the bar at 44 by 44 CSS pixels. The Level AA rule is a different number, 24 by 24, and the technique for that one is C42. So 44 is the comfortable target rather than the required one, and it comfortably clears the required one on the way past. W3C's own framing is about pagination links and about preventing accidental activation of the target next door. Two declarations do it. A minimum width and height on the control, then a centering rule so the icon still sits where the design put it. The visual size does not have to change at all.
How we find it in an audit
Measuring targets is automated, so the list of anything under 44 pixels comes free. What needs a person is deciding which of them matter, and the answer is the ones people press under pressure. Bottom navigation on a phone, toolbar actions, inline links inside body text, and anything sitting next to a destructive action.
How affected users experience it
Small targets are a motor accuracy tax and it is paid by more people than most teams assume. Tremor, arthritis, a phone in one hand, a bumpy bus. A 20 pixel icon in a toolbar takes three attempts, and each miss lands on whatever is next to it. Growing the hit area, not the icon, removes the tax and changes nothing about the design.
Passes vs. fails
Passes
.toolbar button { min-width: 44px; min-height: 44px;
display: inline-grid; place-items: center; }Fails
.toolbar button { width: 20px; height: 20px; }This guide is our interpretation of W3C technique C44: Using CSS to ensure targets are at least 44 by 44 CSS pixels. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.