Choosing Text Fonts for Data Visualizations
Choosing the perfect text font for any given data visualization can be a tricky process. Although increasing the size of a word may convey emphasis or importance, it's not always the best route as it may overshadow the visuals.
Font sizes and formats
Here are some ideas to consider when you choose font sizes and formats:
Make important text a little bigger. A general rule of thumb is that low-hierarchy text should be in a smaller font than text of high-hierarchy text. The following figure shows how the font sizes of various labels in a hierarchy may vary based on level.
Consistency is key. If you decide that all your main titles will be in a size 30 font, for example, you must ensure that all your main titles are exactly the same size.
The key factor is to have consistency for each individual label type. Consistent label sizes for each level are easy for users to grasp, and the sizes help users identify certain areas of your data visualization at a glance.
Avoid using all caps. The era of text messages and social media has created a new set of rules for using text. Today, using all caps indicates that someone is shouting, which usually evokes hostility and defensiveness. All caps are also harder to read, as all the letters are the same size. In addition, readers may gloss over or skip all-caps words.
It may be fine to use a simple all-caps title such as SALES EXECUTIVE DASHBOARD, but don't use all caps in labels throughout your data visualization. In general, you have very little to gain from using all caps, so it's best to avoid the practice.
Thanks to web browsers such as Internet Explorer and Google Chrome, most people have become accustomed to a few standard fonts, such as Verdana, Garamond, Arial, Helvetica, and Times New Roman.
These fonts are somewhat boring, but it's highly recommended to stick to one or more of them, for two reasons:
Each user's web browser may be different. Data visualizations are commonly hosted on company sites or portals that must be viewed in a web browser (unless, of course, you're developing a static image like an infographic). No matter what fonts you use to create a data viz, each user's web browser automatically defaults displaying any text using one or more of browser-safe fonts mentioned earlier.
If you use unusual fonts, your visualization may look distorted or become unreadable when your fonts are replaced with browser-safe fonts. It's safer to design your visualization with the common fonts.
One way to get around having to use browser-safe fonts is by posting your visualization in an Adobe PDF or Microsoft PowerPoint format. These file types are not affected by the browser, but these options are not available in all tools.
Avoid fancy or custom fonts. Using fancy or custom fonts may make it harder for someone else to understand or edit your data viz, especially if you use nonstandard or specialized fonts that need to be individually downloaded and installed on a desktop. Yes, custom fonts may look great, but they are simply not worth the risk of having the user not being able to view them.
We recommend using Verdana and Garamond, both of which are on the extended list of web browser-safe fonts. They add a little bit of flair without having the straight military feel of Arial.