How can I make my tables and charts accessible? 

At UADA, we use plenty of charts in our work. Making these charts accessible improves the reach of our programming and keeps us compliant with accessibility laws and guidelines. Ensuring that your charts meet accessibility standards isn't as hard as you might think!

Download our Complex Image Accessibility Checklist 

 

Don't forget about using alt text

If your graph or chart has been included in your document or website as an image, you will need to make sure that you have included alt text for the image. In your alt text, try to summarize what is going on in your graph, what are the conclusions someone can draw from this figure, and why it was important enough to include in your work. 

Do your best to keep your description to less than 120 characters. Some screen readers are incompatible with longer alt text descriptions. 

Read more about alternative text here 

 

 

Repeat the data in your graph or chart in a table

To increase the accessibility of your charts, include the tabular data in addition to your chart or graph. This allows users who are accessing your information with a screen reader to still have a way to navigate through your information without missing out on anything. 

A bar graph of the 2021 Crop Corn Cash Market Elevator Prices as an example for a bar graph.  A table with the numberical date from the 2021 Crop Corn Cash Market Elevator Prices bar graph.

In this example taken from the Arkansas Corn 2021 Crop Cash and 2022 New Crop Booking Market Report, the same data is presented as both a bar graph and as an accessible table. 

 

 

Add long text descriptions for charts

Since charts and graphs display complicated information as a visual, it can be hard to conceptualize what is going on in a graph if you are only presented with a list of numbers in a table. By adding a text description to your audience, you can help both your visually impaired and sighted users better understand and interpret your information. 

A text description is typically longer than an alternative text description, and is found near the graph itself. 

Explain to your audience why your graph is important enough to include in your work. What important trends are you showing? How are these trends important in context? What 'main idea' should you audience be understanding from this graph? 

Screenshot of the 4th Quarter 2021 Arksnasas Timber Price Report as an example of a text description of a graph.

In this example taken from the 4th Quarter 2021 Arkansas Timber Price Report, a "Trends" description is added under the line graph. This description is used to further explain the purpose and findings of the accompanying graph and increases the accessibility of the report. 

 

 

Pay attention to colors and patterns!

When you present your data as a graph or chart, be mindful of the colors you choose to present the information. Most sited users - even people with 20/20 vision! - need enough color contrast between the main content you are presenting and its background so that it can be read easily. Having high contrast in a design is even more important for users who have low vision or who are colorblind.

If appropriate, adding a pattern to your charts and graphs will also increase its accessibility. This helps distinguish the data information from the surrounding information. 

2021 Crop Soybean Cash Market Statistics (February 7 – February 11, 2022) - a line graph indicating the daily maximum, minimum, and average prices

In this example, taken from the Arkansas Soybean 2021 Crop Cash blog post, the author uses both accessible color contrast and a variation of shapes to represent different data sets. By combining both color and patterns that increase accessibility, more users can understand this graph and it's meaning in context. 

Read more about color and color contrast here 

 

 

Additional Resources 

Table Concepts - Web Accessibility Tutorials 

Creating Accessible Tables - WebAIM

Table Accessibility - Princeton University 

 

 

Still need help?

Let us know! We are happy to help make your tables and charts more accessible. 

Madison Ellis, Accessibility Specialist

mjellis@uada.edu

Amy Cole, Digital Media Manager 

accole@uada.edu 

 

Head back the main accessibility page here