Web Quality -Readability

Proper use of fonts and colors can make your website easier to read.

Pay attention to color contrast

For people with poor eyesight or for poor display devices, white text on a black background or black text on a white background is the best.

Gray text on a light background has poor contrast:

Grey text on a white background (#EEEEEE)

Grey text on a white background (#CCCCCC)

Grey text on a white background (#AAAAAA)

Grey text on a white background (#888888)

Grey text on a white background (#666666)

Grey text on a white background (#444444)

Grey text on a white background (#222222)

Grey text on a white background (#111111)

Gray text on a dark background also has poor contrast:

Grey text on a black background (#222222)

Grey text on a black background (#444444)

Grey text on a black background (#666666)

Grey text on a black background (#888888)

Grey text on a black background (#AAAAAA)

Grey text on a black background (#CCCCCC)

Grey text on a black background (#DDDDDD)

Grey text on a black background (#EEEEEE)

Certain combinations - such as black and red, black and blue, yellow and green - can cause visual fatigue:

Black text on a red background

Black text on a blue background

Yellow text on a green background

These combinations are not bad:

Black text on a grey background

Black text on a light blue

Black text on antique white

White text on dark blue

For readers with weak eyesight, too close letter spacing can cause considerable reading difficulty.

Text with moderate letter spacing is easier to read.

Text with too little letter spacing is hard to read.

The following line spacing is easy to read

Text with good line spacing
is easier to read

The following line spacing is hard to read

Text with small line spacing
is hard to read

This font is easy to read....

This font is hard to read....

Ordinary fonts are easy to read.

Italic fonts are not so easy to read.

Other Extensions