恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
为移动设备优化表单的10种方法
0.0°
2017-08-30 自译外文 经验/观点 原作者: Vincent Sevilla 举报 1476 2 3 0

询问任何一个普通的成年人,离开房子他们不能没有的物品是什么,你会得到钥匙、钱包和手机这样的答案。随着移动设备制造商一个接一个地涌现,且他们发布的型号总比上一个更好,几乎不可能不赞同这种(移动设备)日益增长的趋势。


2014年的数据显示,仅在美国,90%的成年人都有手机,其中58%是智能手机用户。42%的美国人也被记录拥有一台平板电脑。在另一份报告中,eMarketer预计,到2014年底,全球智能手机的拥有量将达到17.5亿。


Image title


这些数字只是证明了移动设备已经越过了奢侈品的边界,成为一种基本的必需品。如果说在过去,我们的手机仅仅是沟通的工具,那么今天,它们就是我们在工作、娱乐和购物时候的依赖品。


优化移动设备的表单

举例来说,智能手机的兴起不仅让消费者更容易购物。它也是一个对于已经发展起来的网上购物行业的欢迎物。随着时间的推移,企业家们不仅忙着打理他们的实体店和/或在线商店,而且他们开始意识到移动设备和其他渠道在与客户接触时的重要性。


表单在网上购物中扮演着重要的角色,它们也成为了移动平台上的主要元素。我们通常会在准备付款的时候找到它们,网站会要求我们提供一些详细信息,比如运输名称、地址、电话号码和信用卡信息。然而,许多消费者发现填写表单很乏味,这可能会导致客户的兴趣减少;此外,网上购物者通常会面临时间压力和不稳定的互联网连接的可能性,这两种情况都会影响你的移动转化率。


以下列出的10种方法可以加速你的客户移动交易,使他们对网上购物体验感到满意。


1 .仅列入表格中重要的细节

如果你在网上购物时没有足够的耐心来填满整个网页的表格,你的客户可能也会有同样的感觉。填写完整的会员表单和填写一个简单的会员表单并从网上商店购买东西有所不同。与后者相比,前者可能冗长乏味,一旦客户发现他们必须提供三种不同的电话号码,那么当他们感到厌烦时,你就有可能失去客户。


Image title


为你的客户提供一个简单而完整的订购单,方便移动购物。这样做,只询问重要的信息,比如他们的全名、一个电子邮件地址、一个电话号码、运输信息和信用卡信息。你还可以把你所属的地区或国家的下拉菜单包括在内,或者更好的是,允许你的移动应用程序要求客户使用他们的位置。这样,获取地址就会更快更准确。


2.使用顶部对齐的标签和字段

与电脑相比,智能手机的视图是有限的,所以重要的是可以设计一个可以最大化这种约束的表单。实现这一点的一种方法是使用表单字段的垂直对齐方式。你会看到,当你使用水平对齐的表单时,存在一种趋势,即不是所有的东西都适合智能手机的视图,要么是标签,要么是输入字段被破坏掉。 这样一种情况极易削弱购物者的兴趣。


Image title


另一方面,如果表单的标签和输入字段是垂直排列的,那么客户将更容易查看正在请求的信息和他们正在输入的信息。这将有助于使他们对交易感到安全,也会使他们减少漏掉一个字段的错误,或者更糟的是从头再来。


此外,尽量减少表单中的视觉混乱。你的“这个是什么”和“学习更多”按钮可以放在你的网站的移动版本中。如果你必须在表单上放置,请将其放置在不影响你的客户购物的地方。


3.使用可折叠菜单和下拉列表

由移动设备的有限视图造成的另一个局限是,我们必须进行大量的滚动或者填满表单才能看到整个页面。虽然在使用智能手机时,滚动屏幕是正常的,但许多消费者更倾向于快速购买在线商品。


Image title


使用可折叠菜单和下拉列表可以帮助你减少客户完成表单所花费的时间。你可以将特定的项目分组,在你的客户于多个选项中找到选择之前,不要让他们细读。可折叠的菜单也很有用,可以把你想要放入一个页面的几个主要产品的详细信息联系起来。记住不要从细节开始折叠。


Image title


4.利用合适的选择列表

如果下拉列表或可折叠菜单不适合移动表单,那么在开放的预测性搜索字段和锁定的下拉列表中还有另外两个选项。


Image title


一个开放的预测性搜索字段允许你的客户输入他们正在寻找的项目或服务的关键字,并列出最近可能的结果。这种形式对于长时间搜索或不遵循任何特定安排的产品是理想的。另一方面,锁定的下拉列表是在菜单中列出特定项目以及按照特定顺序(按字母顺序或按时间顺序排列)的理想选择。


5.选择单个输入字符

你可能熟悉桌面和移动版网站里在表单中输入的字段。在某些情况下,这些输入字段被分成两到三个部分,例如名称、地址和电话号码。虽然这在桌面版本的网站上具有有效的用途,但它可能不像在移动设备的表单中使用的那样高效。


Image title


通常情况下,拆分输入字符需要移动购物者轻触所有三个(或两个)字段,以回应一个标签。如果你要在一个表单上做很多事情,你的客户可能会对进行结帐失去兴趣。


在其他情况下,拆分字符也可能是模糊的,可能会混淆客户。当为移动平台设计表单时,使用简单的字段而不是拆分它们。例如,不要为一个名字和姓氏设置两个独立的字段,而是使用一个字段代替全名。这将有助于你的客户更快地完成表单。


6.规定你的表单按钮格式

“提交”按钮是网上购物的最后一步,也恰好是表单上最重要的按钮。因此,你需要让它脱颖而出,以便让你的客户一直参与到交易的结束。


Image title


让你的表单按钮更吸引人,按你的表单的三分之一的宽度来制作这个按钮,并给它分配一个明亮的颜色。另外,不要简单地使用“提交”或“发送”这个词,而是使用更有活力的号召,例如“现在注册”或“提交应用程序”。


然而,避免使用过于明亮的颜色,或者避免让你的按钮移动的太多,因为这些可能会分散你的客户的点击量。您可以在单击时使用微妙的颜色变化或在按钮上悬停,这样你的客户就知道他们已经完成了交易。


7 .  用视窗meta标签设置缩放

移动设备可以为客户提供的视图可能迫使他们缩放页面,但是意外地这样做可能会使购物者失去对页面的关注。 你可以通过在表单上使用视窗meta标签来控制此方式。 这将阻止你的客户无意中放大页面,或更糟糕的是丢失表单。


8.利用数据的持久性

通过移动电话购物对一些客户来说是很困难的,因为在你的客户丢失数据后决定放弃他/她的购物车之前,点击回到上一个页面会有更多的风险。通过给客户点击任何不是表单的链接,在新的选项卡中打开选项来缓解这个潜在的问题。


Image title


另外,在不能回到以前的页面的情况下,给他们一些警告信号,如“同意”,“确定”或“取消”。这样做,能够告诉你的客户数据是否存储在你的站点或浏览器中,并帮助他们决定进行结帐。


9.帮助客户追踪他们的进度

并不是所有的购物者都热衷于填写表格。如果你能给他们提供一种方法来告诉他们完成的进度将会有所帮助。你可以通过在表单顶部显示一个进度条来实现这一点,并通过百分比或者仅仅是一个简单的年表来确定他们在哪个步骤。请记住,尽可能地限制这些步骤,以节省客户的时间。


Image title


10.让表单快速加载

你不应该忘记的另一个因素是移动表单加载的速度。如果页面需要一段时间才能完成,你的客户可能不会转移。事实上,你的客户已经抵达表单,告诉你他们已经准备好购买了。不要用加载缓慢的页面让他们失望。你的表单的速度也会依赖于你放在页面上的元素,所以要小心那些大的图片。


Image title


一如既往,跨系统测试和安装

现在,各种各样的移动设备和它们的接口让你的表单变得很难适应。因此,确保你在不同类型的移动设备上进行表单测试,并考虑到操作系统、大小和浏览器。通过测试,你将能够覆盖每个基础部分,并确保你的表单能在每个可用设备上工作。











更新:2017-08-30

收藏

2人已收藏

zyl0127

https://www.zcool.com.cn/u/13561

  • 16

    作品

  • 92

    粉丝

  • 1

    关注

  • 给设计师的12个最佳UX/UI工具
  • 找到合适的UX/UI工具&四个可选项使资源更易获得
  • 网页设计中负空间的有效使用
  • 你现在就该使用的三个最好的原型工具
相关标签
经验用户体验

    猜你喜欢

      2017-08-30 自译外文 经验/观点 原作者: Vincent Sevilla 举报 1476 2 3 0

      为移动设备优化表单的10种方法

      0.0°

      你确定要举报为移动设备优化表单的10种方法

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年08月30日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      3
      2
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录