今（jīn）早打（dǎ）开腾讯ISD的（de）博客，看到一篇（piān）新（xīn）的（de）文（wén）章，《迷你（nǐ）屋视觉规（guī）范简介》，赶紧看（kàn）了（le）来（lái）学（xué）习。不过给我（wǒ）抓到问题咯，臭鱼（yú）不介意我在这说（shuō）下吧（ba）：

这套规范（fàn）中的，按钮（niǔ）的第一级、第二级和文（wén）字（zì）中用于突出的第三种，红底白字（zì）和白（bái）底（dǐ）红字都不符合（hé）W3C的对比度规范。原本需要突出（chū）和强调的文（wén）字（zì）反而可能识别不（bú）易。

截（jié）图（tú）中使用（yòng）对比度检查器，基于W3C的WCAG Guideline 1.4.4和1.4.2中有相应的规定，工具的下（xià）载和具体说明可见油茶会（huì）的这篇（piān）。

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

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

那么颜色的（de）对（duì）比度就是可用（yòng）性工程师该注意（yì）的事？小（xiǎo）兔觉得这（zhè）还主要是视觉设计师的责任。

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

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

最后总结几（jǐ）点建议：

◇ 视觉设计完成后，在灰度颜色模式下审（shěn）查一下效果

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

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