An official website of the State of Maryland.

Maryland.gov Translate

Official websites use .gov
A .gov website belongs to an official government organization in the United States.

Secure .gov websites use HTTPS
A lock ( ) or https:// means you’ve safely connected to the .gov website. Share sensitive information only on official, secure websites.

Maryland Digital Playbook

Making visualizations accessible

Interactive dashboards can be very difficult for screen readers to navigate. The best thing you can do is provide a direct link to the data before the user even enters the dashboard.

1. Provide an Easy "Way Out"

The best way to help is to give users the data in a simple format before they reach the complex dashboard.

  • What to do: Place a clear link (e.g., "Download this data as a CSV file") directly above the dashboard.
  • Why it helps: This lets users grab the info immediately so they don’t get "stuck" inside a complicated chart.
  • Pro Tip: If you can, include a "Skip to Content" link that allows keyboard users to jump past the dashboard entirely.

2. Prepare Your Data File (CSV)

Your download file should be more than just raw numbers. It should be a complete "accessible equivalent":

  • Include instructions on how to read the data.
  • Include any footnotes or background info.
  • Include details that usually only appear when someone "hovers" over a chart with a mouse.

3. Design Visuals for Everyone

Follow these basic rules for the charts themselves:

  • High Contrast: Make sure text is easy to read against the background. Lines and bars should also stand out clearly.
  • Don't Rely on Color: If you use color to show a difference (like red vs. blue lines), also use symbols (like circles vs. squares) or patterns so people who are colorblind can tell them apart.
  • Keep it Simple: The more filters and dropdowns you add, the harder it is to make it accessible. Put important text, like footnotes, on the webpage instead of hiding them inside the chart.

Software-Specific Tips

For Tableau Users

  • Enable "View Data": This allows users to press Enter on a chart to see a simple table of the numbers.
  • Fix the Reading Order: Use the Selection Pane to make sure a screen reader follows a logical path (top-to-bottom, left-to-right).
  • Write Alt-Text: Don’t just name a chart "Bar Chart." Give it a summary, like "Bar chart showing a 10% revenue increase in 2024."

Reference: Tableau: Best Practices for Accessible Design

For Power BI Users

  • Table View: Ensure "header icons" are turned on so users can press Alt + Shift + F11 to see the data as a table.
  • Set Tab Order: Manually set the order in the Selection Pane so the cursor doesn't jump around randomly.
  • Label Everything: Add Alt-Text to every chart and button. If an image is just for decoration, mark it as "hidden."

Reference: Microsoft: Design Power BI reports for accessibility

The 30-Second Checklist

Before you go live, try these three quick tests:

  1. The Tab Test: Use the Tab key on your keyboard. Do you hit the "Download Data" link before you enter the dashboard?
  2. The Label Test: Look at your chart descriptions. Do they explain the "big picture" (e.g., "Sales peaked in July"), or are they generic?
  3. The Trap Test: Once you tab into the dashboard, can you easily tab back out to the rest of the page? (Make sure you aren't stuck in a "loop").