How to format text on your small business website to increase readability

There was a lot said about websites readability so far, but it is still common to find small and medium business websites, like yours, with a poorly designed copy.  I mean – too long copy written with a too small font which you haven’t changed since 5 years. I wonder when you wake up finally to realise that you lose traffic?

Let’s do a simple test. Try to read this:

If paragraph on your website is written with small font and line height so narrow that letters are touching each other you are on the path to disaster. Wrong formatted copy where the text is too wide, centre aligned is the biggest crime and conversion stopper.

Difficult, isn’t it?

And now read that:

If paragraph on your website is written with small font and line height so narrow that letters are touching each other you are on the path to disaster. Wrong formatted copy where the text is too wide, centre aligned is the biggest crime and conversion stopper.

Which one is easier to read? Yes, most of the users would choose option 2. But why? Let’s find out.

Discovery about readability

Typography is a wonderful part of design. Well applied can build the mood and style for your website. But when is done poorly you will lose visitors

Given 15 minutes to consume content, two-thirds of people would rather read something beautifully designed than something plain. (Source: Adobe)

I have seen tonnes of websites with a badly formatted copy which caused eye constraint and a headache:

  • text center-aligned
  • small font
  • text going across the whole screen
  • lack of typography architecture
  • too long copy

Don’t be one of these guys, don’t do these common mistakes. Fix your website’s readability and keep users longer on your page. Below you’ll find a bit more details on how to do it.

Avoid aligning your copy to centre

In western civilisation, we use the latin alphabet so we read from left to right.

Our eyes are trained to scan the text horizontally. So while reading a longer text and you reach the end of the line, your brain is expecting to find continuation on the very left edge. If your eyes don’t find the text there, they start to scan the page to locate it again. That causes strain on the eyes and also slows down the process of reading. It’s not comfortable to read that way, especially longer content.

screenshot of Sterling Build's websites
Sterling Build has just published a new website, but still, they use centre-aligned copy

Write short and to the point

TL;DR – are you familiar with this abbreviation? It stands for “Too Long; Didn’t Read”. Monitors are not specifically designed for reading. They work with led lights which glow straight into eyes. That’s why you feel tired after many hours of work on the computer. Keep your copy short and sweet and leave longer epic stories to the eBook. Kindle solved this problem designing the ink monitor which doesn’t glow increasing comfort of the read.

Highlight titles and subtitles

Long blocks of text with no subheads are difficult to scan. Make your user life easier and put headlines and sub-headlines into your text to let him know what are you talking about in the following paragraph. Such information architecture will help your reader to recognise is it something valuable for him.

Narrower block of text is easier to read

A common mistake is to layout text too wide, from edge to edge. If you look at any book its size usually is between A5 and A4. That is roughly 15-20 cm wide. This is comfortable width for reading. In magazine editors break the text into columns also for an easier reading. And now look at the monitor – it’s wide. Reading such wide text is not comfortable because your eyes have to travel far. And once they reach the end of the line, it’s easy to lose the track which row should you read now.

screenshot of wikpedia page
Wikipedia – a copy is spread across the whole width of the screen

Increase the font size

15 years ago the standard font size for the screen was 9 points, but also monitor sizes were smaller. Today standard is full HD monitor, with many having the 4K display, which means that your website copy has to be written with the larger font. Today’s standard is 16 pt, but often you can find 18pt, 21pt even (it all depends on the type as well). Bear in mind your website users, who may not be young. Even eyes of the 40 years old person are working worse than eyes of the 20 years old.

Summary – how to improve text on your website

  • Aligned body text to the left
  • Write short paragraphs
  • Use bullet points
  • Differentiate headlines and sub-headlines by colour or font size
  • Keep number of character in the line not longer than 3 times length of the alphabet (between 50 and 75 characters per line – <alphabet has 26 chars>)
  • Built comfort reading zone by setting up body text in a block up to 800px wide
  • Due to size of monitors the standard body font size is 16pt (often even bigger. Medium uses 21pt font)
  • The line height should be at least 140-150% (the distance between rows of text)
screenshot of medium.com page
A good example from medium.com – large font size, narrow block of text and all copy is left aligned. Tick all boxes.

Times, where you were writing all information you thought were important, are gone. Users don’t read copy, they scan the text looking for the information they need. So make their life easier, increase their user experience by telling them what they need to know in a short and easy to scan way.

I hope you enjoyed the read and you find it useful. If you need any more information about readability on the website, hit email me here and I’ll be happy to help.