website readability

17 Apr 4 Crucial Elements of Website Readability that Impact Conversions

One of the most important aspects of any website is content. You’ve probably heard the phrase “content is king”, made famous by Bill Gates. In fact, 60% of marketers create at least one piece of content each day. That’s a lot of content!

Image source

But do you know what the missing element of most online content is? Readability.

When it comes to owned media (that is content that you own, such as what you publish to your website), the most important factor is that users can actually read it! Note we’re not talking about lexile readability hereā€¦ no, no, no. This is web readability as in “why does this content make my eyes bleed?”.

The absolute worst case scenario is that users are overwhelmed by the sheer mass of your content, or its formatted so poorly that they instantly decide to hit their browser’s back button.

Think about why you’re creating content. The top digital marketers measure the success of content marketing by analysing things such as:

  • Web traffic
  • Direct sales
  • Sales lead quality
  • Sales lead quantity
  • SEO rankings
  • Inbound links

These are some reasons why we create content.

When you look at that list, it becomes easy to see that you cannot achieve these indicators of success if your content cannot be easily read!

content marketing measurement

Image source

This post looks at the 5 elements of web readability, and how you can utilise them to increase your conversion rate and get more subscribers, enquiries, and revenue.

The 4 Elements of Readability

The primary elements to consider when optimising your website for readability are:

  1. Font / typefaces
  2. Characters per line
  3. Spacing & page breaks
  4. Attention cues & formatting

#1 Typefaces

Your typeface or font is the most basic element of your website’s typography. Typography is simply the way that text is arranged on a page or document. Your font selection is an integral part of typography.

In fact, typeface is so important it can actually impact how much people trust your content, as per a study by the New York Times in 2012. The Times quizzed 45,000 readers to see if different types of fonts impacted how much readers believed the claims made in an article. 45,000 readers quizzed.

“Did typeface matter? Oh yes. The informal Comic Sans inspired the most ire and dismissal, while the more formal Baskerville was the most trustworthy. The results were so definitive, even the experimenters were surprised at the extent of typefaces’ influence over reader psychology and its overshadowing straightforward, factual content.” Source

There is also psychology to choosing the right font for your website. This infographic by CrazyEgg illustrates how we perceive different font types:

Psychology Behind Typeface

Image source

Tips for choosing a typeface

  • Consider your audience and choose a font that fits the specific context of its use e.g a bolder font may be more appropriate for headings.
  • Serif fonts (font with “feet” or lines attached the ends of their letters) are typically thought to look more serious or traditional.
  • San serif (which literally means “without serif” aka no little links) are considered more modern typeface
  • Script fonts (such as those in a cursive style) are usually used to either show elegance or to give a more casual, hand-drawn feel.

If you’re having trouble deciding, an eye-tracking study done by Google & IBM found that serif fonts were slightly more readable than san-serif fonts.

#2 Characters per line (CPL)

Characters per line (CPL) or also known as “terminal width” is the maximum number of fixed-width characters that appear on a single line.

CPL is a very important aspect of readability as people consume content differently on the web. We read websites casually, usually skimming over text to get a sense of the overall document or web page.

we dont read every word individually

Image source

Because we don’t read every word individually and use our peripheral vision to find the next spot to focus on, having a lower character per line limit is generally better.

For example, in the highlighted section of this image which column would you consider easier to read?

website readability example of columns

Image source

Clearly the right hand column is easier to read, as it gives us a smaller area to focus on, and reduces the CPL.

Webtypography.net recommends the following for character limits per line:

“Anything from 45 to 75 characters is widely regarded as a satisfactory length of line for a single-column page set in a serifed text face in a text size. The 66-character line (counting both letters and spaces) is widely regarded as ideal. For multiple column work, a better average is 40 to 50 characters.”

Tips for lowering your characters per line

  • Don’t spread content across full width of page
  • Utilise columns to break up content
  • Decrease paragraph length
  • Use a bigger font

#3 Spacing and Page breaks

Nobody enjoys a cramped reading experience. Line spacing gives people room to breathe when reading your content, which is an important factor in conversion optimisation.

The proof is in the pudding. Numara Software was able to increase their monthly sales pipeline by $330,000 by optimising the spacing of their content. Step 1 in this process was improving website readability:

numara font test

Image source

When you compare the original font and test font, the most obvious difference is the spacing. The outcomes from the change are as follows:

  • improved the bounce rate by 10%
  • improved site exit rate by 19%
  • Increased pages per visit by 24%
  • 133% improvement in form conversion rate.

By optimising their readability they were able to get 133% more web enquiries. What would 133% more enquiries do for YOUR business? I assume a lot.

Tips for improving spacing

  • Increase font size
  • Reduce characters per line
  • Add spacing/padding between paragraphs
  • Consider moving wide blocks of content into columns

#4 Attention cues & formatting

Improving readability also means improving comprehension. If your content readability is low, your website visitors with come away with less information. A less informed website visitor means they’re less likely to convert.

In fact, a Nielson norman Group study shows users typically only read around 20% of the words on a page, per visit.

This means if you publish a 1000 word blog post, your visitors are maybe reading 200 words of it.

So now that we know that your website visitors are ignoring most of your content, how can you optimise it to increase readability and comprehension? Text formatting.

Here’s an example of a really well formatted section from the slack website:

slack image

Here the author combines multiple formatting styles to make the content very easy to read, as well as drawing attention to specific important information with a box and icon.

Tips to improve text formatting

  • Utilise bolding
  • Use block quotes when appropriate
  • Integrate emojis when possible
  • Separate content using lists (numbered or bullet points)
  • Break up content with subheadings
  • Use horizontal lines (hr tag in HTML) to separate content

Bringing it all Together

As you can see, there are a lot of benefits in dedicating some time and research into your website’s readability. It can dramatically increase your conversion rates, and better educate your audience on why they should choose your product or service.

To get the most out of this experiment, you must test all of your changes. To test how these changes have improved your conversion rates, do the following:

  • Setup conversion tracking for web enquiries & subscriptions
  • Compare conversion rates of before & after
  • Measure time on site before & after implementation
  • Compare pages per visit before and after the changes
  • Compares before and after bounce rates

This post was written by Blake Smith and brought to you by holistic digital marketing agency E-Web Marketing. Get an analysis of your website for free by the experts at E-Web.