Create Accessible Data Visualizations

Accessible Data Visualization Best Practices

1. Use an accessible data visualization tool. Include your accessibility specialist in the initial data visualization tool selection process to ensure you select a data visualization tool that can be navigated with a keyboard, screen reader, and speech recognition software. There are both industry tools and open source chart libraries that can provide an equally effective experience for the disability community. Which tool is selected may vary based on your overall requirements. 
2. Use a familiar chart type. As covered by Ryan Bales, users should not have to learn how to read your chart to understand the data. Sticking to familiar chart types ensures everyone can easily access the data - in most cases, commonly used charts, such as area, bar/column, line, or pie/donut, will provide the data in a simple and readable format for all visual learners. 
3. Provide direct labels. When creating graphs and charts, ensure you label each data point directly. Direct labeling reduces cognitive load for everyone and makes the content more accessible to the colorblind, low vision, and neurodivergent communities. Watch Ann K. Emery’s video “Remove Legends and Directly Label (Dataviz Accessibility Quick Wins)” for more on why direct labels improve the accessibility of data visualizations.
4. Select an accessible color palette. When selecting the color palette for your data visualization, it's important to keep the color blind and low vision communities in mind. Direct labeling will improve readability for both communities, but you should also stick to colors that are not the same exact color contrast. You can use one of the following color palette tools to ensure you are selecting a color blind safe palette:
   • Chroma.js Color Palette Helper: A great starting point for generating the Hex colors for either one gradient or divergent gradients. With the divergent gradients, the status of colorblind-safe that the checker provides is skewed as it doesn't test for monochromatic vision, which is where you can use the second tool to fine tune your color palette and check it up against the grayscale view.  
   • Viz Palette: This is where you can fine tune the colors you select. It provides visuals of what the colors would look like in grayscale in multiple data visualization examples. 
   • When working on graphs and charts that have under 14 data points, it's best to stick with single-hue palettes as this reduces the amount of high contrast in the data visualization, which can overstimulate the neurodivergent community. 
5. Provide alternative formats and descriptions. Alternative formats, such as a table, access to the raw data, or sonification. Not everyone is a visual learner. Both the blind community and anyone that learns better through non-visual content will benefit from alternative formats. If you are providing a static image-based data visualization, include alternative text for the image as well as a summary below the image that provides the key information in the data visualization. The summary can benefit a variety of users. Note that alternative text does not work well for data visualizations that can be adjusted by the user. In that case, you would want to ensure you are selecting an accessible data visualization product.