WCAG (Level A) SC 2.2.1 Timing Adjustable (w3.org)
Issue description
WCAG 2.2.1, “Timing Adjustable” recognizes that some users may require more time to interact with web content than others. Many websites have time limits that can create barriers for these users. This can include:
- Session timeouts: Automatically logging users out after a period of inactivity. Time limits on forms: Requiring users to complete a form within a certain time frame.
- Moving content: Content that moves, blinks, or scrolls automatically can be difficult to follow for some users.
- Time-limited prompts: Prompts or notifications that disappear after a short time. When users don’t have enough time to complete tasks or process information, it can lead to:
- Frustration and anxiety: Users might feel rushed and stressed, leading to errors or abandonment of tasks.
- Exclusion: Users might be unable to complete tasks or access content altogether.
WCAG requirements
This guideline requires that users should be able to:
- Turn off time limits: Disable time limits completely.
- Adjust time limits: Extend the time limit to at least ten times the default.
- Extend the time limit: Extend the time limit at least 20 seconds before it expires, with a simple action (like pressing a key).
Exceptions
- Real-time events: Time limits are permissible for real-time events (e.g., auctions, online games) where timing is essential.
- Essential exceptions: Time limits are allowed when they are essential and extending them would invalidate the activity (e.g., a timed test).
Essentially, this guideline ensures that users have sufficient time to interact with web content at their own pace. It promotes inclusivity and provides a more equitable online experience for everyone.
Related requirements
The following WCAG source criteria are often related to this as well. They can provide additional insights into specific challenges you may be encountering.
- WCAG (Level AAA) SC 2.2.3 No Timing
- WCAG (Level AAA) SC 2.2.4 Interruptions
- WCAG (Level AAA) SC 2.2.5 Re-authenticating
- WCAG (Level AAA) SC 2.2.6 Timeouts
Who this issue impacts
Follow the links for additional information on user impairments:
Suggestions for remediation
Remediating WCAG 2.2.1, “Timing Adjustable” involves giving users control over time limits on your website, allowing them to disable, adjust, or extend them as needed. Here’s how:
Provide user controls
- Disable time limits: Offer a setting that allows users to disable time limits completely. This could be a checkbox in the user preferences or a toggle switch within the interface.
- Adjust time limits: Provide a control to adjust the time limit, such as a slider or input field. Allow users to set the time limit to at least ten times the default value.
- Extend time limits: Provide a mechanism to extend the time limit before it expires, such as a button that adds more time. Make sure this is a simple action, like pressing a key or clicking a button.
Inform users about time limits
- Clear warnings: Provide clear warnings to users about upcoming time limits. Indicate how much time is remaining and how to extend it if possible.
- Progress indicators: Use progress bars or timers to visually represent the remaining time.
Avoid unnecessary time limits
- Re-evaluate time limits: Review all time limits on your website and consider whether they are truly necessary. Remove any time limits that are not essential to the functionality or purpose of the content.
Handle timeouts gracefully
- Warn before timeout: Provide a clear warning before a session timeout occurs, giving users enough time to extend their session.
- Save user progress: If possible, save the user’s progress so they don’t lose their work if a timeout occurs.
Testing
- Test with different settings: Test your website with different time limit settings to ensure that the functionality works as expected and users can adjust the time limits effectively.
- Assistive technology testing: Test with screen readers to ensure that time limit warnings and controls are properly announced to users.
Examples
- Session timeout: Provide a warning message 5 minutes before the session expires, with a button to “Extend Session.”
- Form time limit: Offer a checkbox to “Disable time limit for this form” or provide a slider to adjust the time limit.
- Moving content: Provide a pause/resume button for any moving, blinking, or scrolling content.
By implementing these techniques, you can ensure that users have sufficient time to interact with your website at their own pace, creating a more inclusive and user-friendly experience for everyone.
