汪大丁

（武漢理工大學(xué) 藝術(shù)與設(shè)計(jì)學(xué)院，武漢 430070）

引言

無(wú)障礙設(shè)計(jì)的普適性原則是其所特有，是其他設(shè)計(jì)理念所無(wú)法企及的存在，正因如此，在我們的日常生活中，對(duì)于無(wú)障礙設(shè)計(jì)的關(guān)注度變得越來(lái)越高。視障者作為無(wú)障礙設(shè)計(jì)的核心人群，滿足視障者在APP使用中的需求，不僅僅是為社會(huì)做貢獻(xiàn)，也是為APP在極端環(huán)境下的使用考慮更佳的解決方案，視覺(jué)無(wú)障礙作為無(wú)障礙設(shè)計(jì)中一個(gè)最重要的組成部分，是APP界面設(shè)計(jì)中不可或缺的元素。因此，在當(dāng)前的APP界面設(shè)計(jì)中，設(shè)計(jì)師有必要對(duì)用戶在APP的不同體驗(yàn)以及需求進(jìn)行分析，總結(jié)視覺(jué)無(wú)障礙設(shè)計(jì)的特性和作用，探尋具體有效的應(yīng)用形式和應(yīng)用方法。

一、視覺(jué)無(wú)障礙概況

（一）視覺(jué)無(wú)障礙設(shè)計(jì)

作為聯(lián)合國(guó)提出的新主張，無(wú)障礙設(shè)計(jì)這個(gè)概念的名稱在1974年被首次提出①。為達(dá)到“無(wú)障礙”的美好目標(biāo)，它不僅專注于對(duì)一切為人所用的環(huán)境與物體進(jìn)行設(shè)計(jì)，致力于對(duì)人類的動(dòng)作反應(yīng)、行為意識(shí)進(jìn)行研究，還在為清除那些讓用戶感到困擾的交互操作以及界面設(shè)計(jì)提供指導(dǎo)。盡管它不能做到真正意義上的平等，也不能使每一個(gè)人都滿意，但是它的設(shè)計(jì)理念是向這個(gè)方向發(fā)展的。

在WCAG 2.0②（Web Content Accessibility Guideline）Web內(nèi)容無(wú)障礙指南中，將產(chǎn)品界面設(shè)計(jì)中遇到的主要障礙類型劃分為了視力障礙（Visual impairments）、聽力障礙（Hearing impairments）、運(yùn)動(dòng)障礙（Motor impairments）和智力障礙（Intellectual disabilities），人類是擁有視覺(jué)、聽覺(jué)、觸覺(jué)等諸多感知“通道”的整合體。其中，視覺(jué)無(wú)障礙是一個(gè)可以面向所有公眾的視覺(jué)設(shè)計(jì)系統(tǒng)，該系統(tǒng)的最終目標(biāo)是創(chuàng)建一個(gè)無(wú)障礙的可視環(huán)境，使信息盡可能準(zhǔn)確地傳達(dá)給公眾。

（二）視覺(jué)障礙人群分類

視覺(jué)障礙人群主要來(lái)自于以下四個(gè)方面：視覺(jué)敏銳度下降的人群、對(duì)比靈敏度下降的人群、色彩的感知度發(fā)生損壞的人群以及有效視野改變的人群。用戶視覺(jué)的敏銳度下降即人眼能夠分辨物體細(xì)節(jié)的能力下降，例如近視、遠(yuǎn)視或白內(nèi)障會(huì)導(dǎo)致用戶視覺(jué)敏銳度下降。在視覺(jué)敏銳度較弱的普通用戶眼里，圖像的細(xì)節(jié)會(huì)變得模糊，只有較大的圖像輪廓才能讓他們得以正確辨識(shí)，如圖1中A；對(duì)比的靈敏度也就是眼睛在前景色和較弱的背景色之間分辨明亮度的能力。對(duì)比靈敏度較低的用戶看到的圖像會(huì)呈現(xiàn)透過(guò)陽(yáng)光或沙塵看到的樣子，蒙了一層厚厚的灰色，如圖1中B；而對(duì)于色彩的感知度即對(duì)于色相的理解程度，色弱或者全色盲的感知度下降是指眼睛在辨色過(guò)程中有環(huán)節(jié)出了問(wèn)題，辨別顏色的能力發(fā)生了障礙。而其中色盲群體的問(wèn)題還可以細(xì)分，色盲以紅綠色盲較為常見，色盲對(duì)于人群的感知度可以大致分為紅色盲、綠色盲、藍(lán)色盲和全色盲，如圖1中C；有效的視野靈敏度發(fā)生改變由視網(wǎng)膜的病變導(dǎo)致。視野消失可能發(fā)生在視野中部（如青光眼），也有可能是發(fā)生在視野的周邊（如急性糖尿病或白內(nèi)障引起的急性視網(wǎng)膜病變），他們能夠看到的物體圖像是損壞的，如圖1中D。除了色彩感知度損壞對(duì)于普通人來(lái)說(shuō)為隨機(jī)變量以外，視覺(jué)敏銳度下降、對(duì)比靈敏度下降、有效視野改變都為固定變量，時(shí)常在各年齡段的人群中出現(xiàn)，APP為當(dāng)代人不可或缺的日用產(chǎn)品，解決消費(fèi)者在使用中的視覺(jué)障礙問(wèn)題是當(dāng)代設(shè)計(jì)研究人員的當(dāng)務(wù)之急。（圖1）

圖1 視覺(jué)障礙人群模擬視圖

二、APP界面設(shè)計(jì)中視覺(jué)無(wú)障礙的應(yīng)用

（一）視覺(jué)無(wú)障礙應(yīng)用于APP界面設(shè)計(jì)中的必要性

我們每天都會(huì)在使用APP的時(shí)候頻繁地接觸到驗(yàn)證碼，驗(yàn)證碼作為APP校驗(yàn)身份的首要工具，往往在入口處就給有視力障礙的人群帶來(lái)了不好的體驗(yàn)，視障者往往在入口處就失去了正常的使用資格，而常用的讀屏軟件也不能解決驗(yàn)證碼圖片的不清晰和可讀性差等問(wèn)題。（圖2）

圖2 校驗(yàn)身份的驗(yàn)證碼樣式圖

除此之外，作為當(dāng)代互聯(lián)網(wǎng)行業(yè)最常見的營(yíng)銷手段——紅包，采用了傳統(tǒng)的深入人心的黃紅配色，但在紅綠色盲的眼中，紅色近似于灰色和黃灰色，這使得有視覺(jué)障礙的人群在使用這項(xiàng)活動(dòng)時(shí)體驗(yàn)感極差，甚至連最基本的文字信息的可視性都會(huì)受到影響。（圖3）

圖3 紅包界面的色盲模擬視圖

大型的手機(jī)硬件廠商一般都會(huì)因?yàn)榘沧客耆_源的技術(shù)特點(diǎn)來(lái)內(nèi)置自己的軟件，為了滿足系統(tǒng)的精簡(jiǎn)與流暢，廠商往往直接刪除掉安卓系統(tǒng)里內(nèi)置的無(wú)障礙操作系統(tǒng)服務(wù)，這樣做雖然滿足了絕大部分安卓手機(jī)目標(biāo)群體的需求，但也誤傷了小部分的弱勢(shì)群體的利益，使得有視覺(jué)障礙的人群拿到了一個(gè)無(wú)法很好地使用的“閹割”手機(jī)。

綜上所述，雖然現(xiàn)有產(chǎn)品在開發(fā)中會(huì)出現(xiàn)迎合商業(yè)價(jià)值而做出妥協(xié)放棄無(wú)障礙設(shè)計(jì)的情況，但筆者認(rèn)為，在現(xiàn)如今這樣供大于求，消費(fèi)品泛濫的時(shí)代，將消費(fèi)者進(jìn)行詳細(xì)劃分后，仍然可以在一些小的方面找到切入點(diǎn)，在APP的界面設(shè)計(jì)中考慮視覺(jué)無(wú)障礙，不僅為視障者解決了實(shí)際的困難，也使得普通用戶能夠擁有更好的使用體驗(yàn)。

（二）視覺(jué)無(wú)障礙應(yīng)用于APP界面設(shè)計(jì)中的方式

1.提高產(chǎn)品對(duì)比度

根據(jù)2018年6月5日，W3C的可訪問(wèn)性指南工作組（Accessibility Guidelines Working Group，AG WG）發(fā)布的Web內(nèi)容可訪問(wèn)性指南（Web Content Accessibility Guidelines，WCAG，2.1）中的正式推薦標(biāo)準(zhǔn)③，文字和背景色的對(duì)比度至少是4.5∶1；如果是大于等于24 px/ 19 px bold 的文字，對(duì)比度至少是3∶1。這項(xiàng)規(guī)范可以幫助視障用戶更好地使用互聯(lián)網(wǎng)產(chǎn)品。（圖4）

圖4 web應(yīng)用程序的推薦對(duì)比度

使用滿足對(duì)比度標(biāo)準(zhǔn)的顏色，不僅不會(huì)影響產(chǎn)品的美觀，而且可以提升產(chǎn)品的無(wú)障礙性。以Google Chrome為例，新的配色方案符合WCAG 2.1規(guī)范，有足夠高的對(duì)比度。所有的設(shè)計(jì)元素，都能最大程度地滿足WCAG 2.1 AAA 標(biāo)準(zhǔn)，在明暗兩種背景下的配色，幾乎都滿足 WCAG 2.1 AAA 標(biāo)準(zhǔn)（color contrast ratio >4.5）。此外，Google 在深淺背景上使用的顏色，都不是直接套用的標(biāo)準(zhǔn)色，而是根據(jù)不同背景調(diào)整后的顏色。而即使是使用標(biāo)準(zhǔn)色，Google也盡量使之和白背景的對(duì)比度滿足AA 標(biāo)準(zhǔn)（黃色、橙色例外）。

2.圖形結(jié)合顏色

在界面設(shè)計(jì)時(shí)，不能只依靠顏色傳達(dá)諸如狀態(tài)指示、視覺(jué)控件、實(shí)時(shí)響應(yīng)等信息。如果只用顏色進(jìn)行區(qū)分，在一定程度上會(huì)造成用戶的不方便、甚至不能分辨圖像中顏色的區(qū)別。不同視障者看到的畫面是不同的，所以同時(shí)使用多種視覺(jué)線索傳達(dá)重要信息是很必要的，顏色的使用只是作為強(qiáng)調(diào)或補(bǔ)充已經(jīng)能看明白的信息。如圖5所示，在登陸入口中，視力正常的用戶能輕易分清郵箱地址是錯(cuò)誤狀態(tài)，但色盲用戶（綠色色盲）就完全看不出。解決辦法有很多種，比如采用圖形結(jié)合顏色的方式：在登陸入口的優(yōu)化版本上，除了使用顏色區(qū)分的形式以外，還可以將錯(cuò)誤狀態(tài)的形狀改為菱形，以區(qū)別于正確狀態(tài)下的圓形形狀，加上“請(qǐng)輸入正確的郵箱地址”之類的提示性文字信息，來(lái)表明錯(cuò)誤狀態(tài)。（圖5）

圖5 登陸入口視覺(jué)無(wú)障礙優(yōu)化視圖

3.不同元素做明確的區(qū)分

表單輸入框的形式有很多，現(xiàn)代風(fēng)格的表單設(shè)計(jì)往往傾向于極簡(jiǎn)主義，拋棄了傳統(tǒng)表單的基本屬性，例如清晰的邊框、明顯的標(biāo)簽，這都大大降低了用戶的使用體驗(yàn)。傳統(tǒng)輸入框樣式界限明晰標(biāo)簽清楚，中間可填充顏色。輸入框有明確的邊界，這對(duì)用戶的輸入特別是有視覺(jué)障礙的用戶來(lái)說(shuō)十分重要。清晰的邊框，可以讓用戶明確知道點(diǎn)擊目標(biāo)的位置和大小。如果沒(méi)有清晰的邊框，視障者可能很難找到輸入框的位置確定輸入框的面積，從而在使用時(shí)變得異常困難。（圖6）

圖6 表單視覺(jué)無(wú)障礙優(yōu)化視圖

4.增加提示信息

文本提示能時(shí)刻告訴用戶輸入框的目的，但是常用的視覺(jué)設(shè)計(jì)手法會(huì)出現(xiàn)在文本框中輸入占位字符這樣的形式，這樣的處理手法實(shí)際上是不好的，用戶在實(shí)際操作時(shí)，往往因?yàn)檩斎雰?nèi)容將占位字符抵消掉，而使用戶忘記輸入的目的，如果采用在文本框外增加文本提示的視覺(jué)設(shè)計(jì)，當(dāng)用戶在輸入內(nèi)容的時(shí)候就可以時(shí)刻提醒用戶自己在輸入些什么?？梢愿玫刈龅揭曈X(jué)無(wú)障礙設(shè)計(jì)，滿足各種用戶的需求。（圖7）

圖7 文本提示信息無(wú)障礙優(yōu)化視圖

三、結(jié)語(yǔ)

（一）視障用戶仍然是產(chǎn)品銷售的目標(biāo)用戶

世界上約有4%的人口視力低下，0.6%視盲。這些用戶需要借助屏幕閱讀器/盲文閱讀器的幫助來(lái)操作手機(jī)。7～12% 的男性有不同形式的色覺(jué)缺陷（如色盲），他們難以區(qū)分某些特定顏色組合。低視力狀況隨著年齡的增長(zhǎng)而增加，50歲以上的人中一半以上有一定程度的低視力狀況。全球增長(zhǎng)最快的人群是60歲以上的人，過(guò)了40歲以后大多數(shù)人都需要老花鏡才能清楚地看到小物體或文字。如果能將視覺(jué)無(wú)障礙很好地落實(shí)在APP界面設(shè)計(jì)中，那么全世界將有10%的人從中獲益。此外，視覺(jué)無(wú)障礙也不僅僅是出于人道主義方面的考量，它產(chǎn)生的商業(yè)效益仍然十分可觀。

（二）視覺(jué)無(wú)障礙可以保證APP在極端情況下仍可以使用

當(dāng)代的設(shè)計(jì)有很多各方面都很不錯(cuò)的產(chǎn)品，例如蘋果公司的系列產(chǎn)品，但并不是每個(gè)人都有機(jī)會(huì)去使用它，現(xiàn)實(shí)中的大多數(shù)人，用的仍然是老舊、性能差的手機(jī)。大多數(shù)的人會(huì)在強(qiáng)烈的陽(yáng)光下、在行駛的交通工具上以及在昏暗的環(huán)境中使用各種APP。如果沒(méi)有視覺(jué)無(wú)障礙的設(shè)計(jì)意識(shí)，APP上線后很可能在真實(shí)的使用場(chǎng)景中無(wú)法正常使用。所以為了讓使用條件不是很好的用戶仍然能正常使用APP，也為了讓更多視障者能更好地操作APP，將視覺(jué)無(wú)障礙應(yīng)用到APP界面設(shè)計(jì)中，是一件非常有必要的事?！?/p>

注釋：

①李斌，萬(wàn)莉君.從無(wú)障礙設(shè)計(jì)邁向通用設(shè)計(jì)[J].包裝工程，2007，28（8）：186-188，225.

② 張昆，主編.信息無(wú)障礙 提升用戶體驗(yàn)的另一種視角[M].北京：清華大學(xué)出版社，2018.

③萬(wàn)維網(wǎng)聯(lián)盟（中國(guó)）.Web內(nèi)容可訪問(wèn)性指南[EB/OL].（2018-06-05）http://www.chinaw3c.org/archives/2145/.