Designing For The 15%
--
Because “Accessible Design is Good Design.” — Steve Ballmer
One billion people, or 15% of the world, suffer from some form of a disability. A disability is defined as a condition in which one is impaired relative to the usual standard of an individual and refers to physical, sensory, cognitive and intellectual impairments, mental illness and several types of chronic diseases. Whether mild or severe, oftentimes, disabilities can negatively impact body structure and function, activity and/or participation. It’s for this reason assistive technologies exist.
Assistive technology enables and promotes inclusion and participation for people with disabilities and is designed to maintain or improve one’s ability to function independently and have a more “normal”, greater lifestyle. These technologies help facilitate their experience within their daily life, work, school and more. Assistive technologies range from hearing aids to prosthetics, and physical products similar to these are most likely the first ones that came to mind, but assistive technology can be intertwined in our personal devices through proper user interface design.
It’s essential to design specialized solutions for each of the four areas of disabilities impacted by web and mobile usability, which are listed below:
1. Visual
2. Cognitive, Learning & Neurological
3. Auditory & Speech
4. Physical
Visual Disability 👁
When regarding the term “Visual Impairment”, most people think of blindness, which affects 0.6% of people worldwide, however there are many other visual impairments suffered by many.
For example, low vision is defined as partial sight in one or both eyes and includes blurry vision, tunnel vision, central field loss and clouded vision and this affects 4% of the world’s population. For this group of people, features may lose their meaning. Blurry vision may cause text to be more difficult to read as it may appear fuzzy and some features may look as if they blend into the background and can be missed. Some features may even completely disappear to some users, such as those with peripheral blocked vision, and only the page’s central elements are able to be viewed.
The way content is presented on the screen is essential and it’s easy to achieve through settings users can control and through simple design iterations. The first way we can do this is to separate the content and structure. Placing key information in the central part of the screen and watching out for element sizing, spacing and visibility are simple ways to increase accessibility. Some people with more severe cases of blindness rely on audio translations, so it’s important to include informative details in text alternatives for images or videos.
Another example of a common visual impairment is color blindness, which involves difficulties in perceiving colors and may impact color brightness sensitivity levels and this affects 4.5% of the world’s population. Colors are also used in UX to signify importance for the typography or buttons, but for color-blind users, some colors may look too similar to the rest of colors used on screen and thus, color to identify meaningful features loses its importance.
Relying on color to convey information, such as red for error and yellow for warning, is not the best idea for color blind people. Instead, using color and adding the usage of icons and labels to demonstrate object meaning is a more communicative method. If relying on color, textures should be added. Sometimes, the colors green, red and brown, can look very similar to each other to people with protanopia, red/green color blindness, so adding pattern overlays to elements can decrease the risk of confusion. Also, using a monochromatic color scheme instead of three different separate colors can be a better idea due to the reasoning that variations in contrast and tones in a single hue can regain meaning to said elements. Designers can achieve this by relying on set color palettes, as well as following the WCAG contrast ratio guidelines in which they suggest a contrast ratio of at least 4:5:1 between a text and background.
Cognitive Impairments 🧠
Cognitive and learning disabilities involve behavior, mental health and neurological disorders that affect how well a person processes and understands information, which includes autism spectrum disorder, anxiety, memory impairments and more. The CDC states that 10.8% of people worldwide fall into this group. These types of people may have memory deficits, severe trouble focusing their attention adequately or difficulties solving problems.
Users with memory deficits struggle with long, complex processes such as a sign up, completing a purchase or searching for an item, generally processes that are followed in a logical order. Not only do we want a process that requires as little navigation as possible, but we want to help users focus their attention on the task at hand as well as help them remember each step of the process. Using specified progress indicators such as a labeled progress bar, labeled back and front arrows or simply writing out “Step 1 of 4” are easy features to implement to accommodate memory and attention deficits.
Focusing more on the group of users with attention deficits, they need more visual cues to highlight important points or sections of content, which includes getting rid of irrelevant content such as animations, distracting background noise or imaging and advertisements. Playing around with typography and content size draws the users back to the screen so they are able to capture essential points.
Having a problem-solving deficit means struggling to find solutions easily and being more prone to simple mistakes. Error prevention is one of the key components of great usability so emphasizing this component for this group is a must. Making error messages more detailed and making each action predictable and very easy to control is the best possible way to avoid errors. Using feedback to communicate with users by including informative pop-up messages, suggestions to spelling mistakes or a “No Results Found” are great ways to provide meaning to errors these users would make. Clicks and features should be accompanied by warnings or explainers, such as including detailed forewarnings before deleting a file or submitting a document.
Audio/Speech Impairments 👂🏼
Having a hearing impairment involves more than being deaf as it ranges from people having mild to severe hearing loss in one or both ears and can include hard of hearing, high or low frequency hearing loss, tinnitus and more. The WHO states that over 5% of the world suffers from said disability and although user interfaces rarely rely on sound, it’s still important to take into consideration.
This group of users need transcripts, volume controls, subtitles or sign language with media content as well as the ability to rely on online chats, emails and in some cases, Facetime calls. However, it’s very common for captions and transcripts to be missing or inaccurate, as well as more problems with low-quality and quieter audios.
People that suffer from hearing loss in any form oftentimes rely on other senses, which are stronger for them. Using haptic UX includes vibrations, which is oftentimes one way a mobile app may communicate with a user to represent an error or notification, depending on the length and pattern of the vibration, such as a longer vibration for a call and a shorter one for a text message. Notification sounds are usually paired with the vibration so focusing on the vibration by itself is a good place to start. Using colors and icons in pop up messages to represent errors stimulates visual learning so users don’t need to rely on audio. Highlighting a feature or certain words in different colors or simply bolding the matter can illustrate the tone and pitch of the element in substitute of audio, such as making a block of text red or adding a slight animation to it to signify a word count has been met, instead of a sound notification.
Using captions and subtitles generated by humans and not by AI ensures accuracy as well as conveying who is talking in subtitles is more easily comprehended. Not regarding accessibility issues, media companies publishing videos can make sure background noise is reduced, volume is clear and loud and can consider including a sign language translator. Google just launched an advanced version of live captions for Google Meets for those who are deaf; this is just the beginning of a breakthrough in AI for those who are deaf with a great measure for accuracy.
Physical Impairment ✋🏼
Many think motor disabilities wouldn’t affect using a mobile device or computer that much since it feels like we’re barely moving our hands or fingers most of the time. However, the WHO declared that 2–4% of the population suffers with a partial or total loss of functioning body parts, whether it’s Arthritis, Parkinson’s Disease or old age. These users are in need of an interface that requires very little quicks and simplistic movements that require minimum effort as they find using certain buttons, mouse or a touch screen difficult.
It’s important to create large clickable actions because features with a small hit area are frustrating for users who find it hard to control their mouse or fingers. This also goes hand in hand with spreading out features to decrease the risk of a user accidentally clicking the wrong element. Doing this combined with a phone screen or webpage being open for longer and eliminating short time-out periods, due to users most likely needing more rest time in between performing actions, has the best rate of success.
There are a lot of ways people without motor disabilities are able to control their fingers and hands. For example, on a lot of touch screens, users use force touch, which is when a user presses a bit more forcefully than usual on a certain feature to access more functions but those with a disability may find it difficult. More than just that, lots of typing, scrolling and clicking can result in tiredness and frustrations, so providing users with shortcuts is less difficult for long pages and processes. For the use of a keyboard, having keyboard shortcuts on to access some functions such as Cmd + S to save or Cmd + C to copy are easy ways to use shortcuts since the keys are placed closely together.
Another way to ease the process is utilizing vocal recognition to state needs and perform actions to eliminate the need of moving around as much as possible. Stating actions out loud gives users a chance to rest their hands and can help them complete actions much faster.
Time To Take Action…
It doesn’t take much to design a more inclusive user interface for those in need and this proves there’s even more of a reason for designers and developers to start considering the 15% from the beginning for an improved end result for the 100%. Utilizing structure, color and minimalism within features and functions creates an ease in which users process information in a quick and stress-free way. Humans are designed to want easier accessibility and usability within their daily routines, therefore designing for people with disabilities in mind from the start is an amazing practice to take on to maintain and improve this natural need. It’s time to start designing with the 100% in mind, not just the 85%.
Learn more about the 15% and more common worldwide disabilities here
