Loading...
Loading content...
Loading content...
Don't require complex gestures (like pinch-to-zoom) without simple alternatives.
Why it matters: Users with motor disabilities may not be able to perform complex gestures.
All functionality that uses multipoint or path-based gestures for operation can be operated with a single pointer without a path-based gesture, unless a multipoint or path-based gesture is essential.
What This Means: This success criterion requires that any functionality that uses complex gestures (like pinch-to-zoom, two-finger swipe, or path-based gestures like drawing) must also be available through simple single-pointer interactions. A single pointer means a single point of contact, such as one finger, one mouse click, or one stylus tap.
Why It's Important: Users with motor disabilities, tremors, or limited dexterity may not be able to perform complex gestures like pinch-to-zoom or multi-touch swipes. Some users may be using assistive technologies that only support single-pointer input. Additionally, some devices or input methods may not support complex gestures. By providing simple alternatives, you ensure all users can access functionality.
For pinch-to-zoom functionality, provide zoom in/out buttons or a zoom slider. For swipe-based carousels, add previous/next buttons or arrow keys. For path-based gestures (like drawing), provide alternative controls when the gesture isn't essential to the function. The key is that users should be able to accomplish the same task with a simple click, tap, or keyboard interaction.
This criterion ensures that users with motor disabilities can access and understand the content, improving their overall experience and ability to use the website effectively.
This criterion ensures that users with cognitive disabilities can access and understand the content, improving their overall experience and ability to use the website effectively.
Impact: When this criterion is properly implemented, it removes barriers for these user groups and creates a more inclusive web experience for everyone.
Image zooming only works with pinch gesture, no alternative.
<img src="photo.jpg" onpinch="zoom(event)">Image zooming works with pinch gesture AND zoom in/out buttons.
<img src="photo.jpg" onpinch="zoom(event)"><button onclick="zoomIn()">+</button><button onclick="zoomOut()">-</button>This success criterion benefits the following user groups:
Tip: Use this checklist during development and testing to ensure all requirements for 2.5.1 Pointer Gestures are met. Check off items as you complete them.
To meet this success criterion, ensure the following requirements are met:
While meeting the minimum requirements ensures compliance, consider these enhancements for a better user experience:
If I provide pinch-to-zoom, that's enough for accessibility.
Pinch-to-zoom requires two fingers, which some users cannot perform. You must also provide single-pointer alternatives like zoom buttons or a slider.
Touch devices require gestures, so alternatives aren't needed.
Many users cannot perform complex gestures. Always provide simple single-pointer alternatives, even on touch devices.
Carousels or sliders that only work with swipe gestures.
Add previous/next buttons or arrow keys as alternatives. Ensure single-click/tap can navigate.
Image zoom that only works with pinch-to-zoom.
Add zoom in/out buttons or a zoom slider. Allow users to zoom with simple click/tap interactions.
Drag-and-drop interfaces without alternative controls.
Provide buttons, form inputs, or keyboard shortcuts that achieve the same result. See also 2.5.7 Dragging Movements.
Note: These are official W3C resources for 2.5.1. For the most up-to-date information and detailed technical guidance, always refer to the official W3C documentation.
Implementing 2.5.1 Pointer Gestures correctly requires understanding your specific context. Code solutions vary significantly based on multiple factors:
HTML, React, Vue, Angular, PHP, Python, and other frameworks each have different patterns and best practices.
Server-side rendering, client-side rendering, static generation, and hybrid approaches require different solutions.
Your existing components, styling approach, and UI library influence how accessibility must be implemented.
Your specific user base, content type, and interaction patterns determine the most appropriate implementation.
We provide tailored implementation guidance by analyzing your specific technology stack, coding patterns, design system, and project requirements. Our team reviews your codebase and provides custom solutions that integrate seamlessly with your existing architecture.
Get Custom Implementation HelpPart of
Operable PrincipleGuideline
2.5 Input Modalities