Is your website easy to read? – Achieving good readability

by Teresa Rodriguez

We know there are a lot of factors to take into account when designing your website – interface design, navigation, colour scheme…. Readability is also a very important component, and one that should not be overlooked as it will affect how users process the information in the content. Poor readability will scare readers away. Good readability will help users to efficiently read and absorb the information in the text. 

What is readability? 

Readability describes the ease with which a document can be read. It depends on a number of things, including content, structure, style, and layout and design. 

Can you measure readability? 

Yes. Although various tests have been designed since the early thirties, the most popular readability measure was developed for the United States Navy by J. Peter Kincaid and his team in 1975 to assess the level of reading difficulty of the instruction manuals published by the Department of Defense. You can find detailed information on the Flesch-Kincaid readability tests here and language-specific tests and scores here.

Readability

Seven ways to improve website readability 

Here are some important factors to consider when creating your website content:

1. Limit the number of font sizes used

Font sizes are used to visually differentiate the purpose of the text. They work as signs that say “this is a summary”, “this is important”, “you should pay attention to this”, “we are moving onto something else”, etc. Try not to use more than three different font sizes to deliver your main body content - main header, sub-header, body (other screen elements may use alternative sizes such as superscript/subscript, labels, advertisements, separate nav links, footer nav etc). 

Remember: There needs to be a sufficient level of visual difference for text size to work, so three font sizes will do the best job for you. 

2. Limit the type of fonts used 

Every font has a different level of readability. 

Serif fonts have a more old-fashioned and established look but they provide a more seamless reading flow. Their name refers to the marks at the point of the letters, which are designed to lead the eye on to the next letter to make it easier to read.

Serif 2

However, serif fonts tend to work better at high resolutions and higher print sizes. At low-resolutions, the extra complexity decreases clarity, and the reduced whitespace between letters makes recognition slower. 

Sans- serifs are fonts that don’t have serifs (sans from the French “without”). With a more modern and open feel, sans-serif fonts are more readable than serifs on pixel-based displays, because they are simpler. Besides, many of them have specifically developed to be used in electronic means of communication and given a broader look, with more space between letters.

Sans-serif

Verdana, in particular, seems to be the preferred font choice for many designers because the broad design and ample square space allowed for each letter makes it easier to distinguish each different letter at low resolutions.

Verdana

3. Use emphasis fonts with caution 

Feel free to use underlines, bold and italics to create emphasis but use them with caution, particularly underlines and italics fonts. Instead, consider using a coloured background, or emboldening the text as this increases contrast, and contrast only works when it has something to contrast against. Lots of bold text will merely create a lot of unnecessary noise and decrease readability 

4. Background contrast – Keep it simple 

White background (or the lightest possible shade) against black text wherever possible. The opposite, white or brightly-coloured text on a black or very dark background colour, could work as well but it’s slightly more tiring to read. But, avoid light on dark colour schemes as light text on a dark background is difficult for most people to read. Avoid a light on dark colour scheme unless the text on your site is minimal. 

5. Capitalise only when necessary 

Capitals are everywhere these days. They are no longer used for what they were meant to be used - to indicate the start of a text or a piece of information that needed highlighting like personal names, or names of places (obviously, oversimplifying capitalisation rules). Now, capitals are overused and this reduces their effectiveness. Ensure you use them appropriately and only when necessary to prevent your readers from processing the text slower than what they should. 

6. Consider preferred online alignment options 

Remember the rule: Left over right. Left aligned text is easier to read than right-aligned text. And full justification (where words are stretched so that they meet both the left and right margin) only works with long lines of text (40chars+). Besides, on-screen text is easier to read in narrower columns so if you need to wrap the text to an image make sure the image appears on the right of the screen as in the following example: 

7. Limit text block size 

Remember this other rule: Think about the format in newspapers and magazines, use them as examples of text block sizes and stay away, as they do, from long and wide text blocks. Lengthy paragraphs equal less whitespace, which is what gives paragraphs shape and makes it easier for readers to find the start of the next line. Also, long lines or wide paragraphs are slower and harder to read than narrower ones. Lines of around 100 characters present neat bite-size chunks of text that can easily be decoded, and also make it really easy to scan round to the start of the next line. To help you achieve an easier to read text block: 

 

  • Write short sentences. 
  • Use many paragraphs. 
  • Use headings to structure the content. 
  • Use bullet lists. 
  • Use images to break up the text.

 

Teresa is a linguist and specialist in intercultural communication, holding a MA in intercultural conflict resolution and a Post-grad. diploma in Translating and Interpreting. Teresa is an avid online researcher, social media player and bilingual content producer. She is currently Copy and Content Manager at Hofrog Hotfrog, and editor, writer and translator for the Hotfrog Small Business Hub. She also writes in her own blogs No-mad, and Digital cultures and translation.

Did you find this article helpful? YesNo 0% said yes (0 votes)