- Success Criterion 2.5.1
- Conformance level A
Two-Finger Gesture Required With No Single-Pointer Option
2.5.1 — Pointer Gestures
Scenario
Setting
A pharmacy app's prescription-refill form
What’s wrong
Two-finger pan/rotate requirements without single-pointer controls.
Example
label.addEventListener('gesturechange', (e) => {
label.style.transform = `rotate(${e.rotation}deg) scale(${e.scale})`;
});
// rotation and zoom are only reachable through a two-finger gesture Why it matters
A patient confirming their prescription can't straighten a sideways label photo unless two fingers can touch the screen at once.
How to test
Try the two-finger pan/rotate action with a single finger or a button instead: if no single-pointer alternative exists, it fails.
How to fix
Any rotate-and-scale gesture needs single-tap buttons that perform the same rotation and zoom steps.
<button aria-label="Rotate label 90 degrees" onclick="rotateLabel(90)">⟳</button>
<button aria-label="Zoom in on label" onclick="zoomLabel(1.2)">+</button> Outcome
A patient taps rotate twice, reads the label right-side up, and confirms the correct refill.
Who is affected
People who can only use one finger or a stylus, and users with a paralyzed or missing hand.
Learn more
- Understanding Understanding document (opens in a new tab)
Related scenarios
- Feature Requiring a Swipe Gesture With No Tap Alternative
- Swipe-Only Carousel With No Next or Previous Button
- Map or Image Zoomable Only by Pinch Gesture
- Pull-to-Refresh as the Only Way to Refresh Content
- Swipe-to-Delete Action With No Tap-Based Alternative
- Slider Operable Only by Dragging, Not by Tapping or Typing