当你的页面中存在很多选项时,你会使用哪种组件在你的页面中?
对于大多数设计师来说,都会想到复选框。但是,一长串的复选框看起来对用户来说很吓人,并可能导致他们放弃填写表单。不仅如此,复选框也不是有效或易于使用的,因为它们会占用空间,增加视觉元素的数量并提供较小的点击目标。
比复选框更好更好的组件是切换标签。切换标签可节省屏幕空间,因此有空间容纳更多内容,并且用户无需滚动。复选框需要垂直堆叠,但是切换标签允许垂直和水平堆叠。这产生了紧凑的布局,看起来对用户没有太大的负担。
不仅如此,切换标签不需要带有复选框或复选标记。这样,屏幕上分散用户注意力的元素会更少。最小化视觉噪声,使用户可以专注于选项。
复选框的点击目标也会引起点击问题。切换标签可提供更大的点击目标,因此用户在选择时产生错误的机会也更少。
所有这些优点使切换标签比复选框更适合选择选项。但是也会存在例外,选择复选框情况会好。
如果选项的文本很长并且这些文本可以换行,则应使用复选框。复选框不受水平限制,并留有足够的空间来容纳更多文本。另一方面,切换标签受其形状限制,仅当选项标签为单个文本行时才更合适。
“切换标签”与 “复选框”一样直观。它来自类似于令牌的形状和切换功能。下次考虑使用复选框进行选项选择时,请考虑使用切换标签。这会节省屏幕空间,简化界面,并防止用户放弃填写表单。
原文地址
https://uxmovement.com/forms/why-toggle-tokens-are-a-better-alternative-to-checkboxes/
领取专属 10元无门槛券
私享最新 技术干货