In this week’s DigiKnow blog, we look at visual content, accessibility and best practice. Visual content can be used in digital documents, slides, PDFs, etc., on the Internet or in social media posts.
What is visual content? It’s anything that conveys information to your audience that isn’t in the form of text, i.e.:
- photograph;
- cartoon / diagram;
- logos / icons;
- text as imagery (word-clouds);
- chart / graph;
- video / animation.
Decorative v Informative Images
Decorative images may be used to improve the design of a document / slide or page. They don’t add to the information being displayed, thus decorative images do not require Alt Text.
Informative images do need Alt Text as these have been inserted in place of text, and thus are crucial to the understanding of the content.
One issue that screen reader users face is screen reader ‘noise’. If every image had Alt Text completed, screen readers would read out everything, whether it’s relevant or not.
Whilst it is best practice to make all content accessible, ask yourself: Is the image decorative, or does it improve the understanding of the subject? This will help determine whether the Alt Text is required to be completed.
Alt Text
Regardless of what visual type the content is, remember to complete the Alt Text (alternative text) titles and descriptions per informative item. This increases audience reach by including users of screen readers (people living with visual impairment).
Titles should be short and relevant, descriptions should be apt and describe the content in a meaningful way. The length of description will be different for each item, i.e., a logo description will be shorter than a photograph description.
Alt Text can be used in many pieces of software that support visual content, and it is also available on Canvas, web pages and social media. If you’re creating web content, Alt Text is very important and should be completed appropriately.
An example of why Alt Text should be completed (in internet terms), some browsers may not load images, or images may be missing. Everyone can read the Alt Text if it’s available.
Best Practice
Here are some tips to increase best practice for Alt Text in visual content:
- Use appropriate titles / descriptions;
- Be subject specific, the visual context will help with descriptions
- Don’t start descriptions with “picture of“. Screen readers will identify the item as a picture;
- Ensure Alt Text fits the information provided and doesn’t distract users;
- Don’t duplicate text from the main body, this makes the Alt Text redundant;
- Whilst there is no set limit for Alt Text, a good rule of thumb is to limit Alt Text to 125 characters;
- Avoid text in images.
Complex Visuals and Alternatives
Graphs / charts / organisation charts, etc., may contain complex information. Accessibility guidelines suggest the information (in graphs, charts, etc.) must be accessible to all audience members.
For audience members living with blindness, Alt Text descriptions may exceed the guideline of 125 characters for Alt Text. The solution is to provide the same information in an alternative format, i.e., in an accessible table, as seen below:
2018 | 2019 | 2020 | |
---|---|---|---|
Mac OS | 100,000 | 150,000 | 325,000 |
Windows | 250,000 | 350,000 | 375,000 |
Linux | 50,000 | 60,000 | 75,000 |
Unix | 23,000 | 49,000 | 97,000 |
For audience members living with visual defects, i.e., colour blindness or contrast issues, do consider different colours and patterns.

Whilst this is colourful, and sighted viewers can determine the data detail, a person living with low contrast defects may see the information as defined below. In this instance, there isn’t much contrast and this may confuse.

A better use of colour can be seen below on the left. Although it’s all blue, it uses dark, mid and light blue. When this is desaturated, a person with low contrast can still determine the information.

I’ve used the same information displayed as a line chart. The bad practice example is below, showing a lack of contrast.

And a better practice can be seen below. This is where the line styles are different types of dashes. The colour becomes irrelevant.

Social Media
Finally, did you know that social media posts can be more accessible? If Alt Text titles and descriptions can be added in software applications, why not extend those best practices to social media use?
Regardless of the social media used, add image descriptions. Videos should include captions/subtitles. Use slightly larger text if possible. Hashtags can be used for searching.
These practices can really widen your audience reach.
You may have noticed video accessibility didn’t get a big mention here. This is the theme of next weeks DigiKnow blog. We hope you can join us next week for the next post.
Do follow us on Twitter @MDBSelearn.
0 Comments