The numeric value on the Y axis is inconsistent, which makes the chart confusing and possibly leads the viewer down the wrong path.
Do's
Both the numeric values along the Y axis and the years along the X axes are consistent, so the viewer easily understands the layout.
Scale_tag
Don'ts
The title and supporting elements imply all data and details have equal weight. For communicative, state what data you are going to highlight and use supporting elements to create a visual path.
Do's
The title clearly states something specific about the data. Guide viewers from most important to supporting details through font size and boldness and choice of colors (see Color).
Hierarchy_tag
Don'ts
It can be misleading and difficult to understand if you do not start at zero.
Do's
By labeling the X and Y axes, the chart organization is easy to understand. Bar charts usually start with zero.
Axis_tag
Don'ts
When visual clutter dominates the chart, viewers can spend more time trying to visually organize and understand the clutter than interpret the data.
Do's
By clearing visual clutter, using simple, sans-serif fonts, and simple visual elements (no 3D or drop-shadows, for example). the viewer can easily focus on the data.
Readability_tag
Don'ts - Color
By giving color to all the bars for each group, it implies all data has equal weight. For Communicative, highlight what you want the reader to know about the data. Also, light colors often do not meet accessibility requirements.
Do's - Color
Use color only for the data highlighted in the title. Non-text contrast ratio of at least 3:1 is suggested for accessibility by WCAG 2.1. (See Resources for color accessibility sites.)
Color_tag
Compare with Pie Chart
Don'ts
Bar charts are better used for showing parts of a whole. It is difficult to match the years with the parts of the pie and it does not support the title because 2018 is not highlighted. Additionally, the different parts of the pie exceed 100 kt.
Do's
Use the bar chart to show a sequential comparison between items.
.svg)
.svg)