Using Fonts: Best Practices

It’s always useful to know the technical part of typefaces, but when it comes to the practical side of design, it’s all about choosing the right fonts.

How to Choose a Font?

1. Identify your brand’s style and tone.

Fonts are an essential part of branding and they have to match the visual style of the brand. For example, if your brand is modern and technology-oriented, the visual style should be minimalistic with clean lines and shapes. In other words, you should avoid script or decorative type fonts.

2. Know what you want to say with the font.

Fonts have to match the brand’s style, but they also have to give additional value. Decide what you want to say with a font you choose:

• Want to create a sense of class and tradition for your law firm’s website? Use an elegant serif font.
• Need a more modern and sophisticated look for your furniture shop’s website? Choose one of the sans serif fonts.
• Need ideas for a handmade dress store? Look at script fonts.
• Have an idea for a funky vintage webstore? Use decorative fonts for accents.

3. Make sure your font is web-safe.

Web-safe fonts don’t require manual installation for the user to see them correctly.

Brands sometimes use custom (or non-web-based) fonts, which developers would then usually convert into a web-safe font. However, that doesn’t guarantee it will look good on screen. That’s why, we recommend choosing your fonts from Google Fonts, which will render perfectly in any web browser.

Popular vs Unpopular Fonts

The thing with popular and unpopular fonts is that they always change. Once, Comic Sans was one of the most popular fonts and now no designer wants to look at it. But like with any fashion trend, typography also has its own timeless fonts that you can always count on, such as the following:

At the same time, there are some fonts that are not well suited for web design. We recommend avoiding these fonts at all costs:

Pairing Fonts

Most of the time, it’s hard to tell at first glance if one font complements another. Here are a few tips that can help you decide which fonts to choose:

1. Use two fonts from the same typeface.

Font families were created by classifying fonts according to their characteristics. This means that they usually complement each other well. That’s why, when using multiple fonts, we recommend you stick to the same font family. The main rule is to use different weights, just like in the example below:

2. Pair a serif font with a sans-serif.

The contrast between serifs and sans-serifs creates a hierarchy without any additional styling (e.g. bold, italic, etc.). However, there is a fine line between contrast and discord. That’s why you should stay away from fonts that are way too different.

3. Combine a heavier font with a thinner one.

As mentioned before, fonts pair well when there’s a contrast between them. Another way to achieve a nice pairing is by using different weights. The visual distinction between heavy vs. large, tall vs. skinny fonts creates a visual hierarchy that’s quick to identify. That’s why we recommend using heavier fonts for heading and thinner ones for the running text.

4. Pair distinct fonts with plain ones.

Distinct fonts immediately draw attention to themselves. Using two in the same text destroys hierarchy. If you decide to choose a distinct font type, combine it with a neutral one to keep the balance.

5. Use fonts that have different spacing between characters. 
   The spacing between characters in a font is called a kerning. You can use two fonts with varying degrees of kerning to create a clear hierarchy.