今早（zǎo）打（dǎ）开腾（téng）讯ISD的博客，看（kàn）到一篇新的文章，《迷你（nǐ）屋视觉（jiào）规范简介》，赶（gǎn）紧看了来（lái）学习。不过给我抓到问题咯，臭（chòu）鱼不介意我在这说下吧：

这套规范中的，按钮的第一级、第（dì）二级和文字中用于突出（chū）的第三种，红底白字和白（bái）底红字都不符合（hé）W3C的对比度（dù）规范。原本需要突出和强（qiáng）调的（de）文字反而可（kě）能识别不易。

截图中（zhōng）使（shǐ）用对（duì）比度检查器，基于W3C的WCAG Guideline 1.4.4和1.4.2中（zhōng）有相应的规（guī）定（dìng），工具（jù）的（de）下载和（hé）具体说明可见油茶会（huì）的（de）这篇（piān）。

这（zhè）是（shì）一个很好用也很科（kē）学的（de）工具，小兔把它放在Windows的快速启动栏里，而且推荐（jiàn）给了同事（shì）们。当初刚开始的时候，我们有多（duō）年（nián）设计经验的视觉设计师（shī）不（bú）以（yǐ）为（wéi）然，认为（wéi）靠肉眼识别就能辨别对（duì）比度。不过后来给我抓到了几回，靠经验和肉眼也（yě）会有（yǒu）漏（lòu）网的时（shí）候啊。现在连（lián）我们的运营（yíng）编辑都把这个（gè）要了（le）去，为了保证自己（jǐ）做的推（tuī）荐图片够醒目:D

注意（yì）文字颜色的对比度是件容易（yì）被忽略（luè）的事。据我（wǒ）所知腾讯（xùn）对一些产品的视（shì）觉风格是做（zuò）用（yòng）户研究的（de），其中也包括色彩的（de）定位。和臭（chòu）鱼（yú）提（tí）到（dào）这个时候，他说自己也就是（shì）看着（zhe），觉得（dé）对比（bǐ）度还算清楚。在（zài）正常人在正常环境中可能还不觉得什么（me），但是（shì）如果（guǒ）在（zài）一些表（biǎo）现欠佳的显示环境、或者是色盲（máng）色弱（ruò）、视力（lì）欠佳的人看来，就显吃（chī）力了。即使（shǐ）是正常人，面（miàn）对对比度欠佳的文字长时间阅读也会容易产（chǎn）生疲劳，而浮躁的（de）色彩会令用户对（duì）产品的情感无形中产生（shēng）影响。

那（nà）么颜色的对比度就是可用性（xìng）工程师该注意的事？小兔觉得这还主要是视觉设计师（shī）的（de）责任。

在大（dà）学读编排设计的时候（hòu），老师就要求我们完成前看（kàn）看自（zì）己的设（shè）计在黑白环境中是什么样子。那时不论我的老师还是我自己，都没有什么关（guān）于可用性（xìng）的（de）认识，不曾想到（dào）过（guò）色盲色弱看（kàn）到会如何（hé），只（zhī）是为了保证（zhèng）作品的表现力（lì）。但这（zhè）却是一个（gè）简单有用（yòng）的习惯，在这年头Photoshop里（lǐ）去色看一下就好了。

回忆当（dāng）初学到色彩构成的（de）时候，也被老师叮嘱过注意黄色（sè）这类高（gāo）明度（dù）色彩（cǎi）的使（shǐ）用。虽然近两年已经不做（zuò）视觉设（shè）计，但是大（dà）学（xué）中所学和国（guó）际商业美术设计师认证，依（yī）然（rán）带给我不少现在（zài）工（gōng）作中受用的东西。即使不谈可（kě）用性（xìng），这也（yě）是一个（gè）专（zhuān）业的视（shì）觉设计师（shī）应该注（zhù）意的问题。

最后总结几点建（jiàn）议：

◇ 视（shì）觉（jiào）设计完成后，在灰度颜色（sè）模式下审（shěn）查一（yī）下效果

◇ 注意网页（yè）上需要突出的、以（yǐ）及正文文字的对比度

◇ 可用性不（bú）是一个人（rén）或者一个岗位的（de）事情，视觉（jiào）设计、交互设计、可（kě）用性工程（chéng）师、开发（fā）人员乃至PM都应该去（qù）留心和注意的