想想你经常访问的一个网站——该网站的整体功能是什么样的?加载页面需要多长时间?站点导航是否易于使用?您是否能够快速找到您要查找的信息?这些都是网站功能的各个方面用户体验(UX).

UX适用于你网站的每一部分,包括你的网络表单,在可访问性、易用性和便利性方面。一网上表格使用优秀的用户体验,您的访问者可以轻松工作,简单易懂,而且感觉很专业。当您的表单包含所有这些因素时,您可能会看到转换次数的增加。这就是为什么正确使用表单的用户体验对您的业务至关重要的原因。

下载我们的免费UX研究和测试工具包

为什么形式UX很重要?

问题的关键网络表单是收集访客的某些个人信息,无论是电子邮件地址或他们的运输和付款细节。但是,如果要求访问者列出信息的表格难以使用、难以理解或视觉上不吸引人,他们为什么还要转换并与你进行任何类型的业务往来呢?答案很简单,他们不会。

当试图达到一个了不起的和令人难忘的形式设计时,有很多因素进入到伟大的UX和元素中去考虑。形成用户体验很重要,因为你想给访问者留下一个好的(和持久的)印象,在你的网站上为他们创造一个积极的体验,并转换更多的潜在客户。

UX会影响网页表单的可访问性(指表单被不同类型、不同背景的人完成和提交的难易程度)和可用性(指某人完成目标的难易程度,在这里指完成表单的难易程度)。如果没有出色的UX,你不仅会有较差的可访问性和可用性,而且还会失去转化率。

10表单用户体验指南和要遵循的好例子

我们策划了以下指南列表,您可以将其应用到表单中,以帮助您增强其用户体验。每个指南还包括一个示例,您可以遵循并学习该示例,以帮助您为自己的网站创建成功且经过深思熟虑设计的web表单。

1.启用自动填充和自动更正

自动填写web表单

来源

自动填充填充,或根据网站或浏览器中以前提供的常用属性或响应(如姓名和电子邮件)填写表单字段。

自动更正更正,或更正,无效响应访客可能会意外尝试在字段中输入。例如,如果有人在您的表单中输入了错误的邮政编码,则表单可能能够根据某人的给定位置或他们以前提交的其他信息建议或修复该错误。

自动填充和自动更正是增强用户体验的两个功能,因为它们简化了表单完成过程。通过启用这些功能,您不仅可以确保提交有效的信息,还可以节省访问者的时间,简化表单填写过程,并帮助他们尽可能保持高效和准确。

2.排除所有的绒毛

exclude-fluff-in-web-forms

来源

通过排除所有“无用的”——即任何不是绝对必要的单词、图像、字段或字符,使您的表单尽可能简单易懂。通过排除所有不必要的信息,可以基于以下几个原因增强表单的UX。首先,它消除了你的访问者可能因为拥有太多的信息而产生的困惑。其次,用户提交信息时可以减少摩擦,就像滚动或试图确定什么是重要的。

3.将表单布置在一列中

one-column-web-form-layout

来源

你的表单字段布局应该组织在一个列中,而不是将多个字段放置在同一行或不同的位置。您的访问者将很容易地看到所有必要的字段,并能够按tab向下到下一个打开的框,如果他们选择通过这种方式工作。

成功的用户体验的一个主要方面是易用性。通过将所有表单字段布局在一个列中,访问者将能够自然、轻松地浏览表单。

4.别忘了手机友好型设计

IMG_0842

来源

现在,您的web表单包含页面设计由于浏览网站、注册新帐户以及从智能手机或平板电脑购买物品的人数众多。如果没有移动友好的设计,您的表单将无法通过这些设备中的任何一个安装或运行良好。

出色的用户体验意味着为访问者提供优质的端到端体验。这意味着您的访问者需要与您的网站进行一致、积极的互动,无论他们使用的是什么设备。如果没有移动友好的设计,您的表单将无法帮助您改进用户体验或提高转化率。考虑到有多少人经常携带移动设备并通过智能手机或平板电脑浏览网络,这可能会给您的企业带来毁灭性的损失。

5.提供输入约束

web表单中的输入约束

来源

如果您的站点上有一个带有长格式文本输入框的表单(这意味着您需要访问者的简短回答或段落回复),则应包含输入约束。这些限制阻止访问者超过一定的字数或限制。这是一个有用的特性,因为它为访问者提供了参数。它还可以防止您和您的企业阅读长达几段的回复。

输入约束增强了用户体验,因为它们为访问者提供了保持高效的指导原则。他们确保你的访问者确切地知道他们对他们的期望,他们需要与你分享多少信息,并防止他们浪费时间写冗长、不必要的回复。

6.必要时使用多步骤表单

多步骤web表单

来源

多步骤的形式在有多个表单字段的情况下使用,其中多个表单字段可以划分为类别(例如“个人”、“运输”、“账单”和“支付审查”)。它们提高了用户体验,因为它们使访问者更容易完成他们的目标(完成和提交表单),从而提高了表单的可用性。使用多步骤表单,你可以把你的字段分割成几个更短的表单,每个表单都在单独的网页上。它们有助于组织表单字段,并使表单对用户显得更易于管理。

7.提供清晰和明显的操作按钮

web窗体操作按钮

来源

操作按钮是你的访问者点击进入一个多步骤表单的下一部分或提交表单的按钮。不用说,它们是你的网页表单的关键部分,这就是为什么你需要确保它们是明亮的,粗体的,明显的。

明显而清晰的操作按钮提高了表单的可访问性,因为它们被普遍认为是提交表单信息的方式。此外,因为它们很容易看到,你可以避免让访问者在提交信息时感到困惑。

8.创建内联字段标签

inline-form-field-labels

来源

内联表单字段标签是位于字段本身内部的表单字段标签。它们使你的表格看起来整洁。将标签与字段对齐是为访问者命名字段的最周到的方式——这样做可以提高表单的易用性,因为不存在标签属于哪个字段的问题。

9添加内联错误消息

内联错误消息

来源

现在,您已经知道了内联表单字段是什么,您可能可以猜出内联错误消息是什么——它们通过在问题所在的字段中突出显示问题,将访问者指向其表单中的错误。这些消息确保没有关于哪个字段包含错误的问题。其中一些信息甚至包括一个简短而清晰的声明,解释访问者如何进行必要的更正。

错误消息通过让访问者尽可能容易地纠正手边的错误来提高用户体验。内联错误消息会让您的表单和公司感觉很专业和周到。bob全站app

10标记必填与可选表单字段

必填和可选表单字段

来源

您应该始终将表单字段标记为“必需”或“可选”。你可以在你的字段旁边用小字体写上“必选”或“可选”,或者在你的必选字段旁边放一个星号,这样你的访问者就不需要填写什么了。

将表单字段标记为必需的或可选的,通过使每个人都可以访问表单来改进用户体验-在访问者填写表单时,您为他们提供了一组期望值。这不仅可以确保所有访问者都在同一页面上了解他们所了解的信息需要提交,但也可以避免他们浪费时间提交和重新提交表单,以尝试确定哪些字段是必需的。

回到你身边

伟大的用户体验是如何确保网站访问者和表单之间的积极互动。通过将这些用户体验指南和示例考虑在内,您将为您的访问者创造一个良好的体验,使他们能够继续与您和您的公司开展更多的业务。让这些例子启发你自己的用户体验设计,这样你就可以实施最适合你的网站、业务和需求的指导方针,从而提高转化率,给访问者留下深刻、持久的印象。bob全站app

用户体验的模板

用户体验研究工具包

最初于2019年1月11日下午2:00:00发布,于2021年6月10日更新

话题:

形式 免费在线表格生成器