单选框和复选框一直困扰着用户,他们通常用于相同的场景,但看着完全不同。设计人员和开发人员工作中经常接触单选框和复选框,清楚它们的区别,但那些搞不清楚区别的非技术用户该怎么办?
事实上需要教会用户区分单选框和复选框,这表明这两者的区别不是很直观,但从外观看不出它们在功能上的细微差异。单选框和复选框的视觉提示——点和对号,除了指明选中选项外,对用户没有任何特定意义。因此,同时使用单选框和复选项,违反了用户体验中的一致性原则。
设计人员和开发人员从未质疑过单选框和复选框为何要共存,在他们看来,这两者一直都可以同时使用。然而,要是同时使用单选框和复选框会混淆用户,并违反用户体验原则,那么就应该进行逻辑分析和重新思考。
违反一致性原则
用户体验中的一致性原则是指具有相似功能和相同用途的组件应具有统一的外观。单选框和复选框的功能相似,并且用于相同的场景,但外观却并不统一。
单选框表示相互排斥的选项,而复选框表示相互包容的选项,表单中通常同时采用二者从列表中选择选项。但是,单选按钮的选中状态用内嵌圆点的圆框表示,而复选框的选中状态用内嵌对号的方框表示,两者的视觉提示不同。
也许有人会说,单选框和复选框的功能不同,在其外观也应有差异。但确切地讲,它们的功能只是略有不同,并且用途相同,没必要非得设计成不同的外观。外观不同会造成不一致,从而可能使用户感到困惑。
用户不关心选项相互排斥还是相互包容
如果要问普通用户什么是相互排斥或相互包容的选项,他们可能说不出来。用户使用界面时不会考虑互斥性或包容性,只有设计人员和开发人员才会考虑,因为他们必须设计界面。
用户只需浏览标签并选中想要的选项,他们关注的是标签内容,而非组件功能。因此,互斥性和包容性应体现在用户浏览的标签内容中,而不是体现在组件上。设计人员和开发人员正在将他们的思维方式强加给用户。
用户怎么知道该选单个还是多个选项
组件的标签通常能表明用户可以选多个还是单个选项。要是用户能选择多个选项,标签内容会以复数形式表示,而要是只能选择单个选项,则标签内容会以单数形式表示。当标记相互排斥和相互包容的选项组件时,请确保使用正确的名词形式。设计人员很容易忽略组件标签,但它们才是最重要的。
标签的名词形式比对号和圆点更能体现相互排斥/相互包容。只有设计人员、开发人员和精通技术的用户才能根据对号和圆点看出互斥性/包容性,普通用户在同一场景中看到单选框和复选框时会猜测两者的视觉差异代表的意义。这种不一致还不足以严重到阻碍用户的操作,但肯定会分散他们的注意力。
采用带对号的圆框组件
需要给用户提供统一一致的选择组件。可以采用带对号的圆框组件代替单选框和复选框,它结合了单选按钮的外部形状和复选框的对号标记。
之所以采用对号,是因为使用其作为选择符号的提示性强于圆点。众所周知,对号象征着肯定或“是”,而圆点的视觉提示较弱,可以具有任意的意义。
圆形轮廓有助于区分圆框组件和复选框,还更具有吸引力、更容易识别,因为大多数带背景的图标都使用圆形轮廓。
采用单个组件选择选项时,用户就不会再关注单选框和复选框之间的区别,而是更多地关注选项内容,并选择最适合的选项。用户能选择单个或多个选项并不重要,他们会根据标签内容进行选择,而不是组件的类型。
老式设计实践的演进
单选框和复选框已经共存了很长时间,有些人可能会以此证明它们的共存合理性。然而,出于对用户体验的深入理解,过去的许多老式设计实践已经出现演进,如清除表单内容的重置按钮、必填字段上的红色星号和密码确认字段等实践现在几乎都消失了。单选框和复选框可能很快也会这样,因为就像生活中的大多数事情一样,界面设计也在持续演进。
原文地址:https://uxmovement.com/forms/why-radio-buttons-and-checkboxes-cant-co-exist/