軟件可訪問性設計與測試漫談——高對比度

什么是對比度

在我們常規的體檢項目中,有兩項眼科檢查大家應該非常熟悉:視力和辨色力。醫生會讓你先坐在一張板凳上,遮住一只眼睛,對著一張寫滿E字的視力表,分辨每個E字的朝向。你能分辨出越小尺寸的E字朝向,說明你辨別細小或者遙遠物體的能力越高。接著又指著桌上一本花花綠綠的本子,讓你辨認其中某幾張圖片上相近顏色組成的數字,檢查你眼睛分辨顏色的能力如何。
其實,我們的眼睛除了分辨圖像的形狀大小以及顏色外,還能區分明暗,也就是對比度。這里借用Pelli-Robson對比敏感度圖表來感受下,第一行的黑色的文字與白色的背景是最容易識別和區分的,之后每一行的文字會漸漸變淡,越難與背景區分。我們常見的眼科疾病,如:白內障、青光眼等,都會使患者的對比度視力下降。


Pelli-Robson對比敏感度圖表
Pelli-Robson對比敏感度圖表

那么,有什么方法可以讓對比度不敏感的用戶也易于使用我們的產品呢?答案是——提高前景與背景顏色的對比度!

對比度要提高多少比較合適?

目前WCAG 2.0 (Web Content Accessibility Guidelines)的要求是:

  • 對于普通字體大小(即瀏覽器字體大小默認值,不同瀏覽器默認值不一樣,一般在9.5磅~10.5磅),建議對比度至少大于等于4.5,推薦對比度大于7.0
  • 對于大尺寸字體(字體大小在18磅或者是14磅以上的粗體字),建議對比度至少大于等于3.0,推薦對比度大于4.5
WCAG 2.0文本對比度

我們來看一組實際效果。下圖分別展示了當字體大小為9磅、14磅粗體和18磅時,對比度為3.0,4.5和7.0的顯示效果??梢悦黠@看到當字體較小、前景與背景的對比度較低時,文字越難以閱讀。當增大字體或是增強對比度時,文字越容易識別。

對比度示例 從左到右對比度分別為3.0、4.5和7.0

如何開啟高對比度模式?

目前所有主流的操作系統,無論是電腦端的Windows、OS X,還是移動端的Android和iOS,都支持高對比度模式。
這里介紹下Windows的開啟方式:

  • 想要快速開啟和關閉高對比度,可以通過同時按下左Alt+左Shift+PrtScr來實現
  • 想要更改高對比度主題,可以右擊桌面,然后選擇“個性化”。移動滑塊到下方,可以看到4個默認高對比主題
茄子快傳啟用高對比度模式后與正常模式下顯示效果對比

我開啟了高對比度模式,為什么有些軟件界面沒有任何變化呢?

這是個好問題!
目前國內大部分軟件對于可訪問性的支持并不好,可以說幾乎不支持。當用戶開啟了系統的高對比度模式,這些軟件并不會檢測用戶的這一行為并將界面切換成適合高對比度的風格。

聯想預裝軟件支持高對比度嗎?

聯想從2014年開始正式內部推廣可訪問性,旗下的大部分軟件已逐步開始對可訪問性功能的支持,包括高對比度。這是個逐步完善的過程,可能還有很多不完善的地方。如果覺得聯想的哪款軟件使用起來不方便,歡迎發郵件給wuhf2@lenovo.com,我們非常珍視您的意見。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,104評論 25 708
  • 唐詩宋詞,詩有李白,詞有蘇軾。 詩人余光中在《憶李白》中對他的評價是:“酒入豪腸,七分化作月光,剩下的三分,嘯成了...
    喜鵲與烏鴉閱讀 380評論 2 2
  • 三 運營部門三的經理是河。從花城分公司到涼城分公司是再到軍城分公司,一直都跟隨著芬。運營部門三下的一部分小部...
    韓馳冰閱讀 230評論 0 0
  • 古人言:“女子無才便是德”。在封建衛道士看來,女子賢惠,主持家務,靠男人為生才是真理。因此,古代女子一旦被休,今后...
    玄凝閱讀 704評論 1 2
  • 上圖是用Guardian’s list 中"一生要聽的1000首歌”的歌曲的數據,描繪的馬賽克圖,數據主要分為年份...
    kevin_leee閱讀 18,004評論 0 6