打造转化-着陆页设计最佳做法

本文概述

突出优势
使用相关图像
测试你的CTA
使其适合移动设备
使其与引荐来源保持一致
包括社会证明
不要让着陆页完成一项工作
不要要求更多的信息
不包括导航栏
不要使页面混乱
不要偏离既定的模式
不要泛泛
总结

登陆页面是访问者在点击市场营销号召性用语后到达的任何页面。这可能是搜索或展示广告, 电子邮件, 社交媒体帖子或会员链接。
一些公司将来自那些引用来源的流量发送到其主页。那是一个错误。着陆页具有多种好处, 包括与任何引荐来源都一致的明确优惠。与仅将新访问者发送到主页并希望他们弄清楚如何找到单击后提供的内容相比, 这带来了更高的转换。
设计人员可以遵循以下着陆页设计最佳实践来创建着陆页, 以更有效地进行转换。
突出优势产品设计师倾向于将重点放在功能上。消费者想知道好处。他们想看看这些功能如何影响他们的体验。人们不会因为300马力而买车。他们之所以购买它, 是因为300hp可以让他们快速运转。这就是为什么许多汽车广告提及其0-60次而不是仅提及马力数字的原因。
在目标网页上, 这意味着使用标题和项目符号列表之类的元素来突出产品的优势。这是用户首先要知道的：该产品如何使我的生活或业务受益？

文章图片
Teambit几乎完全专注于在其目标页面上为其客户带来的收益, 例如创建高绩效团队之类的事情。
使用相关图像人是视觉上的生物。缺少图像可能会使查看登录页面的人感到不安。良好的形象会增加消费者与公司之间的信任感。
有许多类型的图像可以有效地用于登录页面。产品图片是最明显的选择。

文章图片
Square在其着陆页上使用其销售点硬件和软件的图像。
随着用户对真实人物图片的反应更好, 使用该产品的人物图片更具吸引力。另一方面, 模型的库存照片不一定会增加用户的体验。

文章图片
Airbnb会在目标网页中使用包含真实人物的图像来吸引新主人。
着陆页设计者应着眼于使用在访问着陆页的人们中产生情感反应的图像。
测试你的CTA 可以说, 任何登录页面中最重要的部分是号召性用语。由于它们的重要性, 设计人员需要测试其CTA, 以确保对其进行了优化以获取最大数量的访问者的正面反馈。
A / B测试是测试CTA的最简单方法。设计人员可以在指定的时间内将两个着陆页随机显示给访问者, 除了CTA本身的差异以外, 每个着陆页都是相同的。从那里开始, 他们可以继续完善和测试, 直到CTA获得理想的结果。
设计人员应考虑测试CTA按钮的颜色, CTA周围的语言(以及按钮本身)以及CTA在页面上的位置。 (登录页面的其他部分也可以进行A / B测试, 以获得更好的总体效果。)

文章图片
Basecamp以广泛测试其着陆页的所有内容(包括其CTA)而闻名。
使其适合移动设备考虑到有多少人在他们的移动设备上浏览网络, 对于设计师来说, 忽略登陆页面在较小屏幕上的显示方式是一个错误。尽管可以创建在移动设备上看起来还不错的设计, 但是简化目标网页, 使其在移动设备上更有效是一个更好的主意。
移动友好性对于社交媒体帖子和广告或电子邮件所指向的目标网页尤其重要。 2017年, 有75％的电子邮件用户报告了在移动设备上检查电子邮件的情况(此后才有所增加)。全球有42％的人(不仅仅是互联网用户)通过移动设备使用社交媒体网站。此外, 在2018年黑色星期五的销售中, 有40％来自智能手机或平板电脑。
人们不仅浏览社交媒体并在智能手机上阅读电子邮件。他们进行购买, 注册服务以及以其他方式完成公司希望他们采取的行动。忽略了这个巨大市场份额的设计师充其量是短视的。

文章图片
Bench使他们的移动版本和桌面版本之间的消息传递保持一致, 但是简化和简化了移动版本。
使其与引荐来源保持一致当某人点击广告或电子邮件中的链接时, 至关重要的是他们最终到达的登录页面的一致性。这可以通过几种不同的方式来完成, 具体取决于引用来源是什么。
例如, 如果引荐来源是搜索广告, 则用户最终在广告和目标网页之间使用相同的语言提供了一致性。如果引荐来源是电子邮件, 则使用相似的图像和配色方案可以使访问者保持一致。
在设计目标网页时, 设计人员应该知道引用来源是什么, 以确保它们至少以几种方式匹配。

文章图片

文章图片
星期一使广告和目标网页之间的” 可视” 消息保持一致。
包括社会证明人们想知道他们正在考虑购买的产品使其他顾客满意。社会证明是提供保证的最好方法之一。
有几种方法可以提供社会证明。一种是在目标网页上突出显示推荐或评论。另一种方法是包括有关产品的社交媒体对话。设计师在执行此操作时应格外小心, 因为自动显示所有社交提及可能最终会同时显示好坏。

文章图片
Casper列出了他们在多个站点上的平均评价, 推荐书以及在其目标网页上突出显示给他们五星级评价的客户数量。
不要让着陆页完成一项工作着陆页只需要完成一项工作, 而这应该在设计之前确定。要求访问者购买商品但还注册新闻通讯的登录页面正在分散访问者的注意力。这样一来, 他们采取最佳措施的可能性就会降低。
设计者应考虑号召性用语, 并确保登录页面上没有其他提示。甚至其他导航元素之类的内容也可能引起访问者的注意, 并阻止他们完成所需的操作。

文章图片
雀斑的登陆页面保持整洁, 仅着眼于让人们注册免费帐户。
不要要求更多的信息询问过多信息可能是使访问者从目标网页退回的快速方法。但是, 通常会看到登录页面的表单不仅要求提供姓名和电子邮件地址, 还要求提供电话号码, 公司名称, 职务等。

文章图片
这种形式需要任何想要下载” 免费” 电子书的人提供大量信息, 这很可能会阻止许多访问者进行注册。
除非访问者可以立即看到提供该信息的价值, 否则它会大大增加他们从页面弹跳的机会。为了降低目标网页的跳出率, 设计人员只应要求提供最少的信息即可完成报价。

文章图片
Shopify使他们的初始注册表单保持简单：他们只需要一个电子邮件地址。
着陆页表单上常见的另一个关键可用性问题是未针对移动设备进行优化时。表单字段的编码方式应能提示每个字段适当的键盘布局。
这意味着, 例如, 当用户输入其电子邮件地址时, 键盘在主屏幕上显示” @” 符号。或要求输入电话号码时, 键盘将切换为数字输入。这个小细节极大地改善了移动设备上的用户体验。
不包括导航栏不包括导航栏直接与单一目标登陆页面的概念有关。导航在目标页面上看起来很杂乱, 并且可能导致用户单击网站上的其他页面而没有完成所需的操作。
消除导航栏有助于使访客保持工作状态。如果设计人员希望向访问者提供更多信息, 则应将其包含在目标网页本身或该页面下方的链接中, 最好是在第一个号召性用语之后。
为其他准备注册或购买的用户提供其他选择不会分散他们的注意力。尽管如此, 许多目标网页仍包含其他导航选项。

文章图片
除了下载按钮(以及发行说明和帮助的几个细微链接)以外, Muzzle的着陆页还删除了所有导航选项。
不要使页面混乱登陆页面应仅包含登陆该页面的人完成所需任务所需的信息。访问者需要更多的投资, 在大多数情况下, 将需要更多的信息。
例如, 不要求提供付款信息的免费试用版是一种低风险的产品, 不需要提供太多信息。
但是, 要求用户进行购买的页面通常需要向用户提供更多信息。该信息量仅随着价格上涨而上升。

文章图片
Asana的目标网页很简单, 而且要点, 其中包含标题, 号召性用语, 产品图片和大量空白。
设计师在创建登录页面时应遵循良好的设计原则, 就像创建其他页面一样。简约和简单的设计通常是首选, 只要它们适合所讨论的品牌即可。内容周围的空白可防止用户不知所措, 并使他们专注于重要的事情。
不要偏离既定的模式人们对着陆页有一定的期望。他们想了解其好处, 他们希望有一个明确的价值主张, 并且他们想要一个易于完成的号召性用语。
当设计人员偏离已建立的登录页面模式太多时, 他们就有可能疏远用户并干扰他们手头任务的完成。实验性设计很棒, 但通常更适合其他类型的页面和网站。

文章图片
Zoho的会计软件着陆页遵循久经考验的模式：标题, 少量额外信息以及号召性用语占据主导地位, 并伴随着产品图片。
不要泛泛固守既定模式是一个好主意, 但这并不意味着登录页面必须通用。设计师应该考虑如何在目标网页中包含其他详细信息和设计元素, 从而改善用户体验, 吸引用户的注意力并增强产品的价值。
这可能包括视频内容, 动画, 幻灯片或许多其他设计元素。适用于一种产品或服务的内容不一定适用于另一种产品或服务。设计师可以随意在目标网页上尝试非常规的内容, 但要准备针对更常规的方法进行A / B测试, 以确保他们不会将访问者赶走。

文章图片
Landbot的登录页面使用了动画聊天滚动条, 非常适合他们的产品。它使页面保持有趣和独特, 而不会增加混乱。
总结登陆页面是任何在线营销活动的重要组成部分。他们的独特目的有助于在不吸引访问者的情况下推动转化。
遵循着陆页最佳实践的设计师可以通过创建转换效果比竞争对手更好的页面为其服务的品牌创造更多价值。保持登录页面简单, 专注于CTA, 保持表格简短以及其他已提及的准则将使登录页面更有效地执行, 同时还改善了用户体验。
【打造转化-着陆页设计最佳做法】? ? ?
在srcmini设计博客上进一步阅读：