It is estimated that around 0.2% of the world’s population is completely deaf-blind, and another 2% live with “milder forms” of deaf-blindness. This is screen reader text.
Generally, someone who is deaf-blind has concomitant hearing and vision loss, which cause severe communication and developmental issues.
For content creators and developers, it is essential to understand how people who are deaf-blind use the web, and how we can create web content that they can easily perceive and understand.
Article continued below.
Stay on top of web accessibility news and best practices.
Join our email list to get notified of changes to website accessibility laws, WordPress accessibility resources, and accessibility webinar invitations in your inbox.
Assistive Technology for People Who Are Deafblind
Braille Displays
People who are deaf-blind will often rely on touch for communication and understanding different kinds of content. When it comes to web content, deaf-blind users may use a refreshable Braille display in combination with a screen reader to operate a computer and interact with web content.
A refreshable Braille display is a piece of physical software that attaches to the bottom of a keyboard or laptop. It works by pushing small pins up into a line of holes to form Braille characters.
A screen reader is a type of assistive technology. It is a software program that allows blind web users to “read” the content of a page with either a speech synthesizer or braille display. Screen readers act as an interface between a user and a computer’s operating systems and applications.
When they work together, the screen reader sends a line of text to the refreshable Braille display. The appropriate pins pop up to form Braille characters for that line of text, and the user can read it. Once the user is done reading that line, they can push a button to go to the next line. The pins fall back down, and pop up (“refresh”) in a new configuration of Braille characters.
Design Considerations for Deaf-Blindness
In order to create accessible content for deaf-blind people, designers need to follow the same considerations that they would follow for both blind and deaf people.
Design Considerations for Blindness
Many of these considerations are required for screen readers, which are absolutely necessary for deaf-blind users.
Color Contrast
Some users with deaf-blindness do not have total vision loss, but low vision. Without enough contrast between the foreground and background colors, deaf-blind users may find it difficult to read the text. Having inadequate color contrast may cause a user to miss out on key information or stop them from being able to take the actions that you want them to take which could result in lost sales or lower conversions.
The minimum acceptable contrast ratio for WCAG 2.1 AA compliance is 4.5:1 for body text or any smaller font sizes 18 pixels and below. Text larger than 18 pixels or fonts that are 14 pixels and bold can have a contrast ratio of 3:1 and still be compliant. You can use tools such as WebAIM’s color contrast verifier to ensure that the colors on your website meet contrast requirements.
Keyboard Functionality
While most blind users are physically able to use a mouse or trackpad, they cannot see where the mouse is moving or pointing. This is why many of them use keyboards to navigate through a web page or web app. Your web content must be set up to allow for keyboard navigation.
Hierarchical Structure
Many screen readers will pull up a list of headings, subheadings, and other structural markers on the page. This allows screen reader users and keyboard navigating users to jump to different sections on the page, and shows the importance of all the elements on the page. Your web content needs to have the proper tags, such as <h1> for title level headings.
Proper Labels, Roles, and Values
Because custom controls don’t have any native semantic parts, you need to ensure that you have proper ARIA or HTML labels, roles, and values that change when appropriate. Without the labels and roles, screen readers cannot tell users what a widget is or what it does. Adding ARIA labels and roles, like for media volume or expand/collapse buttons, will allow screen reader users to access the controls, and use them as they were intended.
User Feedback
Screen reader users need immediate feedback after performing a command. When someone fills out a form, expands or collapses content, or opens up a new page or tab with a screen reader, they need to be informed. Make sure that your design has the proper tools in place to provide feedback that a screen reader user will be able to hear.
Video Descriptions
While blind people can hear what’s going on in a video (unless they also have an auditory impairment), they may miss key information because they cannot see it. If you choose to have videos on your website or web app, you may need to provide video descriptions to keep this from happening. A video description relays information that is shown in a video, but not explicitly stated out loud, so that blind users have access to all of the information in the video. You need to ensure that your design allows for video descriptions to be accessed wherever necessary.
Design Considerations for Deafness
Because deaf-blind people cannot see or hear videos, you must provide an alternative means of accessing video or audio information.
Video Captions
In almost all instances, videos that are included on websites are there because they provide valuable information that allows visitors to the website to better understand the content on the page or post. Videos can provide valuable information that helps people to understand the features of a product, see first hand how a recipe is made, or make a buying decision after seeing and hearing other customers speak about their experience with a product or service.
Without video captions, deaf web users may miss out on important information. Video captions must include any information that is conveyed through narration, dialogue, and sounds or sound effects.
It is important that you either write your own captions, or outsource the job to a professional, because auto-generated captions are much less reliable. There have been a number of lawsuits against companies and organizations that posted videos on their website or YouTube channel with only auto-generated captions. One recent notable example is the Harvard settlement with the National Association of the Deaf opens a new window, in which Harvard agreed to caption videos with missing captions and correct the incorrect captions on videos with automatically-generated captions.
You will also need to review your captions along with the video, because they should be synchronized with the video, so the correct caption appears when the sound it references is actually being spoken or generated.
Audio Transcripts
Any audio or video clips need to have transcripts. Transcripts present all of the information from the audio clip, including speaker names, dialogue, narration, sounds or sound effects, and music or musical cues. It is important to note that transcripts can be used for video, but they need to be supplemented with synchronized captions. Without synchronized captions, a deaf web user will not know exactly where the transcript lines up with the video.
While you will can write your own transcript, you may also want to consider using an auto-generated transcribing software, such as Empire Captions, Otter.ai, or Rev. If you do choose an auto transcript, you will need to read it over and ensure that the text matches up with the video, as it may not be completely reliable.
Example Scenario: How Accessibility Helps Deaf-Blind Web Users
This is Leah. She is deaf-blind. Leah is giving an online presentation at a university soon.
To ensure that Leah can answer questions from the online chat, the university has worked with Leah and chosen an video conferencing software that is accessible, and will work with her refreshable Braille display. They have also run a practice presentation to make sure that the presentation timing is correct and that all of Leah’s slides are displaying correctly. Because of their accessibility efforts, Leah’s presentation was successful, and she was able to answer all of the questions from the university students.
Now, what would happen if the university didn’t consider accessibility for Leah? What if the video conferencing software didn’t work correctly with her keyboard and she couldn’t answer questions? This would have been very frustrating for Leah, as she spent time preparing for the presentation. She may not want to work with the university again, which could have repercussions for their name and reputation. The students may be disappointed that they did not get a chance to ask Leah questions.
Keeping Accessibility In Mind
In our scenario with Leah, we saw how inaccessibility caused frustration for her, and could potentially cause problems for the university and their reputation. This shows how accessibility affects a wide range of people, not just those with disabilities.
If you’re ready to take steps towards accessibility, we can help. Please don’t hesitate to contact us if you have questions about general web accessibility recommendations, or how to make your website accessible for people who are deaf-blind. If you have a WordPress website and would like to start scanning for accessibility problems, check out our free WordPress Accessibility Checker plugin.
