Latest web development tutorials

Web quality readability

Proper use of fonts and colors will make your site easier to read.


Pay attention to color contrast

For the vision is not good is not good for the people or the display device, a black and white or black and white is the best.

Gray text on a bright background, the contrast is poor:

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)

In gray text on a dark background, the contrast also poor:

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)

With some - such as black and red, black and blue, yellow and green - will produce visual fatigue:

Black text on a red background
Black text on a blue background
Yellow text on a green background

The match was not bad:

Black text on a grey background
Black text on a light blue
Black text on antique white
White text on dark blue


Pay attention to the letter spacing

For the weak eyesight of readers, relatively close spacing of the letters with no small difficulty reading.

Moderate character spacing text easier to read.

Text spacing small text difficult to read.


Watch your spacing

The following spacing easy to read

With good spacing of text easier to read

The following spacing is difficult to read

Leading small text difficult to read


Avoid fancy fonts

This font is easy to read ....

This font is hard to read ....


Minimize the use of italics

Normal font easy to read.

Italic font is not so easy to read.