Hi, we really should talk!

We'd love to introduce you to Readz, the publishing platform used by IBM, Nike, Deloitte, Aon, and many more. Hop on the phone with one of our publishing consultants and get customized advice on how to get started.

INSTANT, EASY

DIGITAL PUBLISHING

TRY FOR FREE

What Is The Best Font For Online Content?

In this article we will discuss the best font for your online content and publications.

Start publishing online newsletters like Deloitte, IBM, and Nike.

Get a demo of Readz today - and never look back.

GET A DEMO

If you've ever landed on a web page that was nearly impossible to read, you already understand the importance of having legible content. I'd bet you didn't stick around long on that page. You're not alone; most people won't. So if a site can't keep visitors around, how can it convert them? Simple. It can't. Because content that isn't legible isn't convert-able. In contrast, sites that provide an enjoyable reading experience see better traffic, engagement, and conversions as a result. While many factors contribute to a positive reading experience, copy is ubiquitous. So that's where you should start.

This article goes over the best typeface for your online content and publications, whether these are

digital publications such as reports, newsletters, annual reports or websites and blogs

We’ll pay special attention to the best font pairings used in different industries.

The best font for web content

Effects Of Typographic Choices

Ideally, your website copy and online content alone are enough to satisfy your readers and reach your content goals. Yet you can influence the perception of text through typography:

Branding: Your website will replicate the style of your brand and either use the fonts defined by your brand, or typefaces that bring out your brand’s qualities. A clean and serious corporate image is best complemented by typeface of that look.
Psychology: The look and feel of a typeface evokes a certain mood or emotion that should match your brand, but also your content to give it a personal voice.
Legibility: Typography can improve the on-screen appearance of text and make it easy to read. An optimum of speed and ease can encourage readers to go on.
Scanning: Even those readers who only quickly scan your content are able to retain more information when the typographic choices on a website allow for easy scanning.
Accessibility: Similarly, making your content accessible to users with impairments across devices is not only a design priority, but it also helps in getting your message in front of readers.

Why is typeface important?

Different fonts shows different brand emotions

For starters, fonts have the ability to create very specific associations for readers that elicit distinct emotions about a brand or company. Just think of the font used for Disney’s logo versus that of Sony’s. Two different fonts, two very different feels.

The same is true for all fonts. When you think of Times New Roman, you might think "stale" or "pedagogic." In contrast, when you think of Garamond, words like "polished" and "sophisticated" may come to mind. Both are serif fonts (distinguished by the small decorative lines added to the end of a stroke in a letter or character) by the way, but they have different associations.

The typefaces on your website support reader comfort, legibility, engagement, and ultimately conversion and therefore business growth. The following infographic gives an overview of the feelings readers associate with various typefaces:

The Psychology Behind Type Choices (

source

)

For his project

Logofonts

, designer Emanuele Abrate replaces the wordmarks of famous logos with the fonts in use. Google therefore becomes Product Sans, the name of the font the search engine uses for its logo. You can browse the project for font inspiration.

In another interesting font study, experimenter Errol Morris asked 45,000 New York Times' readers to take a quiz. Contrary to the title, the quiz was not meant to test whether readers were optimists or pessimists but whether typefaces affected perceived truth. Specifically, are there certain typefaces that compel a belief that the sentences they are written in are true?

Morris used six fonts for the study: Baskerville, Computer Modern, Georgia, Helvetica, Comic Sans, and Trebuchet. He found that Baskerville promoted the most confidence; that is, engendered a belief that a sentence is true. (To read more on this study, click

here

.) Clearly, the decision on typeface is an important one; content marketer's should tread carefully.

Which font is easy to read? Serif vs sans-serif fonts

In an IBM and Google eye-tracking study, the researchers also measured the legibility of serif vs. sans serif fonts. The study found that serif fonts (they used Georgia) were read 7.9 percent faster than sans serif fonts (the study used Helvetica), although the difference was not significant.

Many other studies found the same. And there is much, much more that goes into the readability of text (e.g., letter spacing, height, and width, weight, shape, etc.).

Soooo... what is the best font for you?

Clearly, the decision on typeface is an important one; content marketer's should tread carefully.

In general, fonts that work well on a website have open counters (the opening within letters such as O or D), generous apertures (the opening between counter and glyph outside, as in c or e), and feature a moderate contrast in the thickness of character strokes. When using serifs, consider how well they reproduce at small sizes.

So for the scope of this article, here's a simplified list of the best and worst free fonts for your body content:

Encouraged:

Nunito Sans
Garamond
Georgia
Avenir
Raleway
Lato
Verdana
Open Sans
PT Sans / PT Serif

Avoid:

Comic Sans (#1 most hated)
Courier
Papyrus
Impact
Souvenir
Times New Roman
Brush Script
Gill Sans

Arial, Times, and Helvetica are also among the most hated but are more acceptable due to their universal availability.

Tips for selecting the best font for your content

Match your brand and message

Pick your fonts according to what your brand and your website represent and match the personality of your message. Which characteristics are important? Traditional, respectable, comfort, reliable? Contemporary, modern, minimalistic, progressive? Strong, stable, defined? Elegant, luxurious, vintage?

Match your audience

Take your readers into consideration and identify the age range and social demographic of your target audience. Fulfill the expectations of readers by presenting them with visuals they already expect from your sector and only add a slight personal touch. If necessary, research your successful competition to understand their font use.

Versatility

If you find it difficult to pair two fonts, maybe one is enough. Don’t forget that you can use different styles and weights to accentuate and distinguish headings and subheadings merely by size from body text. This will work especially well with modern sans serif fonts such as Open Sans or Roboto.

Readability

We can’t stress enough that your font design should not be too complex. Never compromise on readability and legibility, especially with mobile users in mind.

Mobile Considerations

For more information on mobile typography,

Google’s Material Design

guidelines offer clear and consistent design hints. Here are a few considerations when choosing fonts for mobile web design:

Consider toning down the desktop experience, which might mean using only a serif or sans serif font - or use a more decorative typeface sparsely for touches here and there.
Limit yourself to just two typefaces on mobile to give readers and users a better visual experience on smaller screens.
Check that characters are distinct and readers won’t mistake similar glyphs for one another (uppercase “i”, lowercase “l”, number “1”), especially at smaller sizes.
Typefaces should complement each other; they can contrast visually, but for legibility, similar character width and line length are helpful.
The more extravagant your font choices are on desktop, the more seriously you should consider substitutions on mobile.

Typeface across industry sectors

Google uses Product Sans for its logo.

Your choice of fonts for your website and online content communicates about your brand and business, as well as about your content, product, and audience. Your font design should be in line with your brand messaging, which is why we’ll look at website fonts across various industries below.

HEADINGS

SUBHEADINGS, BODY TEXT

Arapey Droid Serif Muli Lato

Roboto Overpass

Brandon Grotesque

Rooney

Oswald

Univers

Museo Sans Rounded

Oxygen

Tiempos

Avenir

Geogrotesque

Circular

Raleway

Best Font for Healthcare

Nurse.com

achieves a modern look with Open Sans and Aktiv Grotesk

Best Font for Banking & Finance

This

research report

by BNY Mellon and Financial Times combines Publico Banner for serious serif headings with the Lineto Akkurat font for sans serif body text.

Customers are looking for values such as stability, reliability, and professionalism. It’s also important to portray a sense of security. Thanks to banking apps, cryptocurrency startups and fintech, the sector generally tends to go for a more modern look without losing the strength of traditional values.

A range of modern fonts is suitable for baking and finance websites, such as Open Sans, DIN, Calibre, Neue Haas Grotesk, Graphik, Avenir, Pluto Sans, Proxima Nova, Aktiv Grotesk, Calluna, Sofia Pro, Neue Haas Unica, Akkurat and Nunito.

HEADINGS

SUBHEADINGS, BODY TEXT

Montserrat

Arsenal

DIN Pro

Asap

Pluto Sans

Lato

Tiempos

Avenir

Geogrotesque

Circular

Catamaran

Muli

Insurance

Travel insurance company

TuGo

relies on Open Sans for clarity in its newsletter.

Similarly to banking and healthcare, you want to use fonts that convey a sense of security in the insurance sector. Avoid fancy scripts that come across as unprofessional and playful. The right font pairing will speak to your brands reliability and establish trust with the customer.

A modern approach can rely entirely on sans serif fonts, but there is nothing wrong with using modern serif headings to appeal to traditional values.

HEADINGS

SUBHEADINGS, BODY TEXT

Crimson

Roboto Slab

Open Sans

Brandon Grotesque

Tiempos

Avenir

Lato

Platform

Poppins

Calluna

Realist

FF Dax

Omnes

Proxima Soft

Academics & Education

Aspen Music Festival And School uses Type Dynamic's Larsseit font for sans serif heading and Utopia Std for serif body text, a sophisticaed choice.

Academic institutions, universities and schools want to convey their values of tradition, discipline, scholarship and a reliable, professional education. A sophisticated pairing of a serif and sans serif can work well to achieve this.

Education website and e-learning apps targeting younger learners often opt for a sans serif approach only, using modern typefaces. For your education website, consider typefaces such as Futura, Crimson, Open Sans, Avenir, Lato, Interstate, Noto Sans, Elena, Graphik, Sofia Pro, Proxima Nova, or Benton Sans.

A modern approach can rely entirely on sans serif fonts, but there is nothing wrong with using modern serif headings to appeal to traditional values.

HEADINGS

SUBHEADINGS, BODY TEXT

Montserrat

Skolar / Space Mono

Oswald

Univers

Freight Sans Pro

Freight Text

Apercu

Nobel

Work Sans

Akkurat

Fenland

Lyon

LL Circular

Calibre

FF Dax

Non-profit & NGO's

The non-profit organization

American Industrial Hygiene Association

uses Dosis for its logo and Futura PT with Open Sans & Arial for its messaging.

For non-governmental organizations and non-profits, let the respective sector guide you in your choice of fonts to underline respectability, responsibility, or professionalism.

For activism, social responsibility and other causes where you want to communicate a strong message that needs to stand out, you can make use of an unusual serif and sans serif pairing or combine a sans serif with a monospace or otherwise striking headline.

HEADINGS

SUBHEADINGS, BODY TEXT

Lato

Droid Serif

Skolar

Vinter

Lato

Rooney

Apercu

Scandia Line

Scandia

Novel Sans Rounded

Heimat Sans

Jigsaw

Maiola

Montserrat

Farnham

Source Sans

FF Din

Plan Grotesque

Akkurat

Real Estate

For its new approach to leasing,

Nestio

uses the modern font Karbon for a distinct look.

This industry is more diverse than you might think at first. In general, your choice of fonts should speak to the trust and seriousness your brand wants to establish. But depending on your clients, you might opt for luxurious or affordable, classic or modern, mature or youthful. Sans serif fonts manage to convey that modern or timeless appeal, whereas you can add personality, tradition and excellence with the right sans serif for headings.

HEADINGS

SUBHEADINGS, BODY TEXT

Proxima Nova

Gilmer

Georgia

Proxima Nova

Museo Slab

Open Sans

Fedra Sans

Lato

Neue Haas Grotesque

Neue Haas

Neue Haas Grotesque

Lyon

Neue Haas

Serif

Futura

ITC Bodoni

Apercu

Benton Modern

Benton Sans

Eudald News

Figgins Sans

Karbon

Kabon

Poppins

Akkurat

Avenir

Locator

Retail & E-commerce

Nike

uses bold sans serifs for its statements and headlines in this newsletter.

In these sectors, you want to communicate a clear and consistent message to your customers. Fonts needs to be legible and mesh with brand or corporate identity. Sans serif fonts such as Helvetica, Futura, and Muli are common appearances for bold statements, recognition value and a modern, yet timeless look. Serif fonts can convey seriousness where necessary, but refrain from using them for body text.

HEADINGS

SUBHEADINGS, BODY TEXT

Helvetica

Muli

Futura

Asap

Karla, Prata

Nunito, Lucida Sans

Open Sans

Change One

Roboto

Brandon Text & Source Sans

Calluna

Brandon Grotesque

FF Tisa

Value

ITC Kabel

Calibri

PT Sans

Trend Sans One

Avenir

Flama

Adelle

FF DAgny

Bebas Neue

DIN

Conclusion

Never write off font as something unimportant. Choosing the right font size and typeface can make a big difference in readership and conversions you obtain. Give users an unpleasant experience, and there are countless other places for them to turn. Don't do your competition any favors - be smart about your font choices.