可通路性（Accessibility）是使用者體驗設計中的重要一環，好的可通路性設計可以讓各種使用者更容易浏覽和使用（電腦、手機、網頁、UI等等），使得有障礙的使用者更便捷地感覺、了解、互動。理想狀态下，設計師和開發者能充分設計，讓産品的可通路性達到完美的境界，但是實際狀況下，即使添加了如此多的可通路性設計，殘障人士和行動障礙者依然用不好手機、電腦等産品，甚至有些“設計”還會人為制造障礙。
今天，我們來探讨一下可通路性設計的一些基本原則吧。當我們在探讨可通路性設計之前，請確定你的産品至少是已經“被設計好了的”，也就是說它至少得符合《Web協會可通路性指南設計規範2.0》和 《inSection 508》的基本要求，經過充分的開發和測試。
OK，我們開始進入主題了~
1、可通路性設計并非創新的障礙
要讓産品可通路性更好，并不是讓你做一個醜陋、沉悶而雜亂無章的産品。當你在設計的時候，現有的可通路性設計規範或者“推薦規範”的引入，确實會提供一定的限制，但是它們本身并不隻是一種限制，它還是你設計和探索的新方向，畢竟，你設計的最終目标是為使用者提供更好的産品——好用好看。
當我們在閱讀這些設計規範的時候，請務必記住，這些産品并不隻是為我們的同行或者設計同好來設計的，它所涵蓋的使用者各不相同。
作為設計師的你，你可以為你的同行和同好設計出極具共鳴的産品，但是從更廣泛意義上來說，他們在你産品使用者的總量中，占據的比例并不高吧？
為那些真正同你的産品進行互動的各色使用者來設計吧。為每一個人設計。你的使用者可能是盲人，可能是色盲，視力不佳者，可能是聽力障礙者，可能是有行動障礙的老人，可能是有認知障礙的使用者。你的使用者可能很年輕，也可能很老，他們可能是普通使用者，也可能是重度依賴者，也可能是對于使用者體驗有極高要求的挑剔使用者。
擁抱可通路性設計準則吧，如果你想創造一個令人驚豔的産品，那麼這是你的必經之路。
2、不要讓色彩成為你唯一的視覺傳達手段
視覺障礙者所存在的問題各不相同，色盲（男性1/12，女性1/200）、近視（1/30）以及失明（1/188）的使用者都會成為你的可通路性設計所照顧的對象。
借助色彩來呈現高亮和互補是顯而易見的設計方法。
那麼你看看下面灰階的界面中，有幾項填錯了？很多人都會人為隻有驗證碼填錯了，因為隻有驗證碼的字段有個小三角形，者表明它是有問題的。接下來整屏的灰色也沒法讓你判斷出其他的問題。
但是當你看到彩色的界面的時候就知道，實際狀況并不是這樣。設計師使用紅色來辨別錯誤的字段，四個字段其實都是錯的，對于色盲的使用者，這樣設計的可通路性簡直是災難性的。實際上，你可以使用粗邊框、粗體文字提醒、下劃線、斜體來呈現錯誤狀态，而不止是色彩。
3、確定文字和背景有充分的對比
根據WCAG的規定，文本和所處的背景的對比度至少為4.5:1。這套規範主要是要確定弱視者、色盲看清楚螢幕上顯示的文字内容。這也就意味着，如果你的文字大小為24px，19px粗體的時候，文字的灰階最少也得是#959595.
#959595 字型在白色背景上的效果。
對于最小的字型，能用的灰色最低也得到#767676，如果你的背景本身就是灰色的，那麼文字的用色還得更沉才行。
#767676 字型在白色背景上的效果。
有個名為Color Safe的工具，能夠確定你的設計用色安全。而WebAIM’s Color Contrast Checker也能幫你進行色彩對比度的檢查，確定你選對了色彩。
LOGO和被禁用的元素則不受此标準限制。這裡面包括了處于禁用狀态的按鈕或者菜單選項。不過占位符或者幽靈按鈕的内容則依然在規定限制範疇内。
接下來的案例我們看的是著名部落格平台Medium，例子中僅有“M” 這個Logo的對比度符合了标準，其他部分的灰階則很難讓人看清，更何況是視覺障礙者。
下一個案例是BBC的網站，他們使用不同的色彩來強化對比，很明顯他們的網站在對比度上做過很深的功課，因為他們的灰色最淺的用的就是#767676。
下面我還想說說Salesforce。很榮幸我能同Salesforce設計系統團隊一同工作，他們剛剛完成了Salesforce1移動用戶端的設計工作。
這個案例中很明顯，他們采用了高對比度的色彩組合。如果你沒有深入了解過他們，很難想象這些設計師對于高對比度的色彩組合有多麼執着的追求。不過我想你應該也已經明白控制對比度的好處，你的界面會更加優秀。