UI ! 优秀表单要怎么设计?

发布时间:2024-04-16 12:33:18 浏览量:234次


每一个网站都会有表单部分,表单看起来很简单,但是千万不要小看它,一个设计优秀的表单可以提高用户填写效率,防止他们出错或中途流失,从而带来好的用户体验,提升转化率。这篇文章,小华和大家聊聊优秀表单的一些设计规则。

1、表单应该只有一列,而不要横向平铺,多列布局会扰乱用户垂直方向视线的移动。

2、标签最好在输入框的顶部,顶部标签的表单比左侧标签有更高的完成率,并且易于移植到移动端。但是,对于有多重选择项的大量数据列表而言,可考虑使用左侧标签,因为,他们在一起更易于,浏览,降低高度,比顶部标签更贴心。

3、把标签和输入框成组排列,把标签和输入框贴近排列,确保不同项目之间有足够的距离,视觉上,标签和所属输入框成为一组,否则,用户会产生困惑。

4、避免英文标签文字全大写。全大写英文标签阅读起来不那么愉悦。

5、不要把默认提示当做标签。可能为了节省空间,将默认提示文字当做标签,但这会导致很多可用性问题,比如提示文字就没有空间了。Nielsen Norman Group的Katie Sherwin对此作过总结。

6、勾选框以纵向为宜,保证易读性和浏览速度。

7、逐行说明错误。当用户填写的内容或格式不符合规定时,一定逐行告诉用户错在哪里,而不要只笼统说明“发现错误”之类。并且逐行验证要在用户填完一行之后进行,不要再用户输入的过程中告诉他们你输错了,这样的话,体验很不好。

8、输入框中尽可能直接展示基本的帮助提示文案。

9、输入框不要太短,输入框的长度暗示了答案的长度,对于字数固定的输入框,例如电话号码、邮政编码等,可以使用这种方式。

10、抛弃星号*,标出选填项,因为用户不一定都知道*表示必填项。

11、如果需要用户填写的信息太多,最好将相关信息编组,比如个人信息、账户信息等。天长的表单会让人眼花缭乱,创建符合逻辑的分组,用户会更容易理解表单。

热门课程推荐

热门资讯

请绑定手机号

x

微信扫码在线答疑

扫码领福利1V1在线答疑

点击咨询
添加老师微信,马上领取免费课程资源

1. 打开微信扫一扫,扫描左侧二维码

2. 添加老师微信,马上领取免费课程资源

同学您好!

您已成功报名0元试学活动,老师会在第一时间与您取得联系,请保持电话畅通!
确定