Suppose a user is performing a complex task (such as: a multiple choice quiz with 40 questions), with a time limit (such as: 30 minutes).

The elapsed time, and the time limit, are both displayed on-screen at all times.

Now, suppose the user is blind, and using a screen reader.

How should the time be communicated to the screen reader user during the quiz, so that they aren't surprised when the time limit is reached?

Some options that we've considered:

  1. Allow the user to navigate to the time field, so they can check whenever they need to. (basically: do nothing to address it)
  2. Announce the elapsed time, and the time limit, every minute. This would need to be marked aria-live=assertive to make sure that it doesn't get interrupted.
  3. Provide a special hotkey that the user can press to announce the time. Announce this hotkey when the quiz begins.
  4. Add a heading or ARIA landmark that allows the user to jump to this part of the page.

The goal of these solutions: while completing the quiz, the user should have a convenient way to keep track of how much time is left -- it shouldn't disrupt their workflow. But they shouldn't be surprised when the time limit comes up.

I haven't found examples of other people having solved this problem -- are there some examples of existing solutions?


If you are following WCAG 2.0, there is a specific guideline related to this, e.g. 2.2 Enough Time: Provide users enough time to read and use content

2.2.1 Timing Adjustable: For each time limit that is set by the content, at least one of the following is true: (Level A)

  • Turn off: The user is allowed to turn off the time limit before encountering it; or
  • Adjust: The user is allowed to adjust the time limit before encountering it over a wide range that is at least ten times the
    length of the default setting; or
  • Extend: The user is warned before time expires and given at least 20 seconds to extend the time limit with a simple action (for
    example, "press the space bar"), and the user is allowed to extend
    the time limit at least ten times; or
  • Real-time Exception: The time limit is a required part of a real-time event (for example, an auction), and no alternative to the
    time limit is possible; or
  • Essential Exception: The time limit is essential and extending it would invalidate the activity; or
  • 20 Hour Exception: The time limit is longer than 20 hours.

So in your solution, the first three bullets are likely to hold the answer. e.g. you must allow the screen reader user to extend the time because it will take them longer to assimilate the page.

The following techniques may be appropriate:

This 3rd bullet is probably the one you want to follow - you must follow SCR16 AND SCR1 to pass the criteria.

| improve this answer | |
  • Great -- I missed these parts of WCAG! However, this doesn't directly address the question -- how do we communicate the time limits in a convenient/non-disruptive way? We're handling time extensions as suggested in Understanding 2.2.1: "In cases where timing is not an intrinsic requirement but giving users control over timed events would invalidate the outcome, a third party can control the time limits for the user (for example, granting double time on a test)." Thus, the student can't extend their own time once the test starts, so a dialog with time remaining doesn't seem like the right way! – Jessica Knight Aug 31 '16 at 1:37
  • Someone using a screen reader is at a big disadvantage to non-screen reader user, so your design needs to level the playing field. 2.1.1 tells you everything you need to know, even with the design constraints you just mentioned. This UX:SO is not supposed to answer "how to implement" questions, but aria live regions and alerts will solve your screen reader problem. Have you read the Intent of 2.2.1 w3.org/TR/UNDERSTANDING-WCAG20/… – SteveD Aug 31 '16 at 9:20

I think combination of #2 and #3 that you have mentioned would be the best way. With one exception: instead of "announcing the elapsed time, and the time limit, every minute", I would personally prefer a bell to ring after every 5 mins. If you can make it configurable such that at the beginning of quiz, you ask the user for interval (1 min/5 mins/10 mins) that would be better.

The reason I would not chose to announce elapsed and remaining time after each interval is that the announcement itself will eat up few seconds of the quiz time and would be distracting for the user. Instead a simple bell would not take that much time and yet provide required notification. If user loses track of how much time has elapsed s/he can always use the hotkey to get it announced.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.