So much of the world we experience is now digital. Ensuring that all the technology, digital products and services we create are accessible means that everyone has equal access, and everyone is included. The last thing you want is for your digital products and services to become digital barriers. To prevent these barriers from occurring, one of the tools we need to have in mind when we design, write, or develop are screen readers. They're an important tool for users who are blind or have low vision and can be helpful for others as well.
We’ve written about screen readers and assistive technology before, so today we’ll explore what screen readers are, how they work, and share a checklist of things you can do to make sure that your work can still be understood by them.
Let’s start with an informal screen reader demonstration that Jodie Hoger gave at our Accessibility Ambassador’s meeting on the 22 February 2024. Jodie is a screen reader user, disability advocate and manager at TAFE NSW.
Assistive tech for blindness or low vision
Broadly speaking, assistive technology is software or a device that makes it easier to complete a task.
If a person is blind or has low vision, they may use a screen reader. They may also use a refreshable braille display, a high contrast filter, a screen magnifier, or a combination of these.
The Text To Speech function on your computer is helpful for multitasking or easing eye strain. However, it's important to remember that it's not a substitute for a screen reader, which is essential for many users who are blind or have low vision.
What are screen readers?
Screen readers are software applications that translate text and give instruction on how to interact on a computer screen. This enables users to do things like navigate a website, pay a parking ticket or read a document online.
Screen readers have been developed for people who are blind or have low vision, but screen readers are used by a broader range of users as well.
How screen readers work
Screen readers interpret the code and content of digital interfaces and convey that information to the user. To do this the screen reader looks at the underlying structure of a website or document, such as headings, links, buttons, form fields and other elements. It’s really important that our digital content has good structure, so that everything is read out in the right order.
This information is then provided by having the person’s computer convert the text to speech or by transferring this information to a refreshable braille display that can be read by a person who can read braille.
To use the screen reader, the user navigates the digital content using their keyboard. They can also adjust the speed, volume and pitch at which the content is read out to them.
Popular screen readers
There are many different brands of screen reader software on the market. They all have slightly different features and keyboard commands. Review their features to decide which one suits your needs.
Creating digital documents, products and services for screen readers
Designing and writing with screen readers in mind is crucial for creating inclusive digital experiences. It doesn’t cost any extra to do these the right way from the start. Here are some best practices to consider and links to how to implement them.
- Plain language: Write in simple language that everyone can understand and make sure that your content is structured well.
- Heading structure and naming: Whether it’s in a document, a website or a software application, screen reader users often use the heading structure to navigate to the parts of a document or website they are interested in. Use heading styles for headings.
- Semantic coding: This is the practice of using elements of programming code that convey meaning and structure to a user’s web browser. To continue the heading example: use the correct HTML (Hyper Text Markup Language) heading tag for this. Don’t just increase the size and make the text bold. Check your code using an HTML validator.
- Alt text: Include descriptive alternative text for images that aid in understanding the text or if it provides meaningful context. You can use an alt text decision tree to help you work out which images might need alternative text or which should be marked as decorative.
- Write descriptive link text: Clearly indicate the destination or purpose of the link. Avoid generic phrases like ‘click here’ or ‘read more’ that lack context.
- Create accessible forms: Ensure that forms are properly labelled and provide instructions and error messages in clear concise language. Check that when you tab through the form, each field is in the correct focus order.
- Tables you can navigate: Create proper table structure by using header rows and columns means a screen reader can announce the right information for each cell.
- Consistent navigation: Maintain consistency in navigation and layout to help uses orient themselves within the content. Clearly, delineate sections, provide skip navigation, links, and ensure that the tab order follows a logical sequence.
- Keyboard only navigation: Don’t rely on interactions that require the use of a mouse. Ensure all interactions can be completed just by using a keyboard.
- Screen reader testing: Check that your content can be read and your interactions all work using a screen reader.
- Usability test with an inclusive cohort. They will give you great feedback to make your work even better.
There are a few things to consider when designing and writing for screen readers, but it’s all achievable and can make a big difference to the way a lot of users experience your work.
Visit the Accessibility and Inclusivity Toolkit to learn more about making your work accessible.