你尽你所能 创建一个网站 这将引导访问者进行转换。 当您研究分析时,您会很高兴地看到您创建的用户旅程一次又一次地得到访问者的支持。 但是,有一些东西阻止他们被转换。

Le 联系表 是访客旅程的重要组成部分。 即使您实际上拥有网站可以提供的几乎所有内容, 联系表 如果使用不当可能会破坏体验。 “损坏的”按钮、混乱的字段、太多的步骤、杂乱的界面……甚至是 联系表 可能会破坏用户体验。

有很多事情可能会出错。

5建立完美联系表的规则

2014 年发布的一项谷歌眼动追踪研究表明,遵循最基本的设计使用指南 形式 将显着改善用户体验。 具体来说,当联系表满足所有规则时,78% 的用户可以一次性填写并提交。 然而,当联系表违反这些规则时,只有 42% 的人能够一次尝试这样做。

好奇这些规则是什么? 因此,请继续阅读。

规则1:专注于对齐

正如您将在此处的其他规则中看到的那样,人们通常关心的是 形式 联系,这往往会导致糟糕的设计选择。 以对齐问题为例。

您可能会在BrainTraffic网站上看到类似这样的表格,并认为:嗯……那不是太长了吗?

填写form.png

解决此“问题”的一种方法是将标签向左移动,并将答案字段向右移动。 但是,UX专家会告诉您这是主要的禁止事项,因为它会损害扫描表单的能力。 如果您考虑将这些字段水平相邻放置,则同样适用。

如果你想要你的 形式 触点符合对齐标准,您需要执行以下操作:

  • 左对齐所有标签,表单字段和主要的号召性用语按钮。
  • 切勿水平对齐相关字段。 您可以在逻辑上构造表格,但是每个问题或字段都应垂直堆叠。
  • 任何具有多项选择题(选项少于六个)的字段都必须显示在点或复选框的垂直列表中,而不是在下拉菜单中。

规则2:包括所有相关字段

在设计联系表单时,您可能会认为越短越好,对吗? 并非总是如此。 最重要的是,您为用户提供了所有必要且相关的字段。

Unbounce的高级转化优化工具Michael Aagaard做了 演讲 在2015年解决了这个问题。 他和他的团队想知道如果缩短此联系表会发生什么:

联系方式的例子court.png

如您所见,他们删除了他们认为不必要的字段,以简化填写表单的过程。 但是,测试结束后,他们发现转换形式较短的转化率下降了14%。

规则#3:简化字段

用户是否正在使用台式机或移动设备与您的联系表单进行交互,或者他们是否需要辅助技术来帮助他们,都应该配备该表单。简化入境手续。

这是您应该知道的一些技术:

制表
对于桌面用户和具有可访问性问题的用户,请确保您的联系表已启用逻辑选项卡排序。

输入掩码
可以使用户使用自动将其格式化的输入掩码来添加它们,而不是强迫用户猜测要如何格式化某些字段。

格式化字段html.png

Google自动补全
而不是编码每个字段,以便 形成 根据要遵守的标准自动执行,请使用Google Addresses自动填充插件激活自动填充。 这不仅使您免于处理拼写错误和错误填写地址的麻烦,而且还使您的访客免于键入大多数此类信息。

规则#4:全部退出

虽然我意识到此规则将违背极简主义的基本原则,但是您应该密切注意这条规则,以避免不必要地使您的访客感到沮丧。

让我解释一下:您有一个看起来很简单的联系表。 您的用户根据标签的建议进行填写,然后单击“提交”按钮。 然后他们收到一条可怕的红色消息:“您做错了! 返回,更正表格并寄回! ” 

您可能以用户身份遇到过它,并且知道它会令人沮丧,尤其是当引发错误时,您输入的某些信息被删除时。 因此,不要让用户猜测什么需要修复以及如何解决,不要让它到达这一点。 拼写途中的所有内容:

  • 在该领域(尤其是在移动领域)提供重点,以便用户确切地知道他们在哪里填写表格。
  • 如果您不使用输入掩码自动格式化字段,请写下所有格式要求。
  • 明确指出字段何时为“可选”(使用单词,而不是红色星号)。
  • 输入用户时,让用户选择显示或隐藏密码字段。
  • 用户进入字段后立即显示错误消息。 不要等到最后。

形式wordpress.png错误

规则#5:不隐藏建议

联系人表单中的板文本如下所示:

领域与tips.png

查看目标如何将标签放置在字段中? 在某些联系表中,这些标签/指示仅在用户单击字段时消失。 目标对此稍有不同,将标签移到字段框的顶部(请参阅“电子邮件地址”)。

无论如何处理,可用性专家(例如该小组) 尼尔森诺曼, 会告诉您这是不良的设计习惯,因为:

  • 对于下一个领域中的多任务处理,分心或过于快节奏的用户而言,这是个问题。 当线索消失时,用户必须离开该字段才能重新发现他们需要的东西。
  • 消失的提示还会阻止用户返回表格来检查其工作或更正错误,而无需完全删除响应以查看下面的内容。
  • 用于占位符提示的较浅的灰色文本不是易于阅读的理想选择。
  • 带有提示文本的字段可以与已经填写数据的字段混淆,从而使用户忽略它们,提交表单并收到错误消息。
  • 某些屏幕阅读工具无法阅读提示文本。

据NNG称,用户发现空字段比包含线索文本的字段更具吸引力。 即使您的表单看起来更长,将这些标签或描述符放置在字段上方,它也会提高可用性。

就是这些提示,希望它们能帮助您建立更好的联系表。