The design of a table is its linchpin: if it’s done right, it makes complex data easy to scan and compare. If it is done wrong, it renders information completely incomprehensible. So let’s do it right, right?Data tables collect and organize much of the information we interact with.
Know your numerals
Numbers that are either tabular or oldstyle, either lining or proportional
- Oldstyle figures look nice in sentences, where they better match the size and spacing of lower-case letters
- Lining figures are more uniform and reinforce the grid-like structure of the table
- Proportional figures are designed to match the color of the typeface
- Tabular figures are identically sized so that columns of numbers line up properly
Rules
If you’ve properly aligned the data points in your table, rules become redundant
- Horizontal rules are the most useful
- They allow you to significantly reduce the vertical space occupied by long tables, making faster work of comparing lots of values or seeing trends over time
Conclusion
Tables might be boring, but they are such a major element of any data-rich document that they’re worth every ounce of design thinking we can apply to them.
- By designing more efficient, clearer, and easier-to-use tables, you can vastly improve the experience of analyzing and understanding large sets of data.
Further Reading & Inspiration
FiveThirtyEight uses a typeface called Decima Mono, which is specifically designed to fit lots of data in a small space
- Butterick’s Practical Typography is a reference for typographical design
- Edward Tufte’s insightful writing on design is indispensable
Title
Give your data table a clear and succinct title
A technical note on using tabular lining figures
You’ll need to do a bit of work to ensure the numerals you’re using are the correct ones.
- Not all typefaces have tabular linings, and the ones that do tend to be pretty expensive.
As little ink as possible
The goal should always be to reduce the table’s footprint without losing structural fidelity.
Backgrounds
Most useful when indicating differences in the domain of data.
Alignment Matters
Three simple rules to follow: Numerical data is right-aligned, Textual data is left-aligned and Headers are aligned with their data
- Don’t use center alignment
- Center alignment causes the lines of the table to become “ragged,” which makes it much harder to scan entries, often necessitating extra dividers and graphical elements
Consistent Significant Figures = Better Alignment
Keep the same number of significant figures consistent across all columns of your tables
