Sunday, December 03, 2006

Guideline For Web Pages Readability

Most people develop a web site with such a lot of fancy stuffs to attract people to visit their site, but unfortunately, they sometimes skipped one thing: Readability.

Here's the guideline from WebCredible which can help you to make your website more readable:

1. Use contrasting colours. Text is easiest to read when the font text colour and the background colour are in high contrast. Low contrast irritates the reader and causes eye fatigue. Viewers with impaired vision may not be able to read low contrast text at all. You can check this with the Vischeck, which shows you how your website looks to colour blind people.

2. "Chunk up" your copy. That's technical talk for make your page more scan-friendly. Large blocks of dense text intimidate the reader and causes "information overload".
Here are a few easy ways to break up blocks of text:

* Use bullets and subheadings. They help get the readers attention and say "Hey you - this is important!" Coloured bullets are an easy way to add colour and visual interest to a text heavy page. Subheadings should be brief and convey a summary of the section. Too often we're tempted to use clever titles whose meaning is lost on the reader.

* Keep your paragraphs short. Breaking a long paragraph into several smaller sections invites the viewer in to read. A little white space between the paragraphs gives the site a clean look.

* Impatient visitors want to be able to glance at your page and hit the important points. You can help them by bolding important points or highlighting the text in a different colour to draw their eye.

* Use columns to control text width. Your goal here is to avoid running your text all the way across the page. Pick up any newspaper. Notice how they place the text in columns. The shorter width makes the text easier to read.

3. Avoid busy backgrounds. Nothing screams "amateur" like a noisy background that makes your text impossible to read.

4. Less is better. Many sites look like my kitchen table - always cluttered with things that don't belong there. The more extraneous items you cram on a web page, the more you confuse and distract the visitor. Websites take on an unprofessional look when you start tacking on too many items. Challenge every item on the page. Does it really need to be there? Is it still functional? Can I do without it?

5. Strive for a clean font style for maximum readability.
* Plain text is easier to read than italicised text.

* Mixed case is easier to read than all upper case. Studies have demonstrated that it takes people longer to read upper case than mixed case. Besides, upper case has become synonymous with screaming on the web - and I'm sure you don't want to scream at anyone.

* A sans-serif font is easier to read than a serif font. If you were wondering, serifs are the little marks at the end of letters. Sans serif fonts do not have serifs. Examples of serif fonts are Times New Roman and Courier New. Popular sans-serif fonts are Arial and Verdana.

6. Don't use itsy-bitsy font sizes. Nothing contributes to eyestrain faster than tiny font! Ideally it's recommended that you leave the font size scalable so users can control the size they want.

7. Make your links look like links. If you just can't bring yourself to colour your links blue (the Internet convention for links) at least underline them. And don't underline anything that isn't a link. That faux pas makes readers mad, fast. Embedded links (links within the body of the text) work well and according to a Wichita State usability study2 they are preferred by readers.

Here's the result of my personal site when being simulated with Vischeck (Deuteranope option).