WEBVTT

00:00:00.000 --> 00:00:06.000
Can a visitor tap the right control without hitting its neighbour?

00:00:06.000 --> 00:00:13.000
The interactive target area and its spacing both matter.

00:00:13.000 --> 00:00:18.000
Check the tappable area, not just the icon.
6 practical target checks.

00:00:18.000 --> 00:00:30.000
Identify the interactive area
The visible icon and the clickable target may have different sizes.
Visible icon · Clickable area · Actual target

00:00:30.000 --> 00:00:42.000
Review the target dimensions
WCAG 2.2 has a 24 by 24 CSS pixel minimum criterion, with exceptions.
CSS pixel size · Minimum criterion · Defined exceptions

00:00:42.000 --> 00:00:54.000
Check neighbouring controls
Close targets can be difficult to distinguish and activate accurately.
Adjacent targets · Useful separation · Accurate activation

00:00:54.000 --> 00:01:06.000
Keep important actions clear
Primary tasks need easy-to-identify controls and labels.
Clear action · Readable label · Suitable target area

00:01:06.000 --> 00:01:18.000
Test the real layout
Review compact menus, pagination and icon controls at small widths.
Small-screen menu · Pagination links · Icon buttons

00:01:18.000 --> 00:01:30.000
Treat this as one check
Target size alone does not establish complete website accessibility.
Actual user task · Other accessibility checks · Observed result

00:01:30.000 --> 00:01:39.000
Your checklist
Identify the interactive area · Review the target dimensions · Check neighbouring controls · Keep important actions clear · Test the real layout · Treat this as one check

00:01:39.000 --> 00:01:47.000
Review real controls on a phone and with a pointer.
jerseyweb.je