1. 云裂变
  2. 营销
  3. 网站运营
  4. 你未曾见过的移动端下拉列表替代方案

你未曾见过的移动端下拉列表替代方案

作者: 日期:2022-03-06 人气:195

 

以下内容由Mockplus团队翻译整理,仅供学习交流,Mockplus是更快更简单的原型设计工具

在表单中使用下拉列表似乎不是什么很费劲的事情,它们在用户界面上占用的空间不大,可自动验证输入,支持所有的浏览器和各平台。并且实现起来简单便利,用户对其也足够了解。

同时,按照Luke Wroblewski和其他一些人的说法,下拉菜单(或选择)是最常被误用的表格模式之一,“应该是UI的最终界面”。

让我们看看其一些局限性和用户的担忧:

不才拉列表中,可用选项一般不成见,除非你点击或按键才能打开它。此外,列表的长度是被隐藏了的,也就是说,用户无法预测下拉菜单里面到底包罗了多少个元素。

从下拉列表中选择一个选项(特别是在移动设备上)是个多步骤的过程:您必需点击下拉菜单打开选项列表,然后滚动并浏览项目来选择一个,然后关闭下拉列表。

下拉菜单可能会使设计人员变得懒惰:只需将所有可能的选项添加到下拉列表中而不需要摆列其优先挨次是是极其简单的(顺便说一下,与汉堡包菜单非常的类似)

较长的下拉列表,好比国家或地区选择器对于用户来讲简直就是噩梦,特别是在一些无法使用键盘搜索的设备上。

在某些列表可见和可滚动区域很小的移动设备屏幕上滚动选择可能会很痛苦:

你未曾见过的移动端下拉列表替代方案

在iOS上,可视选项的数量乍一看可能会出奇地少。

但好消息是,在许多情况下,有很多替代性输入控件可以更好地帮手你完成工作。

考虑选项的数量

对于一个二择其一(开或关)的选项,下拉菜单是个非常不明智的选择。而你需要用的是一个复选框和开关切换控件。

你未曾见过的移动端下拉列表替代方案

如果你的下拉列表只包罗是或否,开或关的选项,只需用一个简单的开关控件。

对于少数互斥选项,建议使用单选按钮或分段控件,以便所有选项一次可见,而无需打开列表。

分段控件可一次显示所选项和替代选项

你未曾见过的移动端下拉列表替代方案

可见选项的数量取决于屏幕宽度和选项标签的长度,但建议使用不超过5个项目

对于大量指定明确的选项,当用户非常确定他们正在寻找的内容时,请考虑“开始输入... ”解决方案,其中在输入第一个或两个字母之后选项列表会筛选出用户所需的选项。

你未曾见过的移动端下拉列表替代方案

不消滚动列表,让用户开始输入而只显示已过滤的选项

对于大型和多样化的列表,请尝试使用现有的用户数据来优先选择该选项,只需列出少数最流行的选项给用户。这样一来,有90%的用户会立即找到本身的爱好,只有10%必需选择“ 其他”,然后不才一个问题中详细了解。

你未曾见过的移动端下拉列表替代方案

虽然“其他”不是一个完美的解决方案,但这样的优先性可能会改善大多数用户的用户体验

考虑预期的输入

下拉列表的优势之一就是用户不必输入太多。但是,如果预期的输入不是太长或者不会被频繁询问的话(例如个人数据),则输入起来更容易一些,而不是从列表中选择它:

你未曾见过的移动端下拉列表替代方案

使用数字键盘在滚动设备上输入出生年份比滚动浏览长列表更容易

通常,在数字键盘上输入数字值通常更有效。

你未曾见过的移动端下拉列表替代方案

尽管数字下拉列表的排序挨次是很清楚的,但比起滚动选择,输入数值更简单些。

如果验证用户的输入非常重要,那么使用输入字段来筛选可用选项时,“输入...”方法可能很有用。

你未曾见过的移动端下拉列表替代方案

列出美国的选项时,只需输入一个字母可以很好地筛选出来。

当元素的排序挨次不清楚时,在选项列表中进行搜索的方法特别有用。

你未曾见过的移动端下拉列表替代方案

货币的排序挨次用户可能不清楚,因此请确保他们可以搜索名称和货币代码。

同样的方法也应该应用于国家列表:而不是列出200多个项目。应允许用户输入尽可能快的筛选出结果。

你未曾见过的移动端下拉列表替代方案

对于体现数量的离散值(例如乘客数量或购物车中的物品数量),步进器允许用户通过一次点击或按键来快速增加或减少数量。

你未曾见过的移动端下拉列表替代方案

对于位于刻度上的值或非离散值,请考虑使用滑块。

你未曾见过的移动端下拉列表替代方案

显示最小值和最大值的数值范围可有助于理解上下文。

选择一个由多个选择菜单组成的日期可能是一个痛苦的体验,所以选择就近的日期,需使用日期选择器。(但不要用它来输入出生日期!)

你未曾见过的移动端下拉列表替代方案

考虑设计更智能的下拉列表

不消说,不该该总是制止下拉菜单的使用。您会发现一个选择菜单是最合适的输入控件的情况,这很好。试着让它尽可能的对用户友好。

内容标签:

热门文章

    现在很多企业都着手于做重庆seo排名,因为SEO是获取精准流量比较稳定且长期发展好的方式之一,同时也能提升自身企业的品牌形象,因为SEO本身就是基于用户体验优化而做的,因此做好SEO

6768

网络营销时代,软文营销已成为企业传播品牌、促进订单转化的重要手段。不同于硬广形式,软文营销的精华就在于“软”字,即广告绵里藏针,要在能提供给用户有价值内容的基础上进行广告

 文库营销指的是借助一些文库平台上传文档,通过知识分享来做品牌营销,目前常见的文库平台有百度文库、360图书馆、道客巴巴、豆丁文库等。文库营销对文档质量要求较高,需要用户自

网站对于很多的企业来说,不仅仅是业务的渠道拓宽,也是多一个网站推广的途径和客户渠道等,很多的企业虽然有自己的网站,但是重视程度不够,很多的企业都只依靠网站就能够养活一个公

3236

企业品牌推广对于企业的生存来说是极其重要的,如果没有一个好的推销渠道的话,可能就会让自己的商品卖不出去。在新闻中总是看到哪儿有什么产品卖不出去了,形成滞销,让个人或是企业

3196

一方面,不同客户的建站需求不同;另一方面,网站建设人员的技术水平高低不一;同时,时效、地域因素也会对建站成本有所影响。所以网站建设的报价暂时没有统一标准,建设费用更是从几

3014

最先剖析要散播的目的客户人群的陋习与话动范畴; 精心安排合乎网民爱好的论坛推广时件或话动; 积淀论谈有关社交圈子資源,会对进行论坛推广出示挺大适用; 搞好数据分析,以知道论坛推广的成功失败之举,加以改进。

人们常常会遇上有些人做论坛推广的当时,以便能短期内内看到作用,就在每个论谈网站上注冊很多的id,花两三天的時间就把各大论坛上贴的浓浓的全是软广,可是隔过段时间回来看,以前公布的全部贴子都被删的干净整洁,情况严重将会注冊的id也被封的干净整洁,而针对这类人只有说成爱好者的论坛推广技巧了。在进到这一议论以前,人们看一下自身是不是存有那样的难

在互联网高速发展的今天,在众多同行品牌的强势竞争下,新品牌想要打开市场并不是一件容易的事儿。但不推广就难以生存,那么我们应该如何做好新品牌推广,快速打开市场?云裂变徐国

2918

一个生产企业想要发展必须要创立自己的品牌,在人们购买东西讲究牌子的今天,如果你所生产的产品连个牌子都没有,恐怕会无人问津的。但是,有了品牌,对于小公司来说若是得到消费者的

2893

现在的推广营销方式与以前比起来可是多了不少,放在以前也就是还没有网络的时侯,商品商家和生产厂家想要把自己生产的和自己销售的产品或是商品成功推销出去那可就得想想办法了。比如

2888

说起网络营销,让人们想起了网上购物,比如在刚过去的520,就是一波网购的热潮,各种打折促销返利活动让许多人心动,看花了眼。又比如每年的双11、在双12的网上促销活动可谓是一年之内

2845

很多企业在官网搭建完成之后,便放任不管,既不更新内容、也不做任何的排名优化,最后网站没排名、没流量、没访客;即使有排名、有流量导入,但是跳出率极高,依然产生不了任何效益。

2829

随着网络营销、全网覆盖等口号喊得越来越响,现在有不少的企业做网络营销都是被同行带起来的,本质上对网络营销推广的作用都了解不多。那么网络推广好在哪?为什么一定要做好网络推广

论坛推广就是,企业利用论坛这种网络交流的平台,通过文字、图片、视频等方式发布企业的产品和服务的信息,从而让目标客户更加深刻地了解企业的产品和服务。最终达到企业宣传企业的品牌、加深市场认知度的网络营销活动。1、电子公告板(BBS)是虚拟网络小区的要素方法,小量的交流信息全是历经BBS进行的,vip历经贴到消息也许回应消息抵达互相联系的目地。一些简

受互联网大趋势影响,很多传统企业纷纷着手布局网络营销,考虑到企业自身在营销经验上有欠缺,不少老板会选择找全网营销外包公司合作,这个时候就会出现很多选择难题。比如说找了10家

2770

随着社会的发展和人们消费观念的改变,现在人们的消费已经从单纯的商品能使用消费阶段到了商品品牌消费阶段了。在进行商品购买时总是看商品的品牌,就拿一些年轻人来说吧,对于耐克、

2760

百科营销是一种以权威知识分享的形式对企业做有目的性的品牌宣传,可以有效提高潜在客户对企业品牌或产品服务的信任度及认可度,最终达到提升企业品牌知名度美誉度的双重作用。那么百

护肤品作为当下大受女性追捧的快消品,行业竞争激烈,且更新换代尤其迅速。那么如何在如此变幻莫测的市场竞争中占领高地呢?这自然少不了大面积的营销推广(包括线上和线下),下面全

一、前端seo代码优化注意事项1、提高页面加载速度。CSS可以用来解决不使用背景图片的问题,也可以尝试压缩背景图片的大小,你可以在一张图片上放置几个图标,使用CSSsprite,使用背景位置

2641

最新文章