Designing accessible dashboards
When creating dashboards for a large audience you should be aware of how you can make your visual analytics dashboards more accessible.
Here are a number of guidelines to help you design and construct accessible dashboards.
Use colors with high contrast and be consistent
- Provide contrast for
items in visualizations, at least 3:1.
For colors in your visualizations and items that people will interact with, pick colors that have a contrast ratio of at least 3:1 against the background color.
- Provide contrast for
text, at least 4.5:1.
For colors of text elements in your dashboard, pick colors that have a contrast ratio of at least 4.5:1 against the background color.
- Pick colors that are
color-blind-friendly.
For colored items that will be compared, pick colors that are color blind friendly. Use color-blind-friendly palettes and avoid using red and green together.
- Visualizations of the
same type should be consistent in a dashboard.
If there are two or more visualizations of the same type in a dashboard (for example, two pie charts) these should be consistent. This means that they should have similar settings as well as the same "look and feel". However, they do not necessarily have to use the same colors. For example, keep the legends on the same side for visualizations of the same type.
- In addition to color, use
other visual means to provide information.
Avoid relying on color only to differentiate items in visualizations. Consider adding differences in size, shape and patterns, so that the items can be distinguished from one-another.
Make your content descriptive and readable
- Provide descriptive
visualization titles.
The title should describe the content in a visualization and introduce the consumer to the visualization.
- Provide descriptive
legends.
Legends in visualizations must describe the values clearly.
- Provide descriptive page
titles.
Page titles should describe the content that the consumer can expect on the page.
- Provide text alternative
for visualizations.
There should be a text alternative present for all visualizations to aid those that cannot see or for some other reason cannot comprehend the visualization. This should include a description of the visualization and its purpose, as well as potential generated insights.
- Provide an overview of
the dashboard.
Include a description of your entire analysis. What is the purpose of it, how should it be navigated and what should the consumer expect?
- Use sans-serif fonts.
Pick a sans-serif font such as Roboto or Arial. Avoid fonts such as Times New Roman because it is more difficult to read for some people.
- Provide text larger than
16 pixels.
If possible, use text that is at least 16 pixels tall. If smaller text is used it requires higher contrast than step 2 under "Use colors..." above suggests.
Minimize the complexity of your visualizations, and the dashboard as a whole
- Provide a logical
structure in lists and tables.
Tables and lists should be structured so that it is easy to navigate them. Use logical structures, such as alphabetical order, or north-south for geographical data.
- Minimize visual and
navigational complexity in dashboards.
Strive for a clear and simple dashboard to minimize complexity. If visualizations are meant to be viewed together, put them on the same page and in the order they are meant to be viewed.
- Dashboards should be
constructed with a natural flow.
Design your dashboards so that they are easy to perceive and navigate sequentially. There should be a natural flow, for example, from top-bottom and left-right. Place important information at the top of the dashboard.