Data Visualization: Best Practices
Choosing a Chart Type
While some types of charts are more commonly used than others - such as bar charts, line charts, and scatterplots - there are many types of graphs available to choose from. Your choice of a particular chart type for your data visualization may be constrained by the type of data you are working with or the number of variables you want to graph, or you may want to choose your chart type based on what type of pattern you are trying to show (comparison, part-to-whole, hierarchy, etc.). Here are several interactive resources to help you decide on a chart and, in most cases, find a tool to create it.
Color and Accessibility
When designing a data visualization, the primary goal is to communicate information using visual means, and whether you share your visualizations in print or digital form, designing for accessibility is important. Although color is most frequently mentioned in this context, accessible design goes beyond avoiding color palettes that make charts difficult to read by individuals with color vision deficiencies like red-green colorblindness, or protanopia. There are many ways to make your graphs easier to understand for people with visual impairments or other disabilities, and designing for accessibility can make your data visualizations more readable for all users.
The following articles offer good overviews of the issues involved in designing for accessibility.
- Cesal, Amy. June 26, 2018. "Accessible data viz is better data viz."
- Grosser, Zach. January 10, 2018. "Accessible Colors for Data Visualization."
- Tableau Desktop and Web Authoring Help. Version 2018.3. "Best Practices for Designing Accessible Views."
Read more about the Web Accessibility Initiative at w3.org.
Color & Contrast
The following tools can help you get started with choosing accessible color palettes and contrast ratios in your visualization.
- ColorBrewer and Viz Palette are two tools for creating colorblind-safe color palettes.
- Contrast-Ratio and Color Safe can help you test whether your color palette and contrast ratios are WCAG 2.0-compliant.
- Colblindor can simulate color vision deficiencies on sample images or uploaded files.
General Best Practices
In addition to color, there are other aspects of visualizations to consider when designing for accessibility. For additional guidelines, consult the CFPB Design Manual for Data Visualization.
- Image "alt" tags:
Always add descriptive text in an "alt tag" when embedding your visualizations in a webpage. Screen readers read alt text out loud for users with visual impairment, so it is important to include a concise but accurate description of a graph.
- Font and descriptive labels:
Use a sans-serif font for chart titles and descriptive labels, and consider labeling data directly whenever possible rather than putting values or other information only in a chart legend.
Mistakes to Avoid
Andy Kirk's Visualising Data has a wealth of resources for data visualization beginners, but particularly helpful is his "Little of Visualisation of Design" series, which talks about how small design decisions can shape a data visualization in big ways.
Be careful with pie charts: Robert Kosara explains why on his site, Eager Eyes, and offers many other articles on data visualization techniques.
Certain kinds of color palettes are better suited to different kinds of data. When you are using color to represent a numeric value, you should use a color scale. Color gradients (shades from light to dark within a single hue) can be used to represent sequential data, whereas diverging scales (such as red to blue) are often used to represent numbers to either side of a mid-point.
If you are using color to represent categories rather than sequential or continuous values, you may want to use a categorical color palette. The maximum number of distinct colors you should include in a visualization is 12. Ideally, try to keep categorical color palettes to 6 or fewer colors when possible.
Data is Ugly on Reddit
Terrible Maps on Reddit