Website Design Blog. Evoart

I get the feeling that the average person’s appreciation of accessibility as an ideal to design by is at about the level that mine was when I first started designing for the web. No more than a fraction of my audience could have disabilities, right? So, why should I waste my creative zeal to appeal to a marginal minority? To answer this question reasonably, a designer must realize the purpose of what they are doing…

Content on the internet is meant to be read, and thus as a smart designer, it is your job to ease the user’s reading process as much as you can. Accessibility doesn’t just apply to designing for people with diagnosable handicaps. It should apply to any case where your text is harder to read than it could be. As a designer, one of your top priorities should be maintaining text readability.

accessible

adjective
1. Easily approached, entered, or used.

When you have Photoshop open and the CSS is flowing, it’s very easy to get caught up in your site’s visual appeal and forget that its purpose is to convey a message. Here are five tips that, when used wisely, will help you maintain the accessibility of your site without sacrificing aesthetics.

1. Keep contrast in mind.

In order to be readable, text’s color must be in stark contrast to that of the background upon which it is read. Text whose color too closely matches that of the background is very hard to read and will leave your readers squinting at their screens, unable to make out what you have to say. From experience we all know this is extremely irritating and should be avoided like the plague.

If your site’s background color is white, make your text as dark as you feel comfortable with. Inversely, if your site has a dark color scheme, lighter font colors are optimal.

2. Keep font size large enough to read with ease

One of the most widespread typographic problems on the internet today is text that is too small. Small text can look crisp and neat, but the overall purpose of text is not to be visually appealing; it is to be read. On the other side of the spectrum, text that is too large isn’t good either. Nothing says 1997 like a page full of size 18 Comic Sans.

Don’t get me wrong. Attractive text that fits with the overall scheme of a design is ideal. However, there’s is a fine line between aesthetically-pleasing and poorly-designed text. Granted, the user can resize the text with a few keystrokes or a flick of the mouse wheel, you shouldn’t force them to do so in the first place. The trick is to find the sweet spot between font that’s too small to read with ease and Geocities-esque characters the size of a small car. In my experience, this sweet spot is around 14pt, depending on the font.

3. Sans vs Serif Fonts

This one’s more open to creativity, but it’s good to keep in mind that serif fonts (Times, Georgia) are generally easier to read than sans-serif (Verdana, Arial, Helvetica). This is more theoretical than factual, and is based on studies testing how quickly people can read text of varying font types.

Sans and serif fonts tend to give different connotations when reading, as well. Serif fonts seem more scholarly and official, while sans-serifs feel more easy-going and laid-back, if you will. It’s kind of like the “Mac vs. PC” Apple ads, except here it’s actually a bit relevant.

4. Keep lines around 70 characters long

Studies have shown that text is easier to read and digest when the length of lines is around 70 characters or less. Any longer than this and people can get lost and bored more quickly. To keep your readers engaged, it can be wise to tweak your div widths and padding until you reach the 60-70 character level. Thin designs tend to look clean too, so it probably won’t hurt.

5. Use your head and those of others

Chances are if you keep accessibility and ease of reading in mind when designing, you can avoid the common pitfalls of typographic design without much trouble. But just in case you can’t, ask other people to review your designs and specifically ask them if they find your text easy to read. Note that while it is good to have a fellow designer review your work, criticism from a non-designer should be accepted and appreciated in kind, because your end product is undoubtedly aimed at “normal” people.

Closing Thoughts…

As a smart designer, typography and text should be at the top of your list of priorities. On the web, text is still the primary means of communication and thus great care should be taken to ensure that your written words can be easily read.

This article was written by Evan Meagher, an American student and web designer who advocates standards compliance and simplicity in design. Visit him at http://evanmeagher.net/. Interested in writing for Evoart? Contact us.