01 / LIE FACTOR
Graphical Integrity
Lie Factor = Effect in graphic Γ· Effect in data
Every bar, axis, and area must be proportional to the data it represents. A Lie Factor of 1.0 is the standard; anything above 1.0 overstates, anything below understates.
Rule: Y-axis always starts at zero for bar charts. Never truncate bars to exaggerate differences. Bubble area, not diameter, encodes value.
Click for deep dive β
02 / DATA-INK RATIO
Maximise Data-Ink
Data-Ink Ratio = Data-ink Γ· Total ink in graphic
Every pixel serves the data. Erase everything that doesn't encode information: tick marks, grid backgrounds, decorative borders, redundant labels, gradient fills, drop shadows.
Rule: Prefer range-frame axes. Use no fill or single-hue fills. Remove legends when direct labels are possible. No 3D β ever.
Click for deep dive β
03 / PREATTENTIVE
Preattentive Attributes
Length > Area > Angle > Hue
The visual cortex processes length and 2D position before conscious thought. Design exploits this: bars (length) are decoded faster and more accurately than pie wedges (angle) or bubbles (area).
Rule: Prefer bars over pies. Use position over size. Use saturation over hue when encoding continuous scale. Limit to β€4 distinct hues per chart.
Click for deep dive β
04 / CHARTJUNK
Eliminate Administrative Debris
Chartjunk = Non-data ink β erasable structure
Tufte coined "chartjunk" for all visual elements that obscure the data signal: moirΓ© patterns, heavy gridlines, decorative pictograms, 3D extrusions, and color noise.
Rule: Gridlines in #d8d4ce only. No fills behind charts. No icons in charts. No gradient axes. Anti-patterns page shows every rule violation.
Click for deep dive β
05 / DIRECT LABELS
No Legends β Label Directly
Eye travel = Legend lookups Γ distanceΒ²
Legends force readers to look away from the data, decode a color mapping, then look back. Direct labels β placed adjacent to the element they describe β eliminate this cognitive tax.
Rule: Label bar ends directly. Label line ends at rightmost point. Label map regions inline. Use badge cells in tables instead of separate legend keys.
Click for deep dive β
06 / MACRO / MICRO
Overview + Detail Simultaneously
Sparkline: word-sized Β· data-intense Β· context-rich
Tufte's principle of "micro/macro readings" β the design should work at multiple scales: readable as a whole gestalt and inspectable at each individual data point without switching views.
Rule: Embed sparklines in tables alongside numeric values. Use small multiples with a shared Y-scale. Avoid modals unless the data cannot fit the primary view.
Click for deep dive β