Write alt text for your data visualizations
- Alt text is read aloud by screen readers so that users, including those with visual impairments, can hear and understand your data visualization. Alt text cannot convey the full meaning of the visualization, but it can provide a short description at least.
- Example: "Line graph of Toronto's daily highest temperature for the past week, highest on record"
- Learn more at this blog post
Verify that your visualizations are colour-blind friendly
- Try to avoid colour schemes that do not differentiate well for those with colour-vision deficiencies, like red and green.
- Use a colour-vision deficiency simulator like Coblis to upload your visualization and verify or use a tool like ColorBrewer to provide you with a colour-vision deficiency safe palette.
Create strong takeaway titles
- Titles that have a takeaway (meaning and purpose of the visualization) are cognitively easier to understand for everyone; making them screen reader friendly similarly allows the title to be understood.
- Example:
- Title with a takeaway: "Prices for 152 products are rising compared to last year" vs.
- Title without a clear takeaway: "Comparing this year and last year's prices of 152 products"
Include the data table
- Include a data table that can be read by screen readers or allow a download of the table in a format like a csv. This provides an alternative to the data visualization as well as allowing users to process their own conclusions.
Directly label data instead of using a colour-based legend
- Using a legend, especially a colour-based one, can create a barrier for visually-impaired users. It also makes it more difficult to identify labels to values for all.
- Example:
| DO NOT use a colour-based legend |
DO directly label data |
 |
 |
Verify type and colour contrast
- Use WCAG accessibility guidelines and available tools to ensure that the contrast of both type and colour are accessible to visually impaired users.
- Many online tools can contrast colours and tell you if they pass the accessibility standards, such as WebAIM's Contrast Checker.
