Site Building Advice 0

Using science to choose better fonts

We’ve previously written about the psychology behind good content, how to choose the right font and how to structure your content, now it’s time to add a little more science to the art of website building.

First, fonts have feelings.

Well, not really. But they do evoke feelings from your readers. Humans created them, after all.

They also have cultural references too. Have you ever come across a site that just feels spammy?

Take this landing page from American Red Cross.

Friendly vs spammy fonts
Seems pretty friendly.

But let’s change the fonts to “Impact,” since the page wants to impact lives… right?

Friendly vs spammy fonts
Not so trustworthy now, is it?

Fonts can give you a feeling. What feeling do you want your website to have?

Choosing your paragraph font
Although quality of content is of utmost importance, the way it’s presented can also have an impact in purchase decisions and, of course, feelings and brand recognition. Choose a font that parallels the vibe you want for your business. Be inviting.

First, select the font that will be most commonly displayed on your site. This is often the body copy, or paragraph text. For this, you’ll want to choose a font that is readable. We’ve outlined the differences between serif and san serif fonts previously. The gist is serif fonts are best for print, while sans serif fonts are better for websites.

The main goal here is legibility. You’ll want your font to be easy to read yet still convey just the right vibe.

Pick a header font
There are two other font types that you can consider.

We left some information out. We’re sorry… sorta.

Script fonts are those handwriting style fonts that are commonly used for wedding invites or calligraphy sets. Decorative fonts are, well, decorative. Think of saloons or medieval style fonts or any font that is just plain pretty. These fonts can be used for headers, but are really meant for text that is more at a glance. A logo, for example, is a great place to have a creative, but readable font.

Fortunately, in Style Designer, we have a few selected font pairings that, when chosen, will automatically change your headers and paragraph text to the appropriate fonts. When looking at these pairings, keep in mind that the first font is your header, and the second one is your paragraph text.

Whichever fonts you choose, make sure that your readers aren’t spending precious mental power to understand your words instead of deciding to what to buy. Make each of those factors super easy.

Size matters
On an average day, people consume lots of content – too much to count. As our reading patterns have changed drastically in the past 50 years, so has how we look at font sizes. Microsoft Word has a default font of 12pt, but for the Web, you’ll want something a bit bigger.

Larger fonts have been shown to produce stronger connections. Therefore, 16pt (or 16px in online format) or larger for paragraph test is ideal.

You’ll also need to find a balance between sizes. Don’t have a 30px font for a header with a 16px font for your paragraph text for fear of being a bit clownish.

Play around with your sizes. It’s ok, you’re allowed.