The U in the POUR principles of accessibility stands for “understandable”. Users should have no problems in understanding how to read the chart, understand why the chart is shown to them and take away its key message. As a chart author you need to make the life of the viewer as easy as possible.
A good chart should have a title that summarises the key message of a chart. Other text elements, like a subtitle and annotations can clarify the purpose of a chart, and how to read and interpret it.
Research has shown that the title of a visualisation is very important in communicating its purpose: it is often the first thing people look at in a visualisation, and what people remember best after being exposed to the visualisation. When a user is using a screen reader and the title of the visualisation is accessible to it and positioned correctly in the document (see the Accessible HTML module), the title will also announce the visualisation.
So the title of a visualisation should not be a generic one, like “Share of renewables in energy used for heating and cooling”, but should instead communicate what the user should look for in the visualisation and what to take away from it, like “European Union slowly on its way to greener heating and cooling”.
Source: Maarten Lambrechts, CC BY SA 4.0
Source: Maarten Lambrechts, CC BY SA 4.0
As a general rule for any content aimed at a broader public, text should be clear and free from jargon and acronyms. This also applies to any text used in data visualisation, for the chart titles and any other text contained in a visualisation.
The units the data is expressed in should be provided and should be unambiguous. Without units, it is impossible to understand a chart and get some insights from it. Axes should be clearly labelled, and a legend should be present to explain any encoding that might require it (like a colour legend when direct labelling is not possible, or a legend explaining how visual elements are sized, for example).
For less common chart types, a clear explanation should be provided to explain how the chart should be read. Annotations and arrows can be used to explain what the positioning of elements means and how values can be read from the chart. Explaining the positioning, size, colour, … of a single data point (like a single country in a visualisation in which multiple countries are represented) can help the reader in interpreting the other data points in the chart.
An example of a scatter plot with clearly labelled axes, a colour legend and an annotation explaining how the chart should be read. Source: projects.fivethirtyeight.com/435-representatives
When a chart contains interactive features, they should be obvious and explained explicitly. When an interactive feature causes a visualisation to update, the changes should be easy to follow. When a change in the data or a change in the encoding is meaningful, changes should be animated.
More guidelines on implementing accessible interactivity can be found in the Accessible HTML module.
When a visualisation is published as an image in a web page, the image should have an alt
attribute set to it (”alt” stands for alternative text). More on alt text can be found in the Accessible HTML module, for now it suffices to mention that alt text is read out by screen readers when they encounter an image in a web page. Many web pages and social media, like Twitter, also display the alt text if the user chooses to read it.
<aside> 🔗 Click on the “ALT” button in the bottom left corner of the image embedded in this tweet to display its alt text.
</aside>
So the alt text provides an opportunity to describe the content of a visualisation to people who can’t, or don’t want to, see images in a web page. Many guidelines exist to write alt text for images, but data visualisation are images with a very specific content and purpose. So alt text for visualisations deserve some special attention.