Digital Accessibility is creating content that can be consumed by the widest possible audience, including those with disabilities. It includes the code that runs websites and other digital services, and the content contained on those services.
The most holistic way to think of accessibility is to better understand some common types of disability, and how your web services can be set up to support the assistive technologies used by people with disabilities. This document lists some common disabilities, and ways you can design your websites and online content to be more easily used by people with disabilities.
Limited Vision
- Blindness or limited vision that cannot be sufficiently improved by corrective lenses
- Limited color vision, such as not being able to distinguish between reds, yellows, and greens, or complete color blindness
- Limited vision based on certain conditions, such as have significantly reduced vision at night
For people with limited vision, ensure all visible page elements have sufficient color contrast. Developers can use relative em or rem font sizes instead of absolute pixel values, to ensure fonts scale appropriately for readers who use high zoom levels or screen magnifiers. Select fonts that are highly readable. For visitors who utilize screen readers, make sure the site HTML reflects the layout of the page, so the screen reader can parse it correctly, and verify all media items have appropriate captions and/or alt text.
List of highly accessible fonts (external link)
Limited Hearing
- Limited or complete loss of hearing, either in one ear or in both ears
- Inability or limited ability to hear sounds within certain ranges within the standard human hearing range
- Tinnitus
Provide captions or transcripts for all audio and video recordings. Do not use media that starts automatically on page load (autoplay); have the user manually select to start playing any recordings. When possible, avoid videos where background music plays over people speaking.
Motor and Vestibular Disorders
- Difficulty lifting and grasping objects
- Missing fingers or limbs
- Difficulty with fine motor skills, such as caused by Parkinson’s Disease
- Dizziness, vertigo, or other conditions that affect balance
Verify that all elements on the page can be navigated to, and interacted with, using the tab button on the keyboard. No functionality should require the mouse. Pay special attention for forms and content in Iframes. Pages should have a jump to content anchor link for people who navigate via keyboard, so they don’t need to tab through the top navigation every time they visit or refresh a page.
Make sure the hitbox for any icons or buttons are large. This is especially important on mobile devices where users physically touch screens. Buttons should be large enough, and spaced far enough apart from each other, that a user can consistently tap interactive elements with their thumbs without missing the element entirely or mis-selecting adjacent elements.
Minimize animations unless necessary. Parallax images, image sliders, and auto-playing videos should have the option to be turned off for users who find this functionality disorientating or distracting.
Emotional / Mental
- Anxiety
- PTSD
- Epilepsy
Consider the audience of your website when designing its content. The concept of Designing for Crisis implores us to design our websites and web content such that someone under extreme duress could find what they are looking for with ease. Designing for this extreme case will make the website easier to navigate for everyone. Visual gimmicks like popups with a countdown, or other features that imply the site visitor has a limited-time opportunity for some special service, are not appropriate for site visitors who may be under stress.
Make sure your site (including videos) does not contain any flashing lights.
Cognitive
- Dyslexia
The copy of your website should be as simple as possible. Avoid jargon and use dyslexia-friendly fonts. Text-heavy pages are more readable if the copy is split into two columns; the ideal line length is 45 – 75 characters.
Consider that some of your audience may not be students, or may be international students who speak English as a second language.
Temporary / Situational Disabilities
Disabilities are not limited to permanent or irreconcilable conditions. Having an accessible technology presence also means designing for people who might have temporary or situational disabilities.
Use motor/touch disability as an example.
- Permanent – a person who was born with only one arm.
- Temporary – a person who was recently in an auto accident and has one of their arms in a sling for a month.
- Situational – a new parent who spends a lot of time holding a baby in one arm.
Almost everyone will have a temporary or situational disability at some point in their lifetime. Fortunately for technology managers and website owners, the changes you make for people with permanent disabilities will likely have substantial or complete crossover with accommodations you need to make for those with temporary or situational disabilities.
This returns us to the theme of accessible design is good for all.
Concurrent Disabilities
Some people have two or more disabilities at the same time, including a combination of permanent and temporary or situational disabilities. The number of potential combinations is very large, and there are not prescriptive solutions for every novel combination of disabilities.
Thus, it is important to view accessibility as an iterative process. No single set of tools or checklists may ever capture every potential use case, and it is our responsibility to continually be receptive and accommodating to the way people use our digital resources.