Hey everybody. Josh here with Online ADA. In this video we’re covering article 2.1.1, which is ‘Keyboard’. This is a level A requirement and is going to cover how to make your website accessible with the use of the keyboard. Let’s jump in here.
All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes, except where the underlying function requires input that depends on the path of the users movement and not just the end points. I’ll touch on that in a minute. There are two exceptions to this, or two notes about it. So read those as well. Note one, ‘This exception relates to the underlying function not the input technique, for example using handwriting to enter text. The input technique, handwriting, requires path dependent input, but the underlying function text input does not’. And note two, ‘This is not forbid and should not discourage providing mouse input or other input methods in addition to keyboard operation’.
So the first thing I wanna touch on, is that phrase, ‘except where the underlying function requires input that depends on the path of the user’s movement and not just the end points’. It’s specifically stated in the WCAG article that this is included specifically to separate those things that cannot be reasonably controlled by a keyboard. For instance, like a bamboo tablet. Being able to draw in a program using a pen device and a tablet. You couldn’t reasonably recreate those functions with just a keyboard. So that’s why that particular phrase exists and that’s what that’s meaning, is just separating those obvious differences that can’t be duplicated.
Furthermore, I wanna touch on the fact that this helps out a lot of different types of disabilities. People who are blind and they cannot use devices such as mice that require hand eye coordination. People with low vision may have trouble finding or tracking a pointer indicator on a screen. And then some people with hand tremors find it very difficult to use a mouse, especially when the mouse has got such high sensitivity or something. If they’re maybe unable to control that sensitivity. It’s just a good idea to provide multiple ways to operate your site or your application.
There are a lot of examples of how this can be utilized. They have a lot of them here on the WCAG documentation.I’ll read off a couple of those. But it’s important to understand, sort of, the basic use of this article and that is whenever you have a button on your site, let’s say a form submit or even just a link. If you can click on it to operate it, you should also be able to tab into it and then hit enter to operate, as well. It’s just whenever you have an on quick event in your Java script, make an ‘on focus’ and ‘on enter’ event as well. There are a lot of Aria roles. Aria is the Accessibility Rich Internet Applications. Did I get that right? There’s a lot of Aria roles that can be applied to various things, like tabs or accordions in your website and those things are mandatory. You have to have keyboard focus and control of those elements. That’s just part of what is implied by using those roles. So if you’re labeling things and creating those associations, going back to1.3.1, properly then you are also including those keyboard controls.
So a couple of examples that they provided here are something like a drawing diagram. A drawing program allows users to create size position and rotate objects from the keyboard. A drag and drop feature. An application that uses drag and drop with the mouse also supports cut and paste or form controls to objects. And then the last one I’ll read here is, ‘Moving between and connecting discreet points’. The a connect the dots program allows the user to move between dots on a screen and use the space bar to connect the current dot to the previous one.
Those are some examples of how we can implement keyboard usage in areas that are typically designed for mouse usage. Sort of thing outside of the box on some of these, but, where there’s a will there’s a way. We gotta make sure we’re making everything as accessible as possible and just keep that in mind when you’re building and designing these interfaces, okay?
Thanks for joining me and I’ll see you in the next video.