售前咨询 售后咨询
当前位置: 上海网站设计 > 建站知识 > 建站教程

单选按钮和复选框大有不同

网站编辑:小润 | 发表时间:2019-02-02 20:22:59

       网站建设移动APP开发手机网站建设又或者是微信定制开发,用户体验都是至关重要的。我们常说细节决定成败,而无论是网页设计,还是移动app设计,良好的用户体验往往就表现在细微之处。正如,单选按钮和复选框的选择的不同使用就能很好的提升用户的使用体验和浏览体验。这两者之间看似大有不同,但实际上很多设计师在使用的时候,都没有明确的界限,容易导致使用不当带徕不好的用户体验。

      使用原型工具:Mockplus

      单选按钮和复选框的区别

      什么时候使用单选按钮?

      有两个或两个以上的互斥选项,用户必须且只能从中选择一个。换句话说,如果你选择了其中一个没有被选中的选项,那么原本被选中的选项就自动被取消。

      什么时候使用复选框?

      有一系列选项,用户可以从中选择选择一个或多个,甚至不选也可以。换句话说,每一个选项是互不影响的。

      看了定义,你是否觉得这两个组件使用起来很容易呢?但在设计实例中,以下几个错误用法是频频出现的:

      错误一:用错对象

      一个提供午餐外卖服务的app, 在让用户选择送餐时间时,使用了复选框组件。这既违背了设计初衷(希望用户从中选择一个时间段),又给用户带来了困扰,是不是我同时勾选前两个时间段,就代表在这整个大的区间内送餐都是可以的呢?

 

      错误二:选项文本中使用否定词

      以上的几个例子是比较夸张的,但的确反映了一些UI/UX设计中存在的问题。如果我们在复选框选项中使用否定句式,用户必须浏览完所有的选项,才能确保自己不喜欢的事情不会发生。

      有一个例外的情况,当浏览器中弹出“不要再提示该信息”时,类似的选项中可以使用否定词。

 

       错误三:选项的排列不遵循逻辑顺序

      图中的选项没有遵循一定的逻辑顺序。按照订阅时间长短,应该是:月订阅>季订阅>年订阅

 

      三个是单选按钮和复选框在UI/UX设计中常见的错误,除了避免这些错误之外,设计师在使用这两个组件时,最好能遵循以下四点建议:

1. 能使用单选按钮时,尽量不使用下拉菜单。在所有选项都被清晰地列举出时,用户更容易进行比较,做出正确的选择。

2. 使用单选按钮时,一定要提供一个已经选中的默认选项。

3. 单选按钮和复选框都不用于触发任何动作。

4. 选项句式不宜过长,最好能让用户迅速抓住关键信息。

 

        以上三点错误和四条建议,是用好单选按钮和复选框这两个组件的关键。

关键字:
官方微信
上海市长宁区宣化路300号华宁国际广场中区7层
+021-8031 0607
+135 8590 1130