Readability


Readability, that word refers to both the visual and the content of your text. To be readable, your text must first be visually easy to read. It may surprise you know that text on a screen is more difficult to read than the same text in print. In fact, printed text often is created using a serif style font such as Times Roman. The tiny crossbars on the letters of a serif font help the eye move horizontal across a line of text aiding in the ability to read more rapidly text in paragraphs and pages. To bring emphasis to titles and headings, a sans serif font such as Arial with its simpler straight lines and curves tend to make your eyes hesitate just a bit which helps titles and headings stand out.

Surprisingly, this should not be the way you format text for display on a screen. In fact, because it is more difficult to read text on a lighted screen, it is generally better to use an Arial style sans serif font to help make the letters clearer to read. Perhaps some of this is related to perceived character spacing since the straighter characters do not quite approach each other as much as do the serifs in a font such as Times Roman.

Pay attention to text size. Text that is too small or too large can make text more difficult to read. The problem here is multiplied by the different form factors that web pages, e-books, etc. have to deal with ranging from 24-inch desktop computer screens to 5-inch smartphone screens. Of course most electronic devices will allow the user to zoom in or zoom out of the text to effectively resize the text to their liking, but you may want to start with a font size that will make your text easy to read by the most number of users without manual adjustments.

Consistency in the use of fonts is also important. Once a font style is selected, it should be used for all content on all pages of a website. It can be quite annoying to deal with a different font style as one goes from one page to another (or even worse, one paragraph to another). This detracts from the sense of continuity between the different portions of the content. Sure you can use italics or special fonts for emphasis of small text segments. However, even putting an entire paragraph in a different font style can make it look like it does not belong.

Of course, all rules have exceptions. For example, you may place material quoted from another person or source in italics, or a different font style, or even a different color to purposefully bring emphasis to it. However, be careful of using type styles such as underlined text or certain colors of text in places where the user might misinterpret the text as representing a hyperlink.

Font colors should be carefully selected considering the background color to give the reader a high contrast. The greatest contrast is black text on white background or vice versa. However even here a white background is preferred for content read in normal lighting conditions and a black background is highly preferred for text read in the dark. In fact, some programs including some e-book readers have the ability to automatically flip the text and background colors based on the ambient light level. For example, my iPad’s iBook reader does that.

On the other hand, using a light blue text on a medium blue background may not provide enough contrast. A related problem I have seen is placing darker text on a black background such as a medium to dark blue or red on black. Also, some people perceive colored text on a colored background as being smaller than the equivalent black text on a white background. This is especially true of lighter text on a darker background.

Another consideration is the width of the text column. Generally web pages use two or more columns of text so that the reader can more easily move their eyes across the line of text and then quickly find their way down to the next line. The wider the text column, the more difficult this is.

Related to this is the size of the paragraphs. Longer paragraphs can feel exhausting to read compared to shorter paragraphs. Also, the use of shorter paragraphs forces the writer to condense their ideas into smaller more easily digested content nuggets.

Long web pages should be minimized. A user should not have to scroll down the equivalent of more than two or three screens to read the entire page. I’ve seen web pages that require the user to scroll and scroll and scroll to get to the bottom. Do you really think that users will ever find the content at the bottom of that page? Of course not. There is even good argument for a single article to be continued on another page after it begins to get too long. Don’t be afraid to break articles into multiple sub-topics that are then linked through multiple pages.

In addition to all the visual aspects of making your content readable, consider also the grade level of your writing and whether it is appropriate for your audience. Microsoft Word can analyze your text and report on its readability. To turn on this feature, open the File drop-down menu and select Options. In the dialog that appears, click on Proofing in the left column. Locate the section on the right side of the dialog: When correcting spelling and grammar in Word. Click the check box: Show Readability statistics. Now when you create text in Word, you can click the icon in the lower left status bar to the right of the word count. The resulting dialog box will give you readability statistics for your text including number of sentences in a paragraph and the average number of words in each sentence. At the bottom of the dialog is the Flesch-Kincaid Grade Level. Try to keep this number between 8 and 10. This document is an 8.7.

Finally, don’t try to eliminate all white space on a page. White space gives your eyes a chance to rest. A page completely filled with text and no white space between paragraphs or columns or around images is very hard to read.

C’ya next time.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s