為什么說(shuō)網(wǎng)站設計要超越顏色
雖然這篇文章比較老，但是確實(shí)說(shuō)到了我們在做網(wǎng)頁(yè)設計中容易忽略的一個(gè)問(wèn)題和一個(gè)使用群體，因此特意拿出來(lái)重新進(jìn)行翻譯整理，希望能夠幫助大家做出更好的設計!
顏色，是個(gè)強有力的工具，特別是對于設計領(lǐng)域來(lái)說(shuō)。
它能夠傳遞情緒和感情，給設計增添存在感并提高品牌認知度。但是我們經(jīng)常看到，存在色覺(jué)障礙的用戶(hù)會(huì )在五顏六色的界面上因為導航而痛苦不堪。考慮到這部分人，我經(jīng)常建議設計師要時(shí)時(shí)牢記無(wú)障礙性這個(gè)問(wèn)題，并在灰度格式下對網(wǎng)頁(yè)進(jìn)行測試，保證在顏色無(wú)法正常表現的情況下也能達到完善的實(shí)用性。
存在色覺(jué)缺失的用戶(hù)可能會(huì )難以分辨某些顏色之間的區別。最常見(jiàn)的色覺(jué)缺失就是紅綠色盲，這個(gè)人群看紅色和綠色感覺(jué)是一樣的。
下面是一張來(lái)自Color Matters的常見(jiàn)色盲表格圖示。
通過(guò)這張表格我們發(fā)現，要填寫(xiě)這張在線(xiàn)表單，就必須靠考慮到存在這種色盲問(wèn)題的用戶(hù)能不能看到紅色的錯誤信息。
再來(lái)看看Avis給我們的主頁(yè)預訂表單。我在沒(méi)有填寫(xiě)任何東西的時(shí)候點(diǎn)擊了“繼續”按鈕，所顯示的“請輸入接取位置”信息是以純紅色文字顯示的。
下面我們使用Colblindor這款色盲模擬器看看透過(guò)紅色色盲用戶(hù)的眼睛看待同一布局時(shí)的情形。
我們發(fā)現紅色錯誤信息的高亮對比效果沒(méi)有了，取而代之的是綠色的文字，這些文字和頁(yè)面上黑色的內容幾乎完全融合，非常容易看不到。
再看一個(gè)來(lái)自Budget主頁(yè)預訂表單的示例，這里我點(diǎn)擊了“以客人身份繼續”的按鈕，收到了錯誤信息。在這種情況下，紅色的錯誤信息表現為紅色文案遮蓋住了輸入框的標簽，同時(shí)實(shí)際輸入框外面有一圈紅色邊框。
下面我們使用色盲模擬器看看透過(guò)綠色色盲用戶(hù)的眼睛看是什么效果。
我們發(fā)現紅色看不見(jiàn)了，取而代之的是淡綠色。綠色的文案沒(méi)有足夠的對比效果，無(wú)法引起人的注意，同時(shí)輸入框的邊界也沒(méi)有了高亮效果。
▌結束語(yǔ)
不要單純依靠顏色來(lái)傳遞網(wǎng)上的信息。相反，要結合文字、形狀、網(wǎng)格和空間等多種設計基本要素，并給重要的元素分配較多的重量。
The Home Depot的賬戶(hù)注冊表單就在顏色的基礎上采用了形狀來(lái)指示問(wèn)題。其會(huì )在方形的框內，錯誤信息文案之前顯示感嘆號，同時(shí)會(huì )在相關(guān)輸入框旁邊顯示“x”來(lái)指示發(fā)生錯誤的地方。
通過(guò)Colblindor的模擬器看，我們也會(huì )發(fā)現紅色和綠色色調沒(méi)有了，但是用戶(hù)仍然可以通過(guò)形狀來(lái)分辨操作是否有問(wèn)題。
所以建議大家借助Colblindor對頁(yè)面進(jìn)行測試，或者簡(jiǎn)單地把設置改成灰色來(lái)確保實(shí)用性不會(huì )因顏色問(wèn)題而受到影響。
- 2016-02-18網(wǎng)站設計建設的基本步驟有哪些？
- 2016-01-11企業(yè)網(wǎng)站設計前需要做好哪些工作？
- 2016-01-07平面設計中常見(jiàn)的顏色模式有哪些？
- 2016-01-06顏色對比在網(wǎng)頁(yè)設計中的應用
- 2015-12-23網(wǎng)頁(yè)設計中的顏色如何搭配？
- 2015-09-21室內設計師為什么用3dsMax而不是Maya？
- 2015-09-21室內裝修設計為什么要請室內設計師？
- 2015-09-09室內設計不同的房間顏色搭配技巧
- 2015-09-09室內設計地板顏色和家具顏色如何搭配？
- 2015-09-09暖色系室內設計顏色怎么搭配？
- 2015-08-12UI設計,平面設計,網(wǎng)站設計有什么不同？
- 2015-08-12為什么很多平面設計師從CorelDRA 轉用Illustrator？
- 2015-02-12學(xué)室內設計為什么選擇鄭州清新教育
- 2014-10-20室內裝修中廚房墻壁顏色
- 2014-09-17鄭州網(wǎng)站設計培訓班哪里有
- 求學(xué)問(wèn)答專(zhuān)業(yè)答復，快速響應
- 電話(huà)：0371-63218905
- 手機：13613841515
-
QQ：
- 1 室內設計培訓課程 人咨詢(xún)中 19
- 2 平面設計培訓課程 人咨詢(xún)中 18
- 3 網(wǎng)頁(yè)設計培訓課程 人咨詢(xún)中 18
- 4 淘寶開(kāi)店培訓課程 人咨詢(xún)中 15
- 5 動(dòng)漫設計培訓課程 人咨詢(xún)中 12
- 6 淘寶美工培訓課程 人咨詢(xún)中 17
- 7 電腦辦公培訓課程 人咨詢(xún)中 15
- 8 網(wǎng)絡(luò )營(yíng)銷(xiāo)培訓課程 人咨詢(xún)中 13
- 9 模具設計培訓課程 人咨詢(xún)中 10
- 10 網(wǎng)站開(kāi)發(fā)培訓課程 人咨詢(xún)中 16
