高转化着陆页背后的 8 个设计原则

已发表: 2020-05-08

因此,您发现了 Divi 并开始寻求创建网站。 但是,随着网站上线,您发现虽然它看起来很棒,但您并没有达到您心目中的转化目标。

这并不意味着你应该放弃你的努力。 尽管 Divi 可以让您跳过制作漂亮网站所需的所有学习,但您仍然需要了解创建可转换设计的原则。

为此,您需要学习基本原理并尝试在您自己的网站上实施它们。 当然,您需要对应用程序进行一段时间的试验,而进行 A/B 测试将帮助您更快地达到目标。 但是,如果没有这些原则,您将弄清楚如何处理网站以使其转换时间更长。

问题是,对大多数人来说,为着陆页找到完美的转化率并不是一个快速的过程。 没有什么神奇的公式可以让着陆页的转化率从 0% 跃升至 50%。

但是,当您自己申请时,将您网站已有的转化率提高 100% 甚至 300% 并不是一件不寻常的事情。 即使它从 1% 增长到 3%,每 100 名访客多两个潜在客户,这可以改变您的业务的游戏规则。

要实现这些结果,您唯一需要做的就是学习一些通用规则,这些规则将使您的着陆页变得更有利可图。

在这篇文章中,您将发现八项设计原则,这些原则将有助于使您的着陆页更有效。

为人设计

每个企业的受众都是不同的。 他们是不同的人,他们希望从产品中获得不同的东西,他们的想法也不同。 你需要了解你的一切,才能传达他们需要听到的信息。

如果你还没有开发买家角色,你需要为登陆页面做这件事。 完整的初学者最好检查整篇文章,但如果您已经对买家角色有所了解,那么您可以在此处找到有关您的受众的信息。

  • 谷歌和 Facebook 分析。
  • 搜索 Google 关键字的意图。
  • 在 Reddit 和 Quora 上寻找公众意见。
  • 研究用户的社交媒体资料。
  • 进行个人访谈。

现在,对于大多数中小型企业来说,进行个人面试可能是一种矫枉过正。 您不需要在客户研究上走那么远,前四种方法足以升级您的着陆页。

最重要的是为其受众设计每个特定的着陆点。 您是否为高价值的终身客户线索和折扣购物者举办了两个不同的营销活动? 你不能有相同的着陆

一致性

这条建议听起来像是“不要混淆”。 嗯,就是这样。 您需要使着陆页的设计和消息与源链接的设计和消息保持一致。

一些着陆页从搜索结果中获得流量,一些从付费广告中获得流量。 如果您的情况是后者,请确保横幅、消息和登录页面设计一致。

如果差异很大,用户可能会认为这是一个骗局。 但是,作为恶意表现出来并不是您应该担心的唯一事情。 如果指向页面的链接和页面本身之间的消息不一致,则许多潜在客户会因为找不到所需内容而直接退回。

极简主义

这一设计原则不仅在您创作当代艺术时有用。 它对于设计着陆页也非常有用。

问题是,登陆页面并不是向访问者提供尽可能多的信息。 这是关于简化转换。 页面上的附加元素越少越好。

确保页面上没有干扰,用户会被直接引导到 CTA 部分。

这个非政府组织网站尽可能小。 顶部的直线略微提示向下滚动以查看更多信息。

来源:加利福尼亚电话

但是,您不必像这个加利福尼亚非政府组织那样在您的着陆页上采用完全艺术化的极简主义。 您可以像 Shopify 一样保持最少的元素数量。

来源:shopify

当潜在客户没有被登陆页面上的 CTA 和干扰轰炸时,他们会阅读您提供给他们的少量信息并继续滚动。

前景化

这个设计原则非常简单,您已经在日常生活中使用了它。 将您的登录页面视为学生的教科书。 本书中的所有信息都很重要,但最重要的部分用不易错过的黄色标记突出显示。

使用背景和字体颜色、字体大小和形状以及空白来突出页面上最重要的元素。

前景化的最简单示例是使子标题更大并赋予它们不同的颜色。

为重要的 CTA 提供对比色也是一种常见做法。

引起注意

当新的潜在客户从广告登陆页面时,您有很短的时间来吸引他们的注意力。 一些消息来源声称时间范围小至 2.6 秒。 如何在不到 3 秒的时间内引起陌生人的注意? 这里有四点建议。

  • 使用运动(我们不情愿地对其做出反应)或折叠上方的人脸
  • 用一句话解释你的报价
  • 可能通过提供免费试用来激发兴趣
  • 显示重要的统计数据或数字

这个 Airbnb 登陆页面做了列表中的三件事。

来源:爱彼迎

它有一张友好的面孔,会自动引起注意。 一个人看到的下一件事是赚钱的提议。 当 Airbnb 向他们展示月度估算时,该公司会全神贯注。

用户体验写作的网格和视觉传达

好的网站设计或多或少是统一的。 一个好的音调不是。 考虑您对受众的所有了解,并制作一条能够说服用户进行转化的信息。 利用您了解的客户的社会因素、痛苦和价值观。

不过,不要写一篇 1,000 字的文章来说明你的产品为什么好。 尽可能简短,并使用网格来组织您要说的内容。

这是一个你可能已经知道的设计原则,因为包括 Divi 在内的每个框架和模板都有它。 这是 Shopify 使用的三列网格。

来源:shopify

这是一个包含来自 Airbnb 登陆页面的两列网格。

来源:爱彼迎

网格可能看起来有点无聊,因为每个人都在使用它们,但它是为数不多的有助于理解你的观点的东西之一,所以这是一种妥协。 如果带有图标和文本的简单网格对您来说太无聊了,请用空白和不同的前景为其增添趣味。 使用 Divi,您可以随时随地进行设计并使您的网格图案看起来恰到好处。

您可以用于用户体验写作的另一个重要设计原则是视觉传达。 UX 写作不仅涉及文本。 使用图像、动画或视频来解释您的产品可以为客户做什么。

这是来自加州非政府组织的一个简约而大胆的例子。

来源:加利福尼亚电话

轻松转换

设计实体店的人不会让顾客跳过铁环去买杂货。 您也不应该要求客户通过 10 分钟的注册过程进行购买。 事实上,登陆页面上的表单字段越多,获得的转化次数就越少。

保持一个人需要做的动作数量,以尽可能少地转换,并使号召性用语具有前景且非常明显。 如果您提供各种免费试用,您可能只需要一个 CTA 按钮。 毕竟,这个提议已经不需要太多的努力了。

如果不这样做,请保留第二个选项,以防用户现在还没有准备好进行转换。 选择不应该在是和否之间,而是在是和是之间,但稍后。

将聊天机器人作为您的备用 CTA 也是一个好主意。

研究人们如何与设计互动

从这些原则入手并进一步了解 Google UX 指南是转换网站的坚实基础。 但是,如果您想成为一名出色的设计师,您应该研究用户如何与您的设计进行交互。 尤其如此,如果数十万美元的收入处于危险之中。

你是怎样做的? 您可以从从客户的角度探索网站的外观开始。

使用 Chrome 或 Firefox 开发人员工具调整浏览器窗口的大小,以查看设计在不同大小的屏幕上有何变化。 您的网站是否针对来自全球不同地点的客户? 为了更好地测试,您应该另外使用 VPN。 例如,有许多适用于 Mac、Android 等的 VPN。 这将帮助您不会失去客户。

如果您是来自日本或新西兰的访客,它还可以帮助您了解加载速度。 如果您的服务器仅位于美国,那么来自其他国家/地区的访问者可能会遇到更长的加载时间,这不是您想要的。

最后,您需要查看实际用户如何与您的网站互动。 设计多个版本的登陆页面并使用 Divi 的拆分测试工具来查看哪个版本效果最好。

要获得更多洞察,请使用 Hotjar 之类的热图工具来查看人们点击和悬停鼠标的位置。 如果您的 CTA 没有得到您想要的关注,则表明您需要改进。

最后的想法

这八项设计原则将大大有助于使您的着陆页变得更好。 但是不要仅仅因为你了解了其中的八个就停止学习。 了解有关着陆页设计原则的更多信息,通过学习如何在 Divi 中创建视差背景来吸引潜在客户的注意力,从而提升您对 UI 设计的了解。

精选图片来自 PureSolution / Shutterstock.com