by D. Sproul | January 12th, 2011
I’ll admit it, I’m getting a bit older… And my eyes need that larger text and higher contrast, even with glasses (especially when using a MacBook, that shrinks that text smaller than normal!!). I used to like the look of gray text on a white page, clean, suave — until I was editing a website for many hours, and couldn’t read it clearly. I have noticed that it just takes more effort to read any website with gray body text.
Compare these two:
Think about your readers – what age are they? Will they be using modern screens that shrink the whole image or operating in bright conditions that might wash out the screen, for instance? If you want your audience to get your website’s information, keep the contrast between words and background as high as possible.
And keep your text large enough to read. Most books are printed in 10 to 12pt type. 6 pt type? Really?! (Small type web sample 1 and 2) (I noticed this a lot when Flash was more prevalent -) Know that readers can enlarge the font on most pages with HTML text, but Flash remains stubbornly fixed. Websites usually have a body text font size of 14-18pt.
Remember to include white space on your webpages, not only around the body text design, but between the lines. Increase the leading until there is a comfortable white space between lines. (Leading is a printing press term. Strips of lead were included between letter rows on old presses. The web-coding term is “line-height”.)
Keep short paragraphy widths. We all know how difficult it was to read across a wide screen in the days of early web design. Paragraphs that are too short, like the Wall Street Journal’s old format, can also be hard to read. Paragraph widths between three to six inches are easier to read.
Incorporating these simple website tips will help your customers take your message home.