申请网站
忘记密码
密 码：
登录名：
建站咨询热线：
0532-88781131
、
18562723728
返回贴子列表
发表新贴
主题：
选中状态应该高亮还是灰掉？
共有
1365
人浏览过本贴
主贴管理
置 顶
加 精
结 贴
转 贴
昵称：奈薇建站网
论坛积分：108000
发贴等级：
21
发贴数：1156
回贴数：1282
被砸鸡蛋：
1
获赠鲜花：
182
发表时间：2020/4/13 11:02:00
楼 主
选中状态应该高亮还是灰掉？
导航设计中一个基本的任务点是准确标明当前选中项，不当的设计很容易造成用户困惑。尤其是只有两个列表项时，要对用户准确传达当前的选中项，设计上要很谨慎。针对最近项目中遇到的这个问题，记一笔。
用户判断选中状态的心智模型有两种：
一种是指示灯式，如红绿灯、电梯操作面板、各种仪表盘等，指示灯亮起表示选中——即高亮；
另一种是按钮式，按钮陷下去表示选中——即灰掉。明显告诉用户这个正在使用中，不可点。
===========================案例分割线============================
以上两个分别来自淘宝和有啊，都是选中状态高亮。（合理的指示灯式体验）
以上两个设计分别来自google和iTunes，都是选中状态灰掉。相信不管两个列表项还是三个列表项，都可以清楚知道哪个是选中项。（合理的按钮式体验）
上图来自阿里国际站，图标+链接的形式，选中状态图标灰掉。图标和链接都能传达选中状态，当用户对两者认知不一致时，该相信图标还是相信链接？（指示灯式与按钮式混用，且指示灯式反着用）
上图来自alibabawholesale，选中状态图标灰掉。与有啊一模一样的设计，实际意义竟然完全相反。（可以看成指示灯式反着用，也可以看成按钮式却没设计成按钮）
========================总结分割线============================
综合以上的案例，造成用户困惑的设计，要么是把指示灯式反着用，要么是按钮式没设计成按钮，要么是两者混着用却没统一。
总结：
1、选中状态高亮，代表最广大用户的认知习惯。
2、使用图标表示选中状态时，应该让选中状态的图标高亮。如果非要让选中状态的图标灰掉，图标应该设计成按钮质感，视觉上明确表现出陷下和浮起的状态。
3、利用链接与非链接也可以准确地表示选中状态。图标+链接的形式慎用。
奈薇建站网致力于，让每个中国人、每个中国企业都拥有自己的“官方网站”！
回复此贴
单贴管理
修 改
删 除
清理签名
TOP
共
0
个回贴 分
0
页
上一页 / 下一页 当前第
页
奈薇建站网青岛网站建设公司/青岛网站制作公司，专业提供"气质"型网站建设及精美网站制作服务，同时欢迎各地网站建设公司、网站制作公司代理我们的奈薇建站系统共同发展
热点地区：
青岛网站建设价格
青岛即墨网站制作公司
开发区信息港
山东在线门户
1
182
