How much time do you spend fretting about which typeface to use for your projects?

As the discussion rages on the superiority of serif to sans serif typefaces or vice versa, designers can understandably become overwhelmed, second-guessing every choice.

While there’s no hard and fast rule for every situation, we’re here to help with a few key guidelines that should help frame your typeface decision-making process.

What’s the Difference Between Serif and Sans Serif?

serif-sans-serif

Above, the serif (left) and sans serif (right) versions of the Legacy font illustrate the differences in the glyphs.

Serif typefaces are the traditional norm, ubiquitous in U.S. print, while sans serif typefaces — arguably ancient — have risen to contemporary popularity through their use across the web and, more recently, mobile environments.

The arguments for each usually center around legibility, as many claim serif typefaces are superior due to how the serif strokes lead your eye in a natural horizontal motion while the greater verticality of sans serif typefaces work against your eye’s natural movement.

However, the greatest contributing factors to legibility depend on the particular characteristics of a typeface. The variety across traits like stroke width and x-height within the same type family is so great that it overshadows the impact of a serif. There’s no denying a serif is significant — just less so than other factors.

When to Use Each Serif

Not interested in taking sides? Let’s get to the facts on how to use these serifs.

  • Sans serif fonts handle reduction better. The more ornate the serifs, the more their legibility deteriorates as the font becomes smaller.
  • The simplified shapes of sans serif glyphs make them easier to learn, often a preferable choice for children or beginner readers.
  • While they can be harder to learn, serif fonts are easier to recognize given that each glyph has more distinctive features.
  • Serif fonts like contrasting colors. The smaller the difference between font and background color, the more difficult it is to make out the fine strokes of serifs — which is why they are best used with bold, contrasting colors.
  • With their relative lack of ornamentation, sans serif fonts tend to complement a serif font they are paired with by taking on stylistic characteristics of their more elaborate companion. This often makes them more flexible in application.

Understanding those traits on a fundamental level can explain why certain mediums consistently benefit from one or the other type family:

  • Sans serif fonts tend to be preferable for online content and mobile applications
  • Serif fonts, with their easily identifiable characters, work well for print — print’s DPI resolution is higher than the typical computer monitor, so it renders fine details well.
  • Serif fonts often have a ‘louder’ presence — this makes them well-suited for headlines and stylistic accents.
  • This is not an absolute rule, however — factors like whitespace and arrangement can lend the minimalism of sans serif typefaces an equal impact. Apple is well known for this approach.

Aside from the big differentiation between the online and physical print domains, the choice between the two families is not formulaic. The reality is that the style, purpose, mood and arrangement of a project will dictate the decision — more so than the properties of the typeface family itself.

If all this seems like a bit too much to take in, the visualization below can provide a helpful reference as you navigate the typographical realm. After all, what designer doesn’t love an elegant infographic?

serif-vs-sans-serif-infographic

Buffer