When web content is accessible, it enables users to understand, navigate, and interact with the content on a web page. To encourage accessible websites, WCAG has accessibility guidelines in place. There is not a 'one-size-fits-all' approach to accessible web content as a disability can be auditory, cognitive, neurological, physical, speech, visual, or a combination. Therefore, content must be understandable through all senses, including visual, audio, and physical accessibility to remove accessibility issues.
People with disabilities use many tools, techniques, and assistive technology to customise their experience on the web. However, a website must be compatible with their tools and techniques, so they can be used or used well. Issues with access, navigation, or consuming content are all accessibility challenges that someone with a disability can come up against. In this blog post, we’ll cover techniques, tools and assistive technologies people use on the web and what improves their experience.
What are assistive technologies?
Assistive technologies (AT)(external link) are hardware or software enabling people with a disability to access and consume web content they otherwise could not. Additionally, as technology evolves, more assistive technologies are becoming more mainstream by everyone – you’ve probably even used some without knowing as they're built into phones and desktop devices. For example, the autocorrection of text messages is a common assistive technology since word prediction and spell checkers reduce cognitive load. Other widely used assistive technologies are Siri and Alexa. However, assistive technologies are far-reaching and cover a breadth of support including screen readers, screen magnifiers, and Braille displays.
What are adaptive strategies?
Adaptive strategies are the workarounds a person with a disability needs to make to consume web content. For example, someone with low vision will use assistive technologies such as a screen reader or a screen magnifier, to access the content on a web page. By using adaptive strategies, people with disabilities can customise their experience to improve how they can access web content often aided by AT.
What is a screen reader?
A screen reader is an assistive technology enabling those with difficulty seeing to interact with online content. Screen readers read web content aloud, and users can choose the speed and the language it speaks. They are operated through keyboard shortcuts or touch. A screen reader is useful for people who have:
- low vision
- blindness
- dyslexia and other reading disorders.
Additionally, if someone is deaf or hard of hearing, they can use a screen reader to convert web content to Braille characters on a Braille display device.
It can be easy to pick up simple actions to use a screen reader, but it does take time to grow in experience. Many devices have a free screen reader built in, otherwise, there’s the option to purchase other screen readers depending on desired capabilities. However, there’s the risk of the screen reader not being compatible with a user’s device or available in some languages.
What makes a website accessible for a screen reader?
A screen reader can only read the information provided. For example, if the text used to describe an image or graph in code known as alt text or alternative text doesn't exist, the screen reader doesn't know what's on the screen. Therefore, whoever is using the screen reader doesn't know either. No alt text can lead to them missing out on vital information.
Plus, if there are no navigational clues, such as list items or links, they can't skim the page and have to go through the entire web content to identify the relevance. Because this is time-consuming, they'll likely abandon their search or move on to a more accessible website.
What causes accessibility issues?
Accessibility issues can arise from many components of a website. The good news is these can generally be a quick fix, you just need to be aware of it. Please note, this is not a comprehensive list.
4 examples of accessibility issues
1. Low colour contrast
Approximately 200,000 people in New Zealand have colour blindness(external link), with about 1 in 12 men being affected. Colour blindness (colour vision deficiency) means they can’t fully ‘see’ red, green, or blue light, which means they aren’t able to distinguish the difference. Therefore, they require a high colour contrast for text and images. High colour contrast improves the readability of content for everyone. For example, black text on a white screen.
You can read more about colour contrast in our blog post.
Accessibility tip: the ideal colour contrast should be at least 3:1 for large text and 4.5:1 for regular text.(external link)
2. Videos without captions or transcripts
Adding captions or transcripts to videos is beneficial for everyone as they provide context. Captions enable you to access content if you’re:
- unable to play sound
- in a loud environment
- hard of hearing or deaf
- playing an image-based video as the captions enable a screen reader to read the content
- needing to improve focus if you have an attention disorder such as attention-deficit/hyperactivity disorder (ADHD).
It’s common for programs to automatically generate captions or a transcript for videos, however, as these are machine-generated, there is a chance of errors. When used, these should be a starting point rather than the final product.
Accessibility tip: It’s best to generate your captions or review machine-generate ones to ensure the content is correct.
3. Inconsistent and unfamiliar web design
The design of a website can be difficult to navigate and understand if it is unfamiliar or inconsistent. To have a consistent web design on your website consider the following:
- uniform appearance: such as the navigation bar doesn’t change on different pages
- consistent layout, look, and feel: each page has a similar flow of information
- familiar patterns: for example, the contact option is at the bottom of the page.
A consistent website design is beneficial because it:
- makes your website easy to use for everyone
- reduces cognitive load, especially for someone with memory impairments.
- makes it easier for someone using a screen reader or keyboard navigation to navigate content.
Accessibility tip: don’t reinvent the wheel. If a traditional page hierarchy works, you don’t need to create a new one, as the layout of your content should be logical and predictable.
4. Lack of keyboard accessibility
People who use a keyboard to navigate a website may have a repetitive strain injury or motor limitations meaning they’re unable to use a mouse. They’ll use the ‘tab’ key to tab through interactive elements like links, the play button for a video, hashtags, and buttons. They can also navigate through using the arrows on the keyboard to move up and down and left to right. To navigate with a keyboard there needs to be a clear indicator for what element is in focus, so the user knows where they’re on the screen.
Plus, voice commands also use the same elements as keyboard navigation, so improvements benefit those who use dictation as an assistive technology to navigate the web.
Learn more about keyboard focus and WCAG 2.2 guidelines in our blog post.
Accessibility tip: Consider how someone using keyboard navigation will find navigational elements without getting stuck. For example, infinite scroll which is often used in news feeds can make it difficult for users to get to the main navigational elements.
Make your web content accessible to everyone
When using the web, people with disabilities use a variety of assistive technologies and strategies to access content. So, to combat accessibility issues, begin by making the above changes to your website. Accessibility doesn’t have to be hard, so if you don’t have the in-house expertise, our team here at Catalyst are ready to help you. We are qualified on the DIA Marketplace for Web Accessibility and offer training, consulting, and support services for the government. Plus, we’re here to support enterprise and not-for-profit organisations too. So if you’d like to learn more about accessibility and how to improve your website, contact our team today.