面向色盲的设计之选中状态

2015-12-10  本文已影响119人  孟大伟

面向色盲的设计之选中状态

(预计阅读时间:60s)

在用户界面上通过使用色彩可以传达很多信息,但却没有很好的照顾到色盲用户,他们经常难以区分不同的颜色。

如果你的按钮只使用颜色做为引导,这很难告诉用户所选择的状态到底是什么,你或许可以使用形状来标识按钮的状态,而不仅仅是使用颜色。

导航栏

通常导航栏上会有很多按钮,但如果你只使用颜色就很难分辨哪个是选中的状态,许多网站会采用对按钮添加对比色,而这很难引起色盲用户的注意。

采用对按钮添加下划线的方式来替代仅仅使用颜色的方式,这对色盲用户来讲不难猜出来哪个是被选中的按钮,他们看一眼大概就能猜的到。

分段按钮

另一个色盲用户需要更多的视觉提示的就是分段按钮。许多只使用颜色来区分不同状态的方式,对于正常的用户来讲显而易见,而色盲用户就会遇到麻烦。

用户会看到一个浅色填充与深色填充,并感到诧异到底是浅色还是深色的是被选中并高亮显示的,可以通过对选中按钮的旁边添加一个复选标识来澄清混乱。

切换开关按钮

对于色盲用户来讲,切换开关按钮面临着同样的问题,如果仅仅使用颜色来区分打开/关闭,很难说明白哪个是选中状态。

为了使状态更加清晰,可以考虑在按钮上添加ON/OFF的标签亦或在ON的状态下增加一个复选标识。

仅仅使用颜色是不够的

如果想要触达每一位用户,仅仅通过使用颜色显然是不够的,考虑使用复选标识,下划线或标签作为额外的按钮状态的视觉辅助。

色盲用户已经比我们更难了,只需你多考虑一点就能让他们的生活更加美好。

————分割线——————

1.即使只有相对较小的一部分群体(色盲),还是有必要记住设计时要照顾到他们,我们需要明白,最后的设计将适用于每一位用户,这关系到一个更加优秀的用户体验。

2.原文链接:http://uxmovement.com/buttons/making-selected-button-states-clear-for-color-blind-users/

持续关注 UX/UI、黑客增长、AR/VR、区块链、自动驾驶及改变世界,关注微信公众号:iThinkBigger

上一篇下一篇

猜你喜欢

热点阅读