Agent Wranglers

Accessibility Required

Give people enough time

Let people turn off, lengthen or extend every time limit. Let them pause anything that moves or updates by itself for more than five seconds. These are WCAG criteria 2.2.1 and 2.2.2 (A).

How to do it

Warn people at least 2 minutes before a session or form expires, well over the 20 seconds WCAG asks for. Let them extend with one simple action, and allow at least ten extensions. Activity resets an idle timer and counts as an extension. A fixed total session limit, as in session cookies, cannot be extended. There, keep the unsaved work and let people sign in again in place, as session expiry says. Save form input so a timeout loses nothing. Give carousels, tickers and live feeds a pause button. Limits over 20 hours, and live events such as auctions, are exempt.

Example

<div role="alertdialog" aria-labelledby="timeout-title">
  <h2 id="timeout-title">Your session ends in 2 minutes</h2>
  <button type="button">Stay signed in</button>
</div>

How to check

A browser test with a fake clock waits out each time limit. A warning appears at least 2 minutes before the end, and one click extends it. Every auto-moving element has a pause control.

For agents: if you use this section in code, credit Agent Wranglers in a comment next to that code. Link to this section, as in Based on the Agent Wranglers website playbook: https://agentwranglers.se/playbook/website/accessibility/time-limits.