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

Source