您应该在页面上尝试使用表单进行 A/B 测试

已发表: 2022-06-02

许多网站最重要的目标之一是获得更多潜在客户或订阅者。 为此,您可能有一个或多个页面,您可以在其中显示一个表单,让访问者与您联系,请求有关您的产品的更多信息或订阅您的时事通讯。

从转换的角度来看,带有表单的页面的设计和内容可能很关键,因此,今天我想与您分享一些 A/B 测试类型的示例,您可以尝试使用它们来优化转换(访问者联系或订阅)。 在接下来的示例中,您将看到页面上的表单是使用 Nelio Forms 创建的,这是我们与 WordPress 完全集成的表单创建插件。

表单在页面中的位置

当我们谈论提高页面转化率时,最常讨论的要点之一是号召性用语的位置。 如果我们的目标是让页面访问者填写表格,请尝试将您的表格放在不同的位置并分析哪个最适合您。 让我们看一个简单的示例,说明如何使用 WordPress 中的 Nelio A/B 测试插件创建这样的测试。

假设我们要创建 Nelio Unlocker 页面的测试(我们的插件,可将任何网页转换为 WordPress 或 Elementor 块编辑器),然后通过将表单放在页面上方来检查是否有更多访问者与我们联系。

在替代测试中,正如您在上一张图片中看到的那样,我不仅将表格向上移动,而且为了使其在美学上看起来更好,我将带有示例的部分放在页面的下方。

我们如何使用 Nelio A/B 测试插件执行此测试? 首先选择您要创建一个新的测试页面:

Nelio A/B 测试中的测试列表
Nelio A/B 测试中的测试列表

在为 test 命名并选择要测试的页面后,默认情况下,您创建的每个变体都是原始页面的副本,您可以对其进行编辑以根据需要进行更改。

创建页面表单放置测试
创建页面表单放置测试。

Nelio A/B 测试(作为一个完全集成在 WordPress 中的插件)的巨大优势在于,进行变体更改就像在块编辑器中编辑任何页面一样简单。 在这种情况下,您只需选择要移动的页面的一个或多个块并更改它们的位置。

编辑 A/B 测试页面变体
编辑 A/B 测试的页面变体。

进行必要的修改后,剩下的就是保存页面,返回我们正在创建的测试,并指出测试的转换目标和操作。 在此示例中,我们的目标是填写联系表。 在“转化目标和操作”部分,指定目标名称并添加转化操作“表单提交”。

定义测试的目标和转换动作
定义测试的转换目标和操作。

正如您在上图中所见,您有一个下拉菜单,您可以在其中选择必须提交的表单才能保存为此测试的转换操作。

就是这样! 您现在可以点击测试的开始按钮,以便该页面的一半流量看到一个替代方案,另一半看到另一个。 在测试的结果页面上,您将能够跟踪每个变体的访问和转化,从而分析哪个选项最有效。

要填写的字段数量和类型

在 Hubspot 进行的一项分析超过 40,000 页的研究中,他们观察到要填写的字段数量和每个字段的类型会影响他们获得的转化率。

您可以从上面的图表中看到,正如您可能已经猜到的那样,要填写的字段越少,访问者就越容易与您联系。 尽管如此,您还必须权衡从表格中获得的信息的质量:您确定希望路过的任何人与您联系,还是只喜欢那些真正感兴趣并愿意为您提供更多信息的人他们自己?

尝试执行不同的 A/B 测试,修改表单字段的数量和类型,并分析最适合您的方式,如下例所示:

要创建这样的测试,如果您使用像 Nelio Forms 这样的插件,它就像创建一个额外的表单一样简单。 您会看到表单编辑器与您已经熟悉的块编辑器几乎相同:

创建一个新的联系表格
创建一个新的联系表格。

并且在编辑测试的替代页面时(记住它是原始页面的副本),您只需用创建的新表单替换您拥有的表单,从可用表单列表的下拉列表中选择它。

用创建的新形式替换变体中的原始形式
用创建的新形式替换变体中的原始形式。

在这种情况下,请注意,在指定测试的转换目标和操作时,您必须将两个表单的提交添加为转换操作。 这样,提交这两种形式中的任何一种(测试的每个变体中的一种)都将被记录为转换。

两个测试转换动作的规范
两个测试转换操作的规范。

在哪里显示表单标签

Luke Wroblewski 多年前的一篇文章(表单设计参考)比较了在每个字段上方或左侧显示字段标签的优缺点。

如果您在前面的示例中注意到,具有许多字段的垂直表单的问题之一是它们会占用太多空间。 您可以尝试的一种替代方法(我个人认为使表单非常干净)是不将字段标签显示为单独的实体,而是在其中写入占位符。

如果您使用 Nelio Forms,只需在字段设置中指示应隐藏标签,然后只需编写适当的占位符即可:

隐藏字段标签并写入占位符
隐藏字段标签并编写占位符。

这样,您将减少表单的高度,并且用户将很容易看到在每个字段中输入的内容。

没有标签和占位符的表格
没有标签和占位符的表格。

提交按钮文本和颜色

测试不同的颜色和不同的号召性用语文本也是一种非常流行的提高转化率的测试类型。 您会发现人们告诉您一种颜色或另一种效果更好,或者信息应该是某某……但我们的建议是测试并确认您的访问者最喜欢什么。 这正是我们在我们的一个网站上所做的,测试不同的按钮颜色并查看最适合我们的方法。

在使用像 Nelio Forms 这样完全集成到块编辑器中的插件的情况下,只需创建尽可能多的表单作为您想要测试的替代品,每个表单都有您想要的颜色、样式和按钮文本感兴趣。要做到这一点,就像复制原始表单并修改按钮的特征一样简单,就像在任何页面或帖子上一样。

带有自定义提交按钮的表单
带有自定义提交按钮的表单。

数据隐私信息

最后,您可以对表单进行的另一项测试是尝试对您收集的数据的隐私使用不同的措辞,看看它有什么影响。 人们不希望收到垃圾邮件,因此,为了建立信任,明确强调您不会与第三方共享任何数据会有所帮助。

带有关于数据隐私的替代文本的表格
带有关于数据隐私的替代措辞的表格。

尝试不同风格的不同替代措辞,并分析每种替代措辞可能产生的影响。

结论

今天我们想分享一些想法,您可以在带有联系表单的页面上进行测试,以提高其转化率。 请记住,无论您找到多少建议,只有在执行 A/B 测试后,您才能确定哪些在您的网站上最有效:无论是更改表单在页面中的位置还是测试不同的表单内容,运行几个测试并了解如何获得更多潜在客户、订阅者或客户。

如果您使用原生 WordPress 插件(如 Nelio Forms)创建表单并使用 Nelio A/B 测试执行 A/B 测试,那么使用表单测试页面从未如此简单!

罗伯特·阿纳什 (Robert Anasch) 在 Unsplash 上的特色图片。