Ensuring Your Web Pages Are Readable
Contrast
Be sure to use adequate contrast in your web designs. Text becomes easier to read when the font text color contrasts with the background. Lower contrast can cause problems and eye strain, not only this but it can also make some colors almost invisible depending on the users monitor settings. While a low contrast might look correct on your screen, it could just look like the same color on another.
You also have to take into consideration the visually impaired users that may visit your site; they might not be able to read low contrast text at all. There’s several tools available online that you can use to check this, allowing you to see how your website appears to color blind people.
Skimming/Scanning
Most users prefer to scan through a page before reading properly, it determines if the whole text is worth their time to read. Large blocks of text can look intimidating to users that like to scan through text, seen as an information overload.
You can quickly remedy this by splitting up your text, if you use descriptive headers you can make it much more inviting to read. Use headers to summarize what a section is about, not only does it make the text more inviting, but it lets users find the relevant information faster.
You should try to keep your paragraphs short, the white space in-between them can be seen as breathing room to let the user ‘digest’ what they’ve just read. Shorter paragraphs also improve the websites design overall, making it look cleaner and more thought out.
There are several studies that look into line-length too, concluding that readers prefer smaller lines even though they can read longer ones with less effort. You can use this to your advantage by starting your page with shorter lines, eventually growing them into longer ones past a certain threshold.
Textured Backgrounds
A common web design mistake is having a complex background image behind your paragraphs of text. It makes text almost impossible to read, forcing your eyes to guess and work out which bits are text and what actually belongs to the background image. A low contrast background texture or solid color works best here, one that contrasts with the text on top of it.
The Balance of Cluttered & Organized
It’s a fine balance: it’s the difference between making your readers guess where content belongs, and making navigation and reading effortless. “Less is more” doesn’t always ring true in this case, it’s more about organizing your page based on what the reader expects and cutting out anything that isn’t vital. Keep it concise.
Clean Fonts & Spacing
It’s a well known fact that sans-serif fonts are easier to read vs serif fonts. Serifs are the small marks or decorative elements at the ends of letters, these are great to use for headings and titles. Popular sans-serif fonts like Arial and Verdana are used widely among the web for the main body of text but you can find others that work just as well, if not better. Spacing can make or break a page; if your text is all bunched up in the corner of the page then it instantly looks out of place. Other than font-size; line-height, letter-spacing and font-weight are just as important in improving the readability of your text.
Obvious Links
You shouldn’t make readers hunt for your links among the rest of your text. Make them stand out, just not so much that they overpower the surrounding text. By default, they’re underlined and blue for a reason. If you remove these styles, be sure to make them stand out in other ways.
