Are You Missing This Piece of the Conversion Optimization Puzzle?

by 8 08/01/2014

You thought you’d done everything right.

You spent hours poring over the perfect call-to-action button, right down to color and text. You agonized over the wording of your offer and tweaked your layout to perfection. Everything looked perfectly situated to blow your conversion rate through the roof…

But something’s still wrong.

It’s like an itch you can’t scratch. You’ve already invested so much time and effort refining every piece of your sales funnel, what could possibly be left behind?

The answer is…

Your Web fonts.

Web fonts are, unfortunately, given little consideration beyond the design and prototyping stage. It’s assumed that if your content is good enough, people will read it, no matter what the typography looks like.

But several eye tracking and readability studies have determined otherwise.

fonts-placeitSource: Placeit.net

Fonts Really Do Affect Legibility

In fact, IBM and Google did a comprehensive study on how fonts affect legibility. They invested in eye-tracking and scroll-measuring systems, and gained some valuable insights that we, as conversion optimization professionals, can learn from, including:

  • 12-point font is read faster than a 10- or 14-point font.
  • There is no statistical significance between the use of serif (Times, Georgia, etc.) vs. sans-serif (Arial, Helvetica, Verdana) fonts.
  • Users comprehended material better with the Georgia (serif) font, but using it did not increase reading speed.
  • Font size and style, as they relate to reading speed and comprehension, don’t matter nearly as much as whether or not English was the user’s first language.

Before you run out and start changing your fonts site-wide, there are a few more points to consider with relation to typography and conversion rates:

Don’t Forget about Line Space

A company called ClickLaboratory presented an in-depth case study for the font work they did for Numara Software, a $100 million dollar IT company. In their presentation, they first looked at line spacing, which had been the same since the site launched (Arial, 10pt).

numara-font-test

The test font may take up more space, but the line space improves readability and comprehension

By increasing the font to 13 pt and giving the lines some breathing room, surprisingly, all metrics improved. This one change resulted in:

  • A decrease in bounce rate by 10%
  • A decrease in site exit rate by 19%
  • An increase in pages per visit by 24%
  • A 133% (yes, you read that right) increase in form conversion rate

But they didn’t just stop there…

Improving the Headline

Numara’s home page, one of the most popular entry points for organic and paid searches alike, included calls to action that were mainly being ignored by visitors. To combat this problem, the main headline size was increased and shortened.

track-itA Larger, shorter headline increased CTRs 334%

This in turn made the call-to-action buttons more visible above the fold, which resulted in an increase in download-button clickthroughs—by 334%. The pricing request button’s CTA clickthrough also increased—by 54%. Both of these results are enviable, by any measure.

Still, it’s worth noting that “Experience BMC Track-It!” isn’t much of a compelling headline.  It would be worth testing some variations to truly pull the visitor deeper into the copy.

Site Search Box Tweaking

Another little-known area where font size can be a deciding factor is the search box. Again, this is one of the factors that often stays the same through a site’s many redesigns and revisions, as it did in the case of Numara:

numara-original-search

It’s worth nothing that, with 400+ pages and searchable files, including PDFs, the sheer size of the site was a force to be reckoned with. And visitors often took advantage of the site search, making it the third most popular navigation method on the site. However, its usage numbers still left much to be desired. So a change was made.

numara-new-search

By not only making the search field larger, but increasing the corresponding font size as well, user engagement increased by 20%.

All of these things added up, generating an extra $1 million in revenue for Numara after all changes were implemented.

Still think of fonts as an afterthought?

Choosing Fonts Like a Pro

Good font combinations go together like fine wine and cheese. In contrast, terrible choices often strain the eyes and make visitors feel uncomfortable (though they can’t put their finger on why). So how do you choose font pairs that look great and are easy to read?

This article shows you precisely how to pair fonts like a master—and, for the typographically-curious, also goes into detail on what NOT to do. It demonstrates (with plenty of font examples), how to blend bold and soft, size and form, and much more.

austriaAn example of fonts that work well together

And if that tutorial’s talk of skeletons and spurs has your eyes glazing over, don’t worry, Google has taken out all of the analysis and technical jargon to present hundreds of nice and tidy font combinations for your viewing pleasure.

google-web-fontsThe Skinny on Fonts and Your Conversion Rate

Like many other aspects of conversion optimization, a change in font is just one facet you can change and test to determine the effect it has on your conversion and clickthrough rate. Despite what the studies here have shown, it’s difficult to center on font as the single issue that’s most detrimental to your conversions.

Always test, measure and track your changes, so you can make updates with statistical confidence. Continuing to refine your pages and meeting your visitor’s needs with proactive changes shows that you’re serious about improving their user experience—of which fonts are just one small but meaningful piece.

What are Your Thoughts?

Do you think optimizing with fonts is overrated? Or is it a crucial part of your conversion optimization strategy? Share your ideas and comments below!

Read other Crazy Egg articles by Sherice Jacob.

Print Friendly

About 

Sherice Jacob helps website owners improve conversion rates with custom design, copywriting and website reviews.  Get your free conversion checklist and web copy tune-up by visiting iElectrify.com.

Get our Daily Newsletter

Get conversion optimization, design and copywriting articles delivered to your inbox FREE

8 COMMENTS

Nancy Seeger

A better point of reference is pixels – points are for print. They are also not the same sizing, pixels are smaller than points.

12 pt = 16 pixels
13 pt = 17 pixels

See a lot of sites now with 18 pixels (paragraph font size). Although pixels dominate font sizing on the web, more modern sites are using rems and percentages now.

August 2, 2014 Reply

    Neil Patel

    Nancy, thanks for the share. These insights will be helpful :)

    August 3, 2014 Reply

    Sherice Jacob

    Plus, these adaptive fonts are better for responsive design.

    August 5, 2014 Reply

Jessica Jordin

Nancy, I read your last post about increasing ROI. These factors are shocking to me that how can tweaking a font style can boost your conversion. Thanks. I am new to internet marketing and I am so happy that your guys are really genorious in term of spreading knowledge

August 5, 2014 Reply

Priyank Sharma

Fantastic article. I think fonts are majorly overlooked when it comes to improving a website’s conversion. And it needs to be given more importance.

August 5, 2014 Reply

    Neil Patel

    Priyank, great point. Fonts play a major role.

    August 5, 2014 Reply


Leave comment

Some HTML allowed

Get conversion optimization & A/B testing articles FREE >>>