今早打开腾讯ISD的（de）博（bó）客，看（kàn）到一（yī）篇新的文（wén）章，《迷你屋（wū）视（shì）觉（jiào）规范（fàn）简（jiǎn）介》，赶紧（jǐn）看了来学习。不过给我（wǒ）抓到（dào）问（wèn）题咯，臭鱼不介意（yì）我在这说下吧（ba）：

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

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

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

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

那（nà）么颜色的对比度就（jiù）是可用性工（gōng）程师该注（zhù）意的事？小兔觉得这（zhè）还主要（yào）是视觉（jiào）设计师的责任。

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

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

最后（hòu）总结几点建议（yì）：

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

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

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