首页 > 编程教程 > 网站品质 教程
2016
10-20

Web 品质可读性

Web 品质- 可读性


正确使用字体和颜色可使您的网站更易阅读。


留意颜色的对比

对于视力不太好的人或者对于不太好的显示设备来说,黑底白字或者白底黑字是最佳的。

在亮色背景上的灰色文字,对比度是很差的:

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)

在暗色背景上的灰色文字,其对比度同样很差:

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)

某些搭配 - 比如黑色和红色,黑色和蓝色,黄色和绿色 - 都会使人产生视觉疲劳:

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

这些搭配并不糟糕:

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


留意字母的间距

对于视力比较弱的读者,比较近的字母间距会带有不小的阅读困难。

文字间距适中的文本就比较容易阅读了。

文字间距少的文字难以阅读。


当心你的行距

以下行距易于阅读

具有良好的行距的文本
更易阅读

以下行距难以阅读

行距小的文本
难以阅读


避免花哨的字体

这字体容易阅读....

这种字体是难以阅读....


尽量少用斜体

普通字体易于阅读。

斜体字体不那么容易阅读。

关注编程技巧 回复19领350本编程书籍

编程技巧