WCAG 2.1 Article 2.2.1

Hi guys. Josh with Online ADA here. In this video we’re covering article 2.2.1, which is ‘Timing Adjustable’. It’s a level A requirement. This is kind of a long description here, so bear with me as I get through it for you. 

This success criterian reads, ‘For each time limit that is set by the content, at least one of the following is true. 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 10 times the length of the default setting. Or, extend. The user is warned before time expires and is given at least 20 seconds to extend the time limit with a simple action. For example, pressing the space bar, and this user is allowed to extend the time limit at least 10 times. Or, real time exception. The limit is a required part of the 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. This is the last one. The time limit is longer than 20 hours. 

That was sort of description guys. Sorry about the length of that but thanks for sticking with me. The big takeaway of this, is that we wanna be able to accommodate everybody who comes to our site. Whether they have physical disabilities and take a bit longer to fill out the forms or interact with the activity. Or if we have someone with low vision who has difficulty discerning to layout or takes just more time to understand what’s happening there because they’re looking for all the different controls. 

There’s folks with cognitive disabilities who have difficulty understanding the layout and how the content fits together and they just need a little bit more time. And then there’s also folks who have have English as a second language. Or maybe they have a sign language interpreter and that information needs to be conveyed to them. So it doesn’t make sense to have, let’s say, like a 15 second timeout on a form if that user is needing more time. Or if you do have a 15 second timeout, then you wanna be able to give them an option to extend it. 

A really good example that they had in here was being able to press the space bar when they’re presented with the timeout. Maybe they’re sitting there reading a lot of content and the form hasn’t been interacted with in, let’s say, 10 seconds and it starts its timeout maybe for security purposes. So you got 15 seconds that user now is presented with ‘Hey, you’ve got 15 seconds left. Please interact in some way.’ They can hit the space bar and either it goes away and extends it for another 15 seconds or it provides them some means of controlling that time out. Maybe they can hit the space bar a couple of times and they can see that timeout incrementally grow, again, up to 10 times, so 150 seconds would be that maximum there. 

So there are times when it doesn’t make sense to just arbitrarily set a giant timeout, like 10 minutes for instance, especially if you’re in a setting like at a school and you’re accessing your bank information Or, maybe an important school project. Or, if you’re at an Atm, right? Security concerns come into play here and we don’t wanna just have an arbitrarily designed 10 minute timeout. That wouldn’t make a lot of sense. The customer walks away. Their information is available to the next person in line because they didn’t sign out, that happens a lot, and it’s just available for 10 minutes. So you wanna still have whatever your normal timeout is. We just wanna have some way of interacting with it, with keyboard, to extend it out 10 times. 

This does not cover content that you, as the author of the site, does not have control over. So, server redirects, if you are presenting a 300 error and the customer is redirected somewhere that’s an instantaneous thing. It’s not a timeout, so that’s not covered here. Specifically outlined in the documentation. Also things like browser timeouts. If the browser is presenting some sort of timeout that you, as the author didn’t initiate then that’s not under your control either. You don’t have to worry about that. 

But there are things that do fall under your purview and that you are required to present to folks. Some mechanism for increasing. And I’m gonna read a couple of those because they outline them really well here in the documentation. So the first example is, a website that uses a client side time limit to help protect users who may step away from their computer, like we talked about, after a period of inactivity, the web page asks the user if they need more time. If it doesn’t get a response then it times out. 

Another example, a web page has a field that automatically updates with the latest headlines in a rotating fashion. This is an interactive control that allows the user to extend the length of time between each update to as much as 10 times the default. The control can be operated with either mouse or keyboard. And then the last thing here, the last example I read, is a web page that includes an animation, which includes text that appears and disappears throughout. 

In some cases the text is scrolling across the screen and in others is only displayed for a short time before it fades into the background. The page includes a pause button so that users who have trouble reading the text before it disappears, can read it. There are also times, as outlined in the description, where it doesn’t make sense to provide a timeout limit or some way of extending the time out, such as an auction site or an online ticketing site also examples in the documentation if you wanna read further into those. But it wouldn’t make sense to provide one user with an advantage by extending that buying, by in time limit because they have a disability. That is one of those situations where you wouldn’t want to provide a mechanism for extending that time period. 

Or in the case of an online ticketing sale, maybe extending that time limit doesn’t make a lot of sense because that hurts the overall business of that sale. You know, you you have these tickets that are sort of on reserve for, let’s say two minutes and the customer hasn’t interacted with it in two minutes. Well because they’re reserved other people can’t buy those tickets, so after two minutes they go back to the general pool and then other people can now buy those tickets again. That’s a, that’s something I would call essential and it’s actually outlined in the documentation as essential. So it would make a lot of sense to have some alternative for extending that time period for that user. 

Anyway, those are some examples straight from the documentation. This one had a lot of content to consider and I do feel like it’s pretty straightforward though, but if you need more information about it, you can go to the W3C.org website and look up this article and it’ll give you some more information and a lot of really good examples and how you might not criteria, things to check against. 

Thanks for joining me. I’ll see you next video.