網頁制作Poluoluo文章簡介：網站導航用戶體驗設計:選中狀態是高亮還是灰色.
導航設計中一個基本的任務點是准確標明當前選中項，不當的設計很容易造成用戶困惑。尤其是只有兩個列表項時，要對用戶准確傳達當前的選中項，設計上要很謹慎。針對最近項目中遇到的這個問題，記一筆。
用戶判斷選中狀態的心智模型有兩種：
一種是指示燈式，如紅綠燈、電梯操作面板、各種儀表盤等，指示燈亮起表示選中——即高亮；
另一種是按鈕式，按鈕陷下去表示選中——即灰掉。明顯告訴用戶這個正在使用中，不可點。
===========================案例分割線============================
以上兩個分別來自淘寶 和 有啊，都是選中狀態高亮。（合理的指示燈式體驗）
以上兩個設計分別來自google和iTunes，都是選中狀態灰掉。相信不管兩個列表項還是三個列表項，都可以清楚知道哪個是選中項。（合理的按鈕式體驗）
上圖來自阿裡國際站，圖標+鏈接的形式，選中狀態圖標灰掉。圖標和鏈接都能傳達選中狀態，當用戶對兩者認知不一致時，該相信圖標還是相信鏈接？（指示燈式與按鈕式混用，且指示燈式反著用）
上圖來自alibaba wholesale， 選中狀態圖標灰掉。與有啊一模一樣的設計，實際意義竟然完全相反。（可以看成指示燈式反著用，也可以看成按鈕式卻沒設計成按鈕）
========================總結分割線============================
綜合以上的案例，造成用戶困惑的設計，要麼是把指示燈式反著用，要麼是按鈕式沒設計成按鈕，要麼是兩者混著用卻沒統一。
總結：
1、選中狀態高亮，代表最廣大用戶的認知習慣。
2、使用圖標表示選中狀態時，應該讓選中狀態的圖標高亮。如果非要讓選中狀態的圖標灰掉，圖標應該設計成按鈕質感，視覺上明確表現出陷下和浮起的狀態。
3、利用鏈接與非鏈接也可以准確地表示選中狀態。圖標+鏈接的形式慎用。