How to make your digital experiences accessibleVegard Ottervig on
Paying attention to accessibility in your websites and apps will boost SEO and help you stay compliant with regulations.
Accessibility is defined as the design of products, devices, services, or environments for people with disabilities. In terms of digital experiences this means websites, apps, functions, and features that are readable and functional for visually impaired, hearing-impaired, and other disabled people.
Make accessibility easier with a design system:
Government decrees make accessibility a priority even if you like it or not. Whether laws and regulations are the right way to go about accessibility is a valid, but different question. Here we deal with the factual matter at hand—the introduction of web accessibility regulation in both the EU and the US.
Accessibility often manifests as an afterthought in digital projects, introduced at the very end. A best practice is to start testing and building solutions right from the beginning of the project. In this way, you can get rid of errors early on and avoid costly fixes and cleanups.
Designers, content editors, and developers must all be aware of accessibility and what the standards entail. Ensuring digital accessibility is not just a job for the developer—CMS editors should contribute and cannot expect the technician to do all the heavy lifting alone. In other words: Acquire the right mentality and culture from the onset.
Finally, accessibility and search engine optimisation go together like hand in glove. If you want a business case for delving into accessibility, this is the one. Google ranks accessible pages and apps higher in the search results, thereby increasing your impressions and potential lead generation. Furthermore, making a broader group of visitors able to consume your content can be the final nudge leading to more business.
How to start
A good place to start is to read the Web Fundamentals Accessibility Guide by Google. In this introduction, you can read more about accessibility, teach yourself the standard Web Content Accessibility Guidelines, and understand users’ diversity. You can also dig deeper into topics like focus, semantics, ARIA, styles, accessibility reviews, and teamwork.
With this in mind, it is useful to know that it is impossible to create accessibility for everyone. A strategy toward visually impaired visitors might be counterproductive toward hearing-impaired, and vice versa, and a website in English must necessarily exclude all other languages.
You should, therefore, get an overview of your target audience—whom you are building a solution for. Making compromises is an inherent feature in accessibility projects, as is the knowledge that not everyone’s needs will be satisfied.
The accessibility project
Commencing an accessibility project does not have to be an especially daunting task. No special equipment is needed.
However, if visually impaired people are an important user group, you should test specifically toward and together with visually impaired users. Bear in mind that the focus often is on blind or colour blind users, but do not forget that users with normal vision can struggle as well—e.g. in regard to bright daylight and contrast on the website or app on a small smartphone screen.
Digital tools you can use to bolster your accessibility testing and auditing include:
Even though you might not strictly need an accessibility expert on your project, a hired skilled consultant might be valuable to perform an initial audit or assessment of your digital experiences. Also, make sure that at least one person on your team has sufficient knowledge about accessibility in order to guide his fellow co-workers.
Building features that are accessibility-friendly once and then forgetting about it is not an option. Accessibility must be tested routinely during your project and from the start.
Toward the end of the project, you should perform a complete assessment of all accessibility aspects, and not until everything is in order in this final stage are you finally able to rest on your laurels—at least until a future test potentially reveals a non-compliant feature.
5 quick tips to get you going
If accessibility seems overwhelming at first, these five tips may help you kickstart your project.
- Table headings should be marked semantically (WebAIM)
- Image alt text should be descriptive (AbilityNet)
Wrong: <img src="twitter.png" alt="Picture of blue bird">
Right: <img src="twitter.png" alt="Twitter logo">
- Headline order should be logical (Nomensa)
Use Wave to assess header structure.
- Hyperlinks should describe their purpose (Oregon State University)
Wrong: Gandalf is a fictional character from The Lord of the Rings. Read more
Right: Gandalf is a fictional character from The Lord of the Rings. More about Gandalf on Wikipedia
Video and audio should be subtitled (University of Washington)
Transcriptions may be easier than subtitles. Can be automatised.
Courtesy of our solutions partner Item Consulting.
List of resources
- Web Content Accessibility Guidelines (WCAG) Overview
- Web Fundamentals Accessibility Guide by Google
- WebAIM: web accessibility in mind
- Web Content Accessibility Guidelines on Wikipedia
- Web Accessibility by the European Commission
- IT Accessibility Laws and Policies on Section508.gov