Large phone buttons: what accessibility rules actually say
WCAG 2.2 does not simply say “make buttons large”. Its AA minimum target-size criterion considers a target of at least 24×24 CSS pixels or, under defined conditions, space around a smaller target. The enhanced AAA criterion uses 44×44 CSS pixels. These are technical thresholds, not a promise that every person will tap without error.
Measure the active area, not the visible artwork
A target is the region that accepts touch or another pointer input. An icon may look small while its active area is larger; a large-looking tile may contain only a small actionable part. The measure uses CSS pixels, which are distinct from physical screen pixels.
Zoom, finger size and phone diagonal do not automatically make a target conform. Check the effective area in every supported state, including menus, overlays and orientations.
The AA minimum: 24×24 CSS pixels or qualified spacing
WCAG 2.2 SC 2.5.8 requires pointer targets to be at least 24×24 CSS pixels. An undersized target can use the spacing exception only when imaginary 24 CSS-pixel circles centred on small targets do not intersect other targets or their circles.
Other exceptions cover an equivalent control, inline links, user-agent-controlled sizing, and essential or legally required presentation. Passing through an exception does not necessarily make a control comfortable: W3C recommends meeting the minimum size itself as a best practice.
AAA raises the reference to 44×44
SC 2.5.5 Target Size (Enhanced) generally requires targets of at least 44×44 CSS pixels, with its own exceptions. It is a more demanding AAA criterion; it should not be presented as the AA minimum or a universal number for every context.
It can be a useful goal for an important action. Yet large targets, clear labels and space are insufficient when actions are confusing, layout shifts, confirmation is unclear or a person uses another input method.
Size, separation and cancellation work together
Separation reduces the chance of activating a neighbour, especially with tremor, vehicle movement, one-handed use or reduced precision. These are possible needs and conditions, not diagnoses to infer from an error.
SC 2.5.2 Pointer Cancellation also addresses when activation occurs: for many actions completion should happen on release, with a way to abort or undo, subject to exceptions. For an important signal, also assess understandable confirmation and error recovery.
Matrix: conformance and usable experience
The practical column needs checking on the real product; it is not a WCAG audit.
| Aspect | Rule or threshold | Experience check |
|---|---|---|
| Active area | Actual target, not icon alone | Does the expected whole area respond? |
| AA minimum | 24×24 CSS px | Is it still easy to reach? |
| Spacing | 24 px circles do not intersect | Is the neighbour hit accidentally? |
| AAA enhanced | 44×44 CSS px | Does it suit the primary action? |
| Labels | Not solved by size alone | Are meaning and outcome distinct? |
| Activation | Consider Pointer Cancellation | Can the pointer move away or cancel before release? |
| Confirmation | Depends on risk and flow | Does it prevent errors without blocking? |
| Adaptation | Text and system settings change | Works with zoom, rotation and large text? |
| Input | Touch is only one method | Works with assistive technology? |
| Context | WCAG does not predict a person | Tested with relevant users and devices? |
Apply WCAG to a native phone app cautiously
WCAG is a web-content standard. W3C’s WCAG2ICT explains how principles and criteria can apply to non-web software and documents, but does not by itself create a conformance statement for every app or law. Check the relevant contractual and legal context.
For My Safe Circle, examine primary actions on the actual device together with labels, confirmations, recipients and backup. The app supports communication with trusted people; it does not automatically detect events, call emergency services, or guarantee delivery or action.
- Active area measured in CSS px or an appropriate equivalent?
- Small targets checked with the spacing rule?
- Exceptions documented without calling them good UX?
- Accidental activation, cancellation and confirmation tested?
- Relevant users, devices, zoom and input methods included?
Frequently asked questions
Does 24×24 CSS pixels mean a button is accessible?
It means the target may meet the AA size threshold when all applicable requirements are met. It does not prove readability, understanding or ease for every person.
Is 44×44 required for WCAG 2.2 AA?
No. 44×44 belongs to the enhanced 2.5.5 Level AAA criterion; the 2.5.8 Level AA minimum uses 24×24 with defined exceptions.
Does a larger button eliminate accidental taps?
No. It may help, but separation, neighbouring actions, activation timing, confirmation, posture, device and individual variation also matter.
Sources consulted
Technical and safety information was checked against the following official sources.
- W3C — Target Size (Minimum), SC 2.5.8
- W3C — Target Size (Enhanced), SC 2.5.5
- W3C — Pointer Cancellation, SC 2.5.2
- W3C — WCAG2ICT for non-web software
- W3C — older users and accessibility
- My Safe Circle — features and limits
Editorial disclosure: this guide is published by the team behind My Safe Circle. It describes W3C criteria and product limits without claiming that its interface suits everyone or conforms to a particular legal regime.
MEASURE AND OBSERVE
Use the threshold as a baseline, then test the experience.
Check active area, separation, errors and input methods.
Explore My Safe CircleGeneral information, not a conformance certification or legal or medical advice. Needs and precision vary; a technical threshold cannot guarantee error-free use.