今早打开（kāi）腾讯ISD的（de）博客（kè），看到一篇新的文章，《迷（mí）你屋视（shì）觉规范简介》，赶紧看了（le）来学习。不过给我抓到问题咯，臭鱼不介意我在（zài）这说（shuō）下吧：

这（zhè）套规范中的，按（àn）钮的第一级、第二级和文字中用于突出的第三种，红底白字和（hé）白底红字都（dōu）不符合W3C的对比度规范。原本需要（yào）突出（chū）和强调（diào）的文字（zì）反而可（kě）能识别不易（yì）。

截图（tú）中（zhōng）使（shǐ）用（yòng）对比（bǐ）度（dù）检查器，基于W3C的WCAG Guideline 1.4.4和1.4.2中有相应的规（guī）定（dìng），工具的下载（zǎi）和具体说明可见油茶会的这篇。

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

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

那么颜色（sè）的（de）对比度就是可用性（xìng）工程师该（gāi）注意的事？小兔觉得（dé）这还主（zhǔ）要是视（shì）觉设计（jì）师的责任。

在大学读（dú）编排设计的（de）时（shí）候，老师就要求我（wǒ）们完成前看看自（zì）己的设计在黑白环境中是什么样子。那时不（bú）论我的老师（shī）还是我（wǒ）自己，都没有什么关于可用性的认识，不曾（céng）想（xiǎng）到过色（sè）盲色（sè）弱看到会如何，只是为（wéi）了保证作（zuò）品的（de）表（biǎo）现力。但这却是一个简单有用的（de）习惯，在这年头Photoshop里去（qù）色看一下就好了。

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

最后总（zǒng）结几点建议（yì）：

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

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

◇ 可（kě）用性不是一个人或者一个岗位的事情，视觉设计、交互设（shè）计、可用性工（gōng）程师、开发人（rén）员乃至（zhì）PM都应该去留心和注意的