Charts accessibility

When working on a chart, you want to make sure everyone can see and understand it. This means creating charts with users with various disabilities and limitations in mind. We put together this short guide to help you get a better idea what accessibility is and how it’s implemented in Charts.

Accessibility is the practice of making a website usable by as many people as possible, including users with visual impairment. Many of them are using screen magnifiers and/or screen readers. A screen reader uses a Text-To-Speech (TTS) engine to turn information displayed on the screen into speech.

When using screen readers, charts are read in their entirety. A screen reader will read title, description, alternative text, chart structure (read as: "Column chart with 2 series, New York, California"), axes titles, annotations, points, tooltip, source, and logo.

Recommended settings for screen readers

NVDA

If you’re on Windows, we recommend using NVDA, a third-party app. Once downloaded, you’ll want to disable reading the keyword "clickable" with clickable elements:

  1. Go to Preferences.
  2. Click Document Formatting.
  3. Select Elements.
  4. Uncheck Clickable.

To turn off screenlayout which makes NVDA reads chart sections in wrong grouping, follow these steps:

  1. Go to Preferences.
  2. Click Keyboard options.
  3. Enable Use Caps Lock as an NVDA modifier key.
  4. Click OK.
  5. Press Caps Lock + V on your keyboard.

VoiceOver

If you’re using a Mac, you’ll want VoiceOver to read only the important elements. Here’s how to make VoiceOver less cumbersome:

  1. Go to System preferences.
  2. Click Accessibility.
  3. Select VoiceOver.
  4. Open VoiceOver Utility.
  5. Choose Verbosity from the left rail.
  6. Set Default Speech Verbosity to Low.

    By setting Default Speech Verbosity to Low, VoiceOver will, for example, read just the name of the button, instead of reading the name, status, and type.