制作网页下拉菜单的规则和标准

正确使用下拉菜单很好，可以帮助用户缩小选择范围，逆向屏幕空间，防止错误数据输入。然而，在某些情况下，下拉菜单并不重要，对用户体验有负面影响。

重要的是要知道何时使用下拉菜单或其他界面元素，如无线电按钮、开放文本字段等，而过度使用或滥用这些元素会导致可用性问题。
在本文中，我将讨论Web下拉菜单的性质，并分析应该或不应该使用它们。我还将展示一些不好的例子来帮助你设计。

一：不要使用下拉过长的列表

使用表单下拉菜单看起来很容易——它们在界面上没有太多空间，所有浏览器都支持它们，用户对它们有足够的了解。然而，当选项超过15时，用户可能会被淹没，他们无法导航。
看到超过20个非分类选项可能令人困惑和畏惧，而且用户很难找到他们想要的输入；还有一个滚动问题，用户必须将光标保留在下拉框中，否则他们最终会滚动页面。
Web下拉列表最经典的例子是National选择器，通常有100多个选项。虽然它通常按字母顺序排列，但有时它被放在流行的国家/地区的顶端，这可能会使用户感到困惑。
更好的选择是使用自动完成的文本字段，因为用户已经知道他们在寻找什么输入。
自定义搜索输入

二：选项不要太少

另一方面，如果选项太少，下拉菜单将是一个不好的选择，因为它通过隐藏可能已经暴露的信息，给用户流带来不必要的摩擦。
一个更好的选择是使用一个无线电按钮，使用户可以立即扫描可用的选项，而不需要任何努力。
如果你没有什么选择,你最好用收音机盒,而不是下拉菜单

三：禁用灰色选项

当一个选项被禁用或不可用时，它应该显示为灰色而不是删除。如果删除了残疾项目，界面就会失去空间一致性，使用户更难学习——因为残疾项目，他们可能找不到某些选项。
与其删除残疾选项，不如将其灰色化以表示残疾或不可用状态。您还可以考虑显示工具提示，以说明为什么禁用该选项以及它如何被激活。
取代删除残疾选项,用灰色表示残疾状态

四：在输入更快时避免下拉菜单

在某些情况下，输入可能比使用网页下拉菜单快。典型的情况是信用卡有效时。在网站上输入mm/yy肯定比从下拉菜单（月和年）滚动快得多。
虽然它确实需要某种形式的数据验证来使用自由表单输入字段，但从可用性的角度来看，它仍然是一个更好的选择，因为它减少了用户的负担。
对于用户来说，输入可能更快，并且避免使用下拉菜单。

五：避免过度使用

当某些数据或信息可以自动导出时，就不需要一直向用户要求输入。
这方面的一个例子是在结帐过程中使用的卡片类型字段，它根据信用卡号码的少数数来确定卡片的类型，因此要求用户选择卡片本身的类型会造成额外的麻烦。
不要养成在其他地方可以找到数据时添加新输入字段的习惯。

六：减少操作次数

您可以自定义站点下拉菜单部分，以减少操作的次数。
一个经典的例子是日期选择字段，如果使用常规列表菜单，需要三个Web下拉菜单（月、日和年），这对用户来说是很烦人的。
更好的选项是自定义菜单组件，允许用户在网站上只选择一个下拉菜单的输入。
使用自定义菜单来减少所需操作的数量。

七：使用简单明确的标签

用户根据他们的标签选择菜单选项，因此准确和信息是很重要的。通常，最好使用句子大小和写简明的标签清楚地表明选择的目的。
以下是一些标签准则：
对于动作菜单项，使用动词描述要发生的动作
对于链接，使用名词来标识用户要针对的页面
删除菜单项中的文章；使用删除页而不是删除页
将菜单项保存在一行文本中
通过按照逻辑顺序排序列表来组织菜单项也很重要——如果你知道的话，在顶部排列最多的选项。这需要用户随着时间的推移进行研究、测试和改进，以重新评估结果。