南顺网络

移动端下拉列表的更好选择

一.让我们看一看下拉菜单的局限性和令人担忧的地方：

下拉菜单控件的可用是选项不可见的，直到你点击或点击打开它。所以在第一眼看到列表时，列表的长度是隐藏的，即用户无法预测一个下拉菜单是包含 2 个还是 n 个元素。

尤其考虑是在移动设备上是一个多步骤的过程：你必须点击下拉菜单打开选项列表，然后滚动和浏览项目并选择一个，然后关闭下拉。

下拉菜单可以懒惰：设计师很容易就把所有可能的选项不分任何优先级一起放到下拉列表里。

想地区国家选择这种很长的下拉菜单，用眼睛扫描起来简直是噩梦，更别说是在键盘搜索通常是不可用的移动端。

在可见、可滚动但面积很小的屏幕上滚动去选择想要的选项是一件非常伤眼的事情。

二.考虑选项的数量

使用下拉菜单有时是一个错误的选择，比如只有两个选项，这里你需要用复选框(CheckBox)或者用切换开关（toggle switch）。

如果你的下拉菜单仅仅包含是/否、开/关这样的选项，那么就用开关控件来替代它。

对于个数少且互斥的选项 ，建议使用单选按钮（radio buttons）或分段控件（segmented），使所有可用的选项第一眼可见，无需打开列表。

分段控件可以一次性展示出所有的可选项。

可见选项的数量取决于屏幕宽度和选项标签的长度，但不要超过 5 项

当用户确切地知道他们在寻找什么时，对于大量确定的选项，考虑使用“请输入…”这样的解决方案，其中筛选选项列表在输入第一个或两个字母之后显示用让用户来输入文字来筛选选项的方式替代滑动下拉菜单。

对于大型和多样的列表，尝试使用现有的用户数据来排列优先级，只列出几个用户常选的选项。这种方式有一个好处就是90%的用户会立即发现自己偏好的选择项，只有10%的人选择立即“其他”然后跳到指定的下一个问题。

编辑:--ns868