Retail displays, packaged goods, financial reports and apps all present readers with a lot of data. We know that numbers, and their styles, play a big role in making information accessible. How do we make long lists, tiny annotations, and mighty stacks of numbers work well?
Jonathan Hoefler (by, you guessed it, Hoefler&Co) shares some strategies to work with numbers on our interfaces.
Perhaps the most common challenge is dealing with small sizes; those pesky tiny labels in charts, x and y axis in graphs that don’t fit and which we cram… of course, the most effective way to establish a type hierarchy is through type size:
…using palpably smaller type to distinguish the content from its notes. But at smaller-than-text sizes, even the most lucid typefaces can become difficult to read, their spacing overly tight, their counters congested, and their x-heights measly.
But did you know that there are typefaces specifically designed for being displayed in small sizes? Typography.com has ScreenSmart collections
, for instance, which are optimised for these situations. Compare the footnotes on these two labels at the bottom
; they’re set at the same size, which one reads best?
Next, lists: they can be long and tiny, or the exact opposite. As Hoefler puts it,
Disclosures, disclaimers, and lists of ingredients may be the sections that readers most often ignore, yet they’re among the most heavily regulated part of any typographic object, and therefore the content that’s most heavily scrutinized by an alarmingly large portion of an organization
Yet he makes the case to resist the temptation to use a condensed typeface
for lists: It’s almost always a better option to make the counter-intuitive choice of a wider typeface and to set the type in a smaller size with tighter leading. Wider letters have more comfortable proportions, they’re more generously spaced, and they have more ample counters, collectively making them the more legible choice. In fact, compare these two examples of ingredients
in a product: do you really want to use a condensed typeface?
Before I leave you to read the rest of article, I’ll mention one interesting point that I had never considered myself: superscripts and subscripts. When we pick a typeface for a project, we always think about language and diacritics (does the language have special characters?), but I never thought about checking if I want to use superscripts… and if the typeface contains them. You might need footnotes
, or to write chemical formulas.
Continue reading for more tips on how to choose fonts for data display, plenty of good tips there.