One of the main goals of web design is to get visitors to read the content. How can this happen when your site’s fonts are illegible? Who’s going to understand jargon or complicated terms? Readability matters. With that in mind, here is a basic checklist to run through whenever you’re building a website.
- Is the typeface legible? Text shouldn’t draw attention to itself. Its purpose is to communicate a message. Today, many designers agree that sans-serif fonts are best for paragraph text, although there are exceptions. Likewise, using all caps should be reserved only for headlines or emphasis.
- Is the text large enough to read? If your text is too small, readers will have to squint or strain to read it, which means most of them won’t bother trying. This is especially true if you have an older audience or mobile readers. Make the text large enough to be readable, yet small enough to prevent nonstop scrolling to get through a page. When in doubt, go with at least a 16-point size, adjusting as needed based on the font you’re using.
- Are text colors appropriate? The classic choice for online text color is black on white. Its high contrast makes it easy to see. Compare this, for example, with yellow on orange or pink on red. Even yellow on blue makes it hard to see text. Likewise, be judicious with reverse type — light text on a dark background — even though it does offer contrast. White on black has been shown to kill readability and comprehension levels, according to Neil Patel, which damages conversion rates.
- Are paragraphs or lines too long? A huge part of online readability is making text scannable. This starts with breaking up long paragraphs into more bite-sized chunks and opting for shorter lines of copy. According to Prototypr.io, a good rule of thumb is 34em-36em line length for body text and 17em-18em for small mobile devices.
- Is there a clear hierarchy of content? Headers, subheaders and body text should not match one another. Each needs to be a different size in order to establish a hierarchy of order and importance. This is why you want the design of your content to make headers largest, subheaders next largest and body copy a standard size.
- Are the headers as compelling as possible? Just as important as the way your headers look is what they say. Keeping in mind that most visitors will read only about 20 percent of your content, according to Econsultancy, the eye-catching headers are your best chance to reach them. Lead with the benefits you are offering. Tell them why they should care.
- Am I using confusing terminology? When you want to reach the most visitors, you have to avoid flowery language. So, skip the vague, confusing and/or jargon-y terms. Instead, write more conversationally, in a way that your target audience will understand.
- Have I made proper use of white space? Any time you have a content-heavy website, you need to think strategically about incorporating white space. Blank space works to offset large sections of text, giving the reader’s eyes a break. Likewise, it guides the reader through the flow of content so he or she knows what to read next. One example of this is your page margins. Margins on either side of text help draw a reader’s eyes toward the core content. They also establish separation from other elements.
- Did I create focal points in the copy? Just as you might use an eye-catching pillow to create a focal point in the living room, so too you should incorporate intentional focal points into your online copy. You might use bold text or blockquotes to make portions of text stand out in a long post, for example. You can use a different font color for links to clue readers into their clickable URLs. These attention-getting sections help break up monotonous text and give readers direction.
- Am I making the most of visuals? Elements such as photos, videos, GIFs, infographics and other media are more than fun to look at — they’re powerful. According to Platonik, pictures are processed 60,000 times faster than text. This means the photos, graphics and other visuals you include in your web design may communicate better than your copy. Choose wisely.
When it comes to online readability, there are many obstacles that can affect how much readers retain. Choose text that’s too small, a font color that’s hard to read or not enough white space, and you can lose the people you’re trying to reach. With that in mind, use the tips above to double-check your design’s readability — and make it easier for visitors to know what you are trying to say.
This content is contributed by Shanna Mallon, a copywriter for Straight North, a leading Internet marketing company in Chicago that specializes in B2B SEO, PPC, email marketing and web design. Shanna has been writing professionally online since 2007.