Designing for accessibility can make your website better for everyone. In this article, we'll define motor disabilities and talk about web development strategies for improving accessibility for users with a motor disability.
For people with disabilities, the internet can be a lifeline that connects them to the world. Motor disabilities, in particular, can limit a person’s independence, especially in a society that routinely designs physical structures without regard to the concerns of people with disabilities. But on the internet, individual creators and developers can make their products more accessible to all their users, irrespective of physical ability.
The term “motor disability” applies to any condition that impedes sensation, movement, or coordination. Motor disabilities can result from several possible causes, including congenital conditions, illnesses, and physical trauma, but these disabilities tend to present similar challenges for users when they navigate the web.
Building an accessible web product for users with motor disabilities requires an understanding of the tools and strategies that these individuals are likely to employ when they navigate the web. People with motor disabilities may choose from a variety of assistive technologies, most of which either work with or emulate a keyboard interface. Despite the wide variety of motor disabilities, assistive technologies are often designed with broad purposes that can apply to multiple types of disabled individuals.
Common assistive technologies include:
Assistive technologies by themselves are not enough to make the web accessible to users with disabilities, and, in the next section, we cover three ways to make your website more accessible to users with motor disabilities.
Despite the availability of oversized and adaptable models, people with motor disabilities often find it impossible to use a mouse. Most assistive technologies that people with motor disabilities use emulate a keyboard in some way. By making your website effectively usable with a keyboard, you open up access to the users of these assistive technologies.
Start by following WAI-ARIA guidelines to make all elements on your web pages accessible via keyboards and keyboard emulators. Specifically, make sure that the keyboard focus elements are visible on your page with CSS elements.
Most motor-assistive technologies make use of isolated and small muscle groups. For example, those using a head wand engage their neck muscles for every action they make on a webpage or a keyboard. The mouth stick users select keys on a keyboard emulator with a movement of the mouth.
With small muscle groups used for every action, fatigue can become an issue when performing a task on your site like navigating to the end of a long list requires a lot of clicks or key presses.
To help people using assistive technologies, provide practical ways to navigate your site with only a few clicks. For example, by adding a way to skip to the end of long pages and long lists with a single click with a skip-to-content button at the top of your navigation bar.
Another way to reduce the keyboard clicks needed for navigation on your website is to structure your navigation menus as a multi-level tree. Instead of scrolling through an entire list of available pages, your users can jump to the section of the navigation that they are looking for with only a few clicks.
Some users with motor disabilities use a voice recognition system. While those systems make it easier to navigate a webpage, it’s easier to type a phrase into a text field via speech recognition than it is to click specific elements on the webpage via voice control.
Search functionality is generally already present on most websites, and everyone can use it, not just those with motor disabilities. To take full advantage of this strategy, you also need to make sure that your pages are indexed, and that the sorting of the search results is helpful.
Making your webpage usable by those with motor disabilities often boils down to designing each element so that it’s effectively usable with a keyboard. Accessibility-oriented developers should also avoid functionality that relies exclusively on mouse control as well as build in shortcuts, like skip-to-content functions and focus elements, that help alleviate fatigue in users with motor disabilities.
Most importantly, educate your creative team about the nature and challenges associated with motor disabilities, and be sure to design and build projects with accessibility in mind from the earliest development stages.
We have created a comprehensive whitepaper on accessibility for developers that covers everything from laws to coding to testing.
Download the whitepaper: Accessibility for Developers
One easy way to make sure that you are creating accessible web apps is to start with components from the Kendo UI libraries. Our components are all WCAG complaint and give you great functionality from grids and charts to schedulers and pickers. Get a head start on your app's UI and a head start on accessibility compliance at the same time.
Learn more about: Kendo UI
Chris Ward explains cool tech to the world. He is a technical writer and blogger. He has crazy projects in progress and will speak to anyone who listens. You can talk to him! :)