Write alternative text for graphs, charts and diagrams

Screen readers are a type of assistive technology used by people who are blind or have low vision, and are unable to read the content of graphs, charts or diagrams displayed as images. They can, however, read alternative text that summarises an image effectively. It’s important to write alt text to convey a detailed explanation of the data, trends and key insights presented in a graph to deem it accessible. For more complex images, an image description might be needed. 

Summary

Need an introduction to alt text and why it’s important? Read our resource on Alternative text: accessible practice.

Use one of the following 3 methods to create a text-based alternative that can be read by a screen reader: 

1. Very simple graphs, charts and diagrams can be summarised by using an alt-text description or providing the same data in list form on a linked page 
2. More complex graphs and charts need to be represented in table form on the same page
3. Diagrams should be accompanied by a text description that explains the content, which:
   • ensures that the information can be accessed by both screen reader user
   • is relatively easy to implement
   • improves the accessibility for all students regardless of their access needs

Useful tip

Writing alt-text descriptions of complex material requires an understanding of the content and access to information about how to write effective alt-text descriptions to make them accurate. 

Bar charts

• Bar graphs should be converted into accessible tables
• Briefly describe the graph and give a summary if one is immediately apparent
• Provide the title and axis labels
• It is not necessary to describe the visual attributes of the bars (e.g. dark blue, light blue), unless there is an explicit need such as an exam question referring to the colours 
• Provide the title and labels
• It is not necessary to describe the visual attributes of the bars unless there is an explicit need 
• When working with double bar graphs: 
  • explain the data on the x-axis and the y-axis and summarize the overall trend
  • List the data in bullet form
  • Use the appropriate vocabulary in context with the surrounding text depending upon depending on age/grade level (e.g. using the word ‘about’ and not ‘approximately’ for a lower grade level, and is consistent with surrounding text) 
  • Although the bars on the chart reach approximate numbers, giving specific numbers makes it less wordy and more meaningful

Example of accessible bar graph

• Alt text: Vertical bar graph. Refer to image description below. 
• Image description: Figure 1 is a bar graph that measures cheese consumption per capita in the top four cheese eating countries from 2017 to 2021. The consumption increases and decreases in different years. The data is summarized in the following table:

	2017	2018	2019	2020	2021
France	52	58	60	58	69
Germany	53	53	55	53	62
Luxembourg	49	55	57	53	59
Iceland	47	54	55	53	69

Line graphs

• Line graphs should be converted into accessible tables
• Briefly describe the chart and give a summary if one is immediately apparent
• Provide the title and axis labels
• It is not necessary to describe the visual attributes of the lines (e.g. solid, dashed) unless there is an explicit need such as an exam question referring to these attributes; in the below case, with just two lines, the added description is not a burden to the reader

Example of an accessible line graph

• Alt text: Line graph. Refer to image description below. 
• Image description: Figure 2 is entitled ‘Australian Cheese Trade’. There are two lines on the graph, a solid line labelled ‘Exports’ and a dotted line labelled Imports. The vertical axis is labelled ‘Millions of Dollars’, beginning with zero to seventy, in increments of 10. The horizontal axis is labelled ‘Year’ and lists all the years from 2013 through 2023. In the graph, the ‘Exports’ line begins in 2013 at 26 million dollars, rises steadily to 35 million in 2017, drops to 15 million in 2021 then rises to 34 million in 2022. In the graph, the ‘Imports’ line begins in 2013 at 44 million and rises steadily to 56 million in 2020, drops to 20 million in 2021, and then rises to 60 million in 2022. The data is summarised in the following table. Figures are in millions of dollars; all data is approximate. 

	2013	2014	2015	2016	2017	2018	2019	2020	2021	2022
Exports	26	27	25	25	26	29	35	30	15	34
Imports	44	46	49	51	52	53	53	56	20	60

Pie graphs

• Pie graphs should be converted into accessible tables
• It is not necessary to describe the visual attributes of the charts (e.g. red wedge, blue lines) unless there is an explicit need such as an exam question referring to these attributes
• It is helpful to list the numbers from smallest to largest, regardless of how they are presented in the image

Example of an accessible pie graph

• Alt Text: Pie graph. Refer to image description below. 
• Image description: Figure 3 is a Pie Graph that shows the percentage of different fillings in a spanakopita.

SPanakopita fillings	percentage
Onions	4%
Eggs	6%
Ricotta	10%
Feta	35%
Spinach	45%

Cartesian (X-Y) coordinates

• State what type of graph is shown
• Describe the x-and y-axes and what they represent
• Write out the points in bullet form
• Depending on how important the data points are to the central teaching point of the figure, the comma between the x- and y-coordinate may be written out as the word comma

Example of accessible X-Y coordinates

• Alt Text: Cartesian (x-y) coordinates graph. Refer to image description below. 
• Image description: Figure 4 is a line graph with the x-axis labelled Cheese Volume (cm^3) and goes from 0 to 10. The y-axis is labelled Cheese Mass (g) and goes from 0 to 10. There is a formula stating slope equals to rise over run which equals to 2 grams divided by 2 cubic centimetre which gives you a slope of 1 gram per cubic centimetre. There are 7 data points plotted on the graph, which rises from left to right. The data points are (1,1), (3,3), (4,4), (6,6), (7,7), (9,9), and (10,10). From the point (4,4) to (6,6), the run equals 2 cubic centimetres and is 2 units to the right. The rise equals 2 grams and is 2 units up. 

Geometry diagrams

• Traditional descriptions of math diagrams benefit from descriptions that are brief and specific.
• Organize the description in a linear fashion, for example moving left to right and use bullet points or line breaks to aid in navigation.
• The description should focus on what is not included in the caption, i.e., points and lines.
• Like any image, there are many effective ways to describe a math diagram and make sure you use short sentences that focus on the data.

Scatter Plots

• Scatter plots are among the more difficult graphs to describe, especially if there is a need to make specific data point accessible
• Provide the title and axis labels 
• Identify the image as a scatter plot and focus on the change of concentration
• If it is necessary to be more specific, convert the data into an accessible table

Example of an accessible scatter plot

• Alt Text: Scatter plot. Refer to image description below. 
• Image description: This is a scatter plot that shows the relationship between the stretch percentage and protein content in cheese. The x-axis is labelled Protein Content (%) and ranges from 5 to 35, in increments of 5. The y-axis is labelled Stretch Percentage (%) and ranges from 100 to 900, in increments of 100. There are approximately 15 data points plotted on the graph. Most of the data points are concentrated in the lower-left corner and diminish in concentration as the pattern extends toward the upper-right corner. 

Protein content %	stretch percentage
20	400
15	350
30	600
25	450
18	300
22	250
12	255
28	700
10	200
24	550
8	150
32	800
14	240
26	600
16	350

Venn diagrams

• Focus on the data in the Venn diagram, not on its appearance  
• Provide the data in brief statements
• Give a summary if one is immediately apparent 
• Include the caption only if it is not accessible from elsewhere in the text; in this example, the caption is part of the image file and is therefore only accessible as part of the description

Example of Venn diagram

• Alt Text: Venn diagram. Refer to image description below. 
• Image description: Venn diagram depicting the distribution of 100 individuals based on lactose intolerance and cheese consumption. The diagram consists of two overlapping circles. The left circle represents 20 lactose intolerant people, the right circle represents 40 people who eat cheese, and the overlapping area of the circles represents 40 people who eat cheese and are lactose intolerant.  

Attribution

The guidelines for the following Sections are from The Diagram Center available under the Creative Commons CC BY License 4.0. You can reference The Diagram Center’s Copyright statement through their website. 

• Bar charts 
• Line graphs 
• Pie graphs 
• Cartesian (X-Y) coordinates 
• Geometry diagrams 
• Scatter plots 
• Venn diagrams 

Find out more…

• Specific Guidelines – Graphs (The Diagram Centre)     
• Specific Guidelines – Diagrams: Relational (The Diagram Centre)     

Submit an Inclusive Practice ticket to request a consultation if you need further support.