All posts

Writing · data visualisation / reporting / accessibility

How Readers See Charts: Perception Principles for Reporting Visuals

Why position beats angle and area, when bars need a zero baseline, and how to use colour and titles so report charts are read correctly.

Author
Catalin Bondari
Published
Reading time
4 min

A chart in a monthly report gets a few seconds of attention. The reader is usually busy, often senior, and looking for one answer: is this fine, or do I need to do something? Whether they get the right answer in those few seconds depends less on the data than on how human perception handles shapes, lengths and colours.

None of what follows is new. It is a handful of findings from perception research and a few habits I apply when building reporting visuals, framed around the kind of charts portfolio managers and risk committees see every month.

Position beats angle and area

In 1984 William Cleveland and Robert McGill ran experiments asking people to compare quantities encoded in different ways: positions on a shared axis, lengths, angles, areas and shading (Cleveland & McGill, 1984). People were most accurate when comparing positions along a common scale, and noticeably worse with angles and areas. Jeffrey Heer and Michael Bostock repeated several of these experiments with crowdsourced participants in 2010 and reached broadly the same conclusions (Heer & Bostock, 2010).

The practical consequence is simple. If the reader needs to compare values, put them on a common axis. A pie chart of sector weights asks the eye to compare angles; the same weights as a sorted bar chart, or as dots on one line, can be compared at a glance. Pies are fine for “roughly how much of the whole is this one slice”. They are poor for “which of these eight sectors are we overweight in”.

Bars need a zero baseline

A bar encodes its value as length, so the eye compares bar lengths. Cut the axis and the lengths stop matching the numbers. The example below uses made-up figures: a fund return of 4.1% against a benchmark of 3.8%.

Truncated axis versus zero baseline Two bar charts of the same illustrative data, fund 4.1 per cent and benchmark 3.8 per cent. On the left the axis starts at 3.6 per cent and the fund bar looks about two and a half times longer. On the right the axis starts at zero and the bars look almost equal. Axis starts at 3.6% 4.1% 3.8% Fund Benchmark 3.6 Axis starts at 0% 4.1% 3.8% Fund Benchmark 0
Illustrative data. Same two numbers, two very different impressions. The left chart makes a 0.3-point gap look like a rout.

If the 0.3-point difference is the story, show the difference itself: a single bar or dot for active return, on an axis centred on zero. Line charts are different, because the eye reads slope and position rather than length, so a non-zero axis on a price or yield series is usually fine. The rule is about bars, not about all charts.

Spend colour on one thing

Colour is the fastest signal on the page. A single coloured mark among grey ones is found almost immediately, without scanning. That is also why a chart with eight saturated colours feels noisy: everything is shouting, so nothing is.

My default is grey for context and one accent colour for the thing the reader should look at, such as the fund against a grey peer group or the one sector that breached a limit. If a series has a colour in one chart, it keeps that colour in every chart of the pack. Readers learn the mapping quickly, and breaking it causes real misreads.

Do not make colour carry the meaning alone

A meaningful share of readers will not see your red and green the way you do. The US National Eye Institute notes that men have a much higher risk of colour vision deficiency than women (NEI). WCAG makes the same point as a rule: colour should not be the only way information is conveyed (WCAG 2.2, Use of Color).

In practice that means pairing colour with something else: a +/− sign on the label, an arrow, a direct label at the end of the line instead of a legend, or a pattern. Power BI has built-in accessibility support, including themes and alt text for visuals, which Microsoft documents in its report accessibility overview.

Write the title as the finding

A title like “Active return by quarter” describes the axes. A title like “Active return turned positive in Q3 after two negative quarters” tells the reader what to see, and then the chart becomes the evidence. This is the single cheapest improvement I know. It also forces the author to decide what the chart is for. If you cannot write the sentence, the chart probably should not be in the pack.

The same goes for annotation. One short label pointing at the inflection point (“rate cut”, “rebalance”, “new benchmark from March”) saves the reader from guessing, and saves you the follow-up email.

Persuasive is not the same as flattering

A chart persuades when the reader trusts it. Trust comes from consistency: the same scales from month to month, the same colours, the same definitions, and visible footnotes when something changes. A chart that makes a result look better than it is might win one meeting, but the first time someone spots a truncated axis, every chart in the pack loses credibility.

Checklist before a chart goes in a report

  • Can the main comparison be read as positions on a common axis?
  • Do all bar charts start at zero?
  • Is there one accent colour, used for the thing that matters?
  • Is every colour backed up by a label, sign or shape?
  • Does the title state the finding in one sentence?
  • Are scales, colours and definitions the same as last month, and is any change footnoted?

Further reading

  1. Original article on KDnuggets (external site) · Nahla Davies
  2. Graphical Perception: Theory, Experimentation, and Application to the Development of Graphical Methods (external site) · William S. Cleveland and Robert McGill
  3. Crowdsourcing Graphical Perception: Using Mechanical Turk to Assess Visualization Design (external site) · Jeffrey Heer and Michael Bostock
  4. Color Blindness (external site) · National Eye Institute
  5. Understanding WCAG 2.2: Use of Color (external site) · W3C
  6. Overview of accessibility in Power BI (external site) · Microsoft

Drafted with AI assistance and edited by the author.