Here are five systems to try in your design. Systems help to ensure visual consistency across a project. Typographic Design SystemsĪ typographic design system, as used below, is a declaration of font sizes, weights, and line heights to be used in a layout.

This treatment is not only hard to read in a visualization, but it also looks somewhat jumbled outside of the text.

Look how the 3, 5, and 4 descend below the baseline. That’s because it uses old style numbers instead of lining numbers. Raleway is a beautiful typeface that is commonly used for text and logos, however, it doesn’t work well for labeling data visualizations. To understand how type is “highly readable” at small sizes, let’s look at a few elements of type. Copy should be minimal, parred down to the essentials for comprehension of the graphical elements. Good typography doesn’t grandstand - it explains the content without getting in the way of the user’s experience. Visualizations with good typography have a consistent rhythm. Highly readable fonts take less brainpower to interpret. In order to serve a wider audience, I will only recommend free Google fonts, though there are many good paid options. I will focus primarily on small text, that is, text in a data visualization that is meant to explain the layout, including labels, callouts, and sources. In this article, I will be explaining how to pick a highly readable and aesthetically pleasing typeface for your project. Any text accompanying the graphics should be easy to read to the point that it almost disappears. Good visualizations help the user understand complicated data without allowing the design to get in the way. The purpose of data visualization is to provide a layout that relays lots of information quickly.

Modern typeface anatomy