What are screen readers?
Screen readers are a form of assistive technology that helps those who are blind or partially sighted to access content presented on the web.
Screen reader software attempts to convert visual information on a screen into a non-visual form. It provides a mechanism for blind/partially sighted people to access what is being conveyed in images. The way that we can interact with this technology and make it effective is by providing meaningful alt-text for images present in courses on the FutureLearn platform.
What is alt-text?
Alt-text is a text-based description of an image that can be picked up by a screen reader and converted into a form (often audio) that the user can access.
Alt-text doesn’t just help those with little to no vision. We know that a substantial proportion of our learners access our courses on mobiles and have limited access to mobile data. Alt-text can be helpful to those learners who have ‘turned off’ images in order to conserve data, and it also assists search engines.
- Alt-text should describe the image. It might sound obvious, but essentially this is the purpose of alt-text.
- It should describe the image in enough detail to make it meaningful. Imagine that you are unable to see the image. What features would you need described to you for you to understand it fully?
For example, consider the alt-text for the below image from a fictional course on colours of bird eggs: “Two eggs in a nest”
Whilst essentially describing the image, there is useful detail in the photo that hasn’t been captured by the alt-text.
Adding in some more detail helps to provide a richer experience, for example: “Two small, bright turquoise-coloured Bullfinch eggs sitting in a nest surrounded by green foliage”.
- At the same time, the alt-text should be concise and not describe absolutely everything in the image, unless relevant and in the context of the rest of the content. For instance, for the example above, we might not include details about the species of tree the nest is resting in.
- Context is key. If the example image was in a course on species of trees, the species of the tree featured in the image would definitely be a key point to mention in the alt-text.
- End alt-text with a full stop. This causes the screen reader to pause briefly after the last word of the alt-text, which makes for a more pleasant reading experience.
- Don’t include the name of the photographer, or any copyright information. The alt-text should simply describe the image.
- There’s no need to start alt-text with ‘photo of…’ or ‘image of…’. Screen readers automatically add this as a default.
How can I add alt-text to images in a course?
Alt-text can be easily added to images in Course Creator. For images at the top of article steps, simply add alt-text to the box below the image uploader.
For inline images, alt-text can be added in square brackets (as described in our inline image hosting instructions).
Can I get some more guidance on alt-text?
This post was informed by 'Alt-texts: The Ultimate Guide' on Axess Lab's website. For further useful guidance, check out the W3C's Web Content Accessibility Guidelines (WCAG).