带有Shopify软件的手机图片

OB欧宝娱乐APP从Shopify开始你的业务

尝试免费的Shopify,并探索所有的工具和服务,你需要开始,运行和发展你的业务。OB欧宝娱乐APP

登陆页设计:如何创建更好的页面转换

一个登陆页面的模拟,一个女人拿着一个包旁边的文本,登陆页面转换

如果你把大量流量送到了糟糕的登陆页面,那么你投入到付费广告上的钱就毫无用处了。如果有人第一次接触你的业务是在一个令人困惑或设计糟糕的登录页上,他可能永远不会再来。这意味着你正在烧钱来吸引人们对你的产品感兴趣,结果却耗尽了这些前景,需要从头开始。OB欧宝娱乐APP

事实是,即使是一些全球最大的企业有一个或两个糟糕的登陆页面——这是一个常见的问题,但我们可以通过对目标受众的深入了解来解决这个问题。

登录页设计由视觉和文字元素组成,这些元素组成了一个优化的网页,以转化新客户并鼓励重复购买。简洁的视觉布局、利益驱动的文案和高质量的产品图像是引人注目的着陆页设计的三个指导支柱。

我们已经引进了几位专家来帮助您创建更好的登录页设计,培育潜在客户。

见见专家

我们汇集了一位营销专家,一位转换机构总监,一位转换ob欧宝娱乐app下载地址研究专家和一位登录页顾问,为您创建销售的登录页设计提供支持。

  • 以斯拉费尔斯通他是Smart Marketer的创始ob欧宝娱乐app下载地址人,也是公司的联合创始人兼首席执行官辛迪·约瑟夫《BOOM》以斯拉已经完善了登陆页面的基础上,对BOOM自己的超级成功的Shopify商店的产品页面的实验和测试。他在营销方面的专业知识来自于他自己ob欧宝娱乐app下载地址久经考验的数字营销经验,这些经验也为他在另一家公司Smart Marketer教授的课程提供了参考。
  • 本Labay, Speero的CRO和实验董事总经理:Ben是一位熟练的研究员和转换优化专家。他有超过10年的学术经验。
  • 迈克尔Aagaard, CRO顾问,Unbounce前高级转化优化师:Michael自2008年以来一直从事转换优化工作。他是转换研究方面的专家,使用实际试验和错误的结果来支持他的学习和建议。
  • 尼克·夏尔马, CEOSharma品牌尼克已经帮助创造了超过1亿美元的在线收入。Sharma Brands通过战略举措为企业增加数字收入。我们从他在登录页上的文章中提取了一些见解,为本文分享的建议提供参考。

如何围绕用户的需求构建登录页

虽然我们分享了更高转化率的登陆页设计的模板建议,但它们意味着一个起点基于你的目标受众和他们独特的需求。

根据Michael的说法,进行转换研究以获得基本的洞察力是成功设置登录页的关键部分。转换研究通常包括比如用户测试、分析网络流量来源、文案测试和调查。

Michael说:“人们经常忘记登陆页面是更大的用户旅程的一部分。“因此,他们最终会浪费时间去调整那些并不重要的闪亮的东西。除了登陆页面本身,还有很多因素会影响用户的决策过程——从广告来源和设备到意识水平和动机。你越了解这些方面,你就越有可能做出正确的决定,并创建真正吸引更多用户转换的登录页面。”

1.分析流量和设备来源

根据用户购买的设备构建登录页面是开始转换研究的一种方法。谷歌分析是一个伟大的合作伙伴,帮助您发现您的流量来自哪里,并了解您的浏览器最喜欢在哪种设备上购物。

如果你的大多数客户都是通过移动设备访问你的网站,你就需要优化你的登录页面以获得良好的移动体验。或者,如果你了解到你的购物者更喜欢桌面,你将更好地构建一个增强桌面体验的登录页面。在他的登录页公式尼克建议更深入地研究这些流量,以了解人们来自什么样的平台,无论是TikTok、Facebook还是一篇博客文章等。

正如Nik所写的那样,“不让你的页面与它们所在的平台相关联,会导致你的跳出率飙升,而你的整体平台ROAS(广告支出回报率)保持在较低水平。”

这种上下文相关的倾听能带来更好的客户体验,并为取得更好的成功建立下面的最佳实践。

当最佳实践脱离业务战略的背景时,它们就会失败。

本Labay

2.了解最佳实践什么时候会失败

本文中的技巧对于测试和反复使用它们的专家来说是成功的。但是在实现这些设计元素时要小心,不要理解它们如何与总体目标联系在一起。Ben警告说:“当最佳实践与商业战略脱节时,它们就会失败。”

如果没有上下文,最佳实践也会失败,了解您的目标受众想要什么和需要什么是构建高转化率登录页面的基础。

Michael分享道:“你越了解你的目标用户,你就能创建更好的登陆页面。不要被最新的设计潮流蒙蔽了双眼。相反,你要确保把所有的基础知识都准备好,并进行深入的用户研究,这样你才能做出影响用户行为的明智决定,而不是简单地调整页面布局。”

值得一提的是,不是所有这里列出的登陆页设计建议将适用于您的客户。你的选择很大程度上取决于你的目标受众和他们的需求。选择你需要的最成功的元素——你不需要全部使用它们!

3.考虑整个登录页的信息流

你应该关注整个页面的信息流,而不是仅仅针对页面上方和下方进行设计。但事情远不止如此。这里有一些关于登录页设计中神秘的“折叠”的背景,以及为什么这么多人建议把重要的东西放在顶部。

大多数网站访问者不会向下滚动页面

折页是网页上不需要滚动就可以看到的空间,它根据用户使用的设备而有所不同,无论是显示器、平板电脑还是移动设备,所有这些设备的屏幕尺寸都因型号而不同。一般,折线为从上往上600像素浏览器窗口的。

并不是所有的登录页访问者都会在桌面或移动设备上滚动页面。这个数据实际上很低——我们听说的数据从50%到85%的人不会滚动屏幕.由于浏览过折页的观众比例很低,许多人推荐一种基于两部分的设计策略:折页上方的内容和折页后的内容。

这不是折叠的问题,而是信息层次的问题

不管什么最适合你的客户,你总是想要考虑放在任何登陆页面顶部的文案和内容的类型。但是,正如Michael所揭示的那样,“试图在第一个屏幕中塞进大量内容往往会适得其反,导致用户体验非常混乱,被太多信息淹没。”

相反,Michael说:“营销人员应该少考虑‘ob欧宝娱乐app下载地址折叠之外’,而应该多考虑整体的信息层次结构和登陆页面内容的流程。”

Aagaard建议在构建登录页时考虑以下问题。但有一点需要注意:答案将取决于你对目标用户的整体用户旅程的理解,以及你希望登录页扮演的角色。

  • 你是否回答了正确的问题并解决了正确的障碍?
  • 你是否管理期望并跟进广告来源中的“承诺”?
  • 你是否按照正确的顺序传递内容,并为实现转换目标建立动力?

如果你想知道CTA的位置,这取决于你的听众需要什么,太。你可以通过测试位置来确定这一点,看看是什么推动了更好的转化率。

如何创建更好的登录页设计

你已经吸引了一位潜在客户的注意,现在你有几秒钟的时间来分享你的品牌和产品的独特之处。用几句话或几张图片就能表达出这一点是一个相当大的要求,如果潜在客户对你的品牌知之甚少,那就更难了。

虽然性能取决于很多因素,比如你的目标受众和你销售的产品类型,但保持整体页面设计简单可以帮助人们找到你最希望他们看到的信息。如果他们没有带走其他东西,你想要引起共鸣的是什么?

以下是如何设计更好的登陆页面转换:

  1. 优化你的购买盒转换
  2. 添加客户推荐和评论部分
  3. 拍好产品照片
  4. 扩展你的产品描述
  5. 包括认证和独特的销售主张
  6. 包括追加销售/交叉销售部分和其他产品建议
  7. 添加一个自夸栏和一个为什么部分

一个引人注目的着陆页设计元素的插图
一个引人注目的登陆页设计元素的示例说明。Shopify

根据您销售的行业和产品类型,您发送流量的登录页面可能看起来类似于产品页面,或者它可以是一个更精简的报价。

1.优化你的购买盒转换

Ezra Firestone称购买框是你产品登陆页中最重要的部分。它是页面上的一个文字框,具有高度优化的转换资产集,其中包括一个购买按钮。

什么是购买盒?

购买框是你登陆页面的转换引擎。一般来说,如果你在桌面上看,购买框包括一个图像传送带,左边是产品的照片,你的概述,销售文案,定价,评论星星,购买按钮或商店支付按钮,以及右边按钮下的独特销售主张。下面是一个桌面购买框的例子。

Peepers网站上渐进式眼镜的截图
一个Peeper的购买框在桌面视图。私家侦探

购买框是每个登陆页面的一小部分,需要产生很大的影响。

正如以斯拉告诉我们的那样,“大多数企业在购买框中没有销售副本,他们在框中没有社会证明,他们在添加到购物车按钮下没有独特的销售主张和图像格式,产品传阅器的图像看起来并不好看。购物盒就是一切。”

有一些模板元素可以让你的副本和图像真正发光。一个高度优化的购买盒包括以斯拉所说的“转换资产叠加.”

    下面是在桌面上可以看到的一个例子:

    Brightland的大蒜橄榄油产品的登陆页设计
    Brightland为在网上浏览大蒜橄榄油的搜索者提供了这个登陆页面。Brightland

    2.添加客户推荐和评论部分

    最小的星球之一,以斯拉对购买盒做的最有影响力的调整在他自己的Shopify商店上添加客户见证在方框的顶部,取代项目名称。这是它的样子:

    一个屏幕截图的一个标记的购买盒子上的BOOM由辛迪约瑟夫网上商店
    聪明的营销人ob欧宝娱乐app下载地址员

    在顶部添加报价可以建立信任,不会让人们去搜索评论,让你自己的客户说话你。只要确保你选择的报价直接涉及每个产品解决的好处或痛点。

    此外,考虑为你的顾客评论设置一个完整的部分,这样顾客就可以读到真正购买过你产品的人的观点。确保至少展示一些差评和中等评价,这样其他人就能完全了解人们喜欢什么,不喜欢什么。

    包括星级评价

    如果你得到了积极的评价,在购买框上添加一个星级来建立信任。如果你有超过50条评论,也可以考虑在星星旁边增加评论的数量。

    3.拍好产品照片

    你所包含的产品图片很可能是只有潜在买家在考虑购买你的产品时所拥有的东西,特别是如果你是一个直接面向消费者的品牌。图像是指买家如何描绘一件商品,但却无法为自己保留它。如果你发布的照片不能完全捕捉到你的产品有多么令人惊叹,那么客户就很难做同样的事情。

    白色背景上的棕色靴子、腰带、裤子、衬衫、手表和太阳镜
    Unsplash

    优化产品照片的速度和兼容性

    扣上较小的细节,以确保更流畅的体验。使用图像压缩器TinyPNG降低图像大小,以加快加载时间。添加图像边框和上下文文本,说明产品的好处,而不是功能。用你的网站建设者检查图像旋转木马和cta在桌面和移动设备上的渲染方式,以确保它们针对这两种情况进行了优化。

    4.扩展你的产品描述

    你可能在购买盒中包含的产品描述很可能是一份简洁的副本,可以立即传达你的产品的实际情况是多少。您在页面下方有更多的空间来提供详细信息,以直接处理可能阻碍客户完成购买的任何异议。

    眼镜行业Peepers在这方面很专业:上面是大量的产品图片,下面是详细信息和描述,列出了使用Peepers镜头的所有好处。

    Peepers在线商店上的产品描述截图欧宝体育官网入口首页
    Peepers利用折叠下方的空间分享深入的产品信息,如镜头细节、尺寸和客户评论。私家侦探

    当你制作产品细节文案时,首先写出你的产品是什么以及它的用途。然后,列出独特的好处,这可以说明你想要解决的痛点或你想要填补的市场空白。ob欧宝娱乐app下载地址选择将所有东西都包括在购买框中?考虑添加一个切换选项,就像Brightland为其橄榄油所做的那样,并进一步探索产品的好处。

    Brightland为The Duo设计的产品登陆页面的截图
    Brightland

    5.包括认证和独特的销售主张

    认证对购物者大有帮助,有些人没有认证就不会购物。跳跃的兔子,非转基因,或认证的B公司是三个例子。如果你获得了什么认证,把它放在你的登录页上。

    Olipop在线商店上的Olipop认证截图欧宝体育官网入口首页
    Olipop

    你的产品也可能有一些独特的卖点(USPs)。如果你还没有写出来,那就花点时间来开发你的产品与竞争对手的不同之处。这个练习需要时间,但是你的USP副本将告诉你如何在市场上定位你的整体品牌,以及你如何构建你的登录页。ob欧宝娱乐app下载地址

    6.添加追加销售/交叉销售部分,并提供其他产品建议

    你已经吸引了顾客的注意力,那么为什么不推荐他们会喜欢的其他产品呢?如果他们看到他们喜欢的东西,您就提供了一种快速而简单的方法将其添加到购物车中。您可以向您的商店添加一个插件来完成此任务。如果你在Shopify上,重新转换追加销售和交叉销售蜂窝追加销售和交叉销售,一键向上销售- Zipify OCU都是很棒的应用程序。

    Shopify应用商店上的ReConvert Upsell和Cross sell截图

    7.包括一个自夸栏和一个为什么部分

    你曾在新闻刊物上出现过吗《福布斯》《纽约时报》,或《连线》杂志?在你的登陆页面上引用这些文章的标志,Nik称之为“自夸吧”。这些出版物为你的品牌增加了可信度,提到它们对寻找更多信息的购物者有很大帮助。

    Brightland网站上的标志截图
    Brightland

    Nik开创的另一个登陆页部分是“为什么”部分吗.不要在你的登陆页面上,把为什么人们应该购买你的产品,Nik建议在它自己的部分明确指出.标题可以简单地写成“为什么[你的企业名称]?”,并在下面加上一段福利。或者,你可以选择几个图标,代表你的品牌的主要区别,并为每个图标写一份文案。

    如果你进行测试,你不会想要测试来证明你的观点,而是挑战策略或测试与客户问题或商业机会直接相关的假设。

    本Labay

    测试登陆页面设计

    一旦你有了你的登陆页面和一些有意义的流量进入你的网站,你可以开始对你的登陆页面设计的不同部分进行A/B测试,以确保它以尽可能高的速率转换。OB欧宝娱乐APP

    然而,这不仅仅是找到最好的宣传口号。Ben指出:“如果你进行测试,你不会想要测试来证明你的观点,而是挑战策略或测试与客户问题或商业机会直接相关的假设。”

    Ben说,测试应该与你的业务增长模式相关的因素成正比。如果你想获得更多的客户,让你的Instagram赚钱,或者留住现有的客户,登录页面体验和测试假设需要相应地改变。


    登录页设计示例

    私家侦探

    私家侦探出售价格实惠和时尚的老花镜。从把它放在奥普拉最喜欢的东西清单上,到使用积极的文案和利益驱动的语言,Peepers创建了直接说出目标受众想要的东西的着陆页面。

    Peepers产品登陆页面设计的截图
    皮珀一家买了盒子。私家侦探

    其设计产品登陆页面在桌面上和移动端都是干净,清晰,易于导航。购买盒里有大量的产品图片,用奥普拉最喜欢的东西标签建立社会认同,并拥有一个五星级的评级,列出了实际的评论数量。它还包括虚拟试戴功能,这样顾客就可以看到一副新镜框戴在脸上的实际效果。在滚动页面时,访问者会看到列出这两种功能的产品描述而且优点,和一个全面的细节部分与精确的测量,以确保非常适合。

    Brightland

    Brightland销售来自加州的特级初榨橄榄油。它的登陆页面采用了模块化的方法,有明确的线条,流行的颜色,明确的好处,以及如何使用的部分,以食谱配对为特色。

    Brightland登陆页面设计的截图
    在桌面上的艺术家胶囊的产品登陆页面。Brightland

    Brightland的产品登陆页面设计在桌面和移动设备上是不同的。桌面登录页面(如艺术家胶囊页面)包括一个额外的Enjoy With部分,列出了最适合每种油的配对选项。这个奖励部分在移动设备上是不存在的,客户只能在产品描述和艺术品的更多信息之间切换。

    根据客户在台式机和移动设备上访问的不同需求或行为,考虑优化桌面和移动登录页面设计。一个很好的方法来弄清楚什么是有效的,是测试着陆页面的变化,以确定一个在桌面和移动设备上的赢家。

    Brightland手机登陆页面的截图
    同一登陆页面的移动版本略有不同,以优化简单性和不同的用户行为。Brightland

    为了在移动体验中看到一个购买按钮,客户必须向下滚动到产品描述部分,这鼓励他们阅读更多。其他的成功还包括健康益处栏目(谁知道橄榄油有这么多?),让味蕾兴奋的实物,产品差异化(由磨坊主制作的冷榨橄榄),每种产品的定制食谱,以及来自真实客户的好评。

    Olipop

    Olipop销售含有植物成分和益生元的更健康的苏打水,以支持健康的微生物群。它的登录页面设计明亮、有趣、干净、简单——都是Olipop视觉品牌标识的租户。

    Olipop使用利益驱动复制来直接处理异议(“但是苏打水有多少糖?”)而且将这种饮料定位为渴望戒掉苏打水的狂热饮酒者的一种治疗方法。

    Olipop产品登陆页面设计的截图
    Olipop

    登录页,比如的取样器如上图所示,都采用了该品牌在其产品上使用的同样明亮的颜色和时髦干净的设计。其他突出的元素包括:清晰、粗体的文字、深入的产品信息(滚动后)、带有实际评论的星号可信度、不占页面主导地位的小标题、直观、易于导航的布局以及出色的产品照片。

    节奏

    节奏出售磁性和防水的可填充旅行容器。

    它的登录页面设计简单、清晰,并将产品的好处放在前面。Cadence还包括一个自夸吧,上面有以下每家商店的语录,在顾客深入了解之前,可以快速获得社会证明。

    Cadence产品登陆页面设计的截图
    Cadence在Instagram上向该页面发送付费广告流量,其中包括产品照片和社会证明。节奏

    由于该品牌提供了这样的视觉产品,登陆页面上的图片和视频比文案更多。通过这样一个简单的视觉描述设计,Cadence很快就给人留下了深刻的印象。

    Cadence产品登陆页面设计的截图
    节奏

    产品登陆页的设计就像胶囊(上图)展示了该产品的工作原理。复制说明了可持续性和其他产品的好处,比如防漏密封和可定制的胶囊。

    移动体验的特点很少,客户必须向下滚动,以建立一个可定制的包或查看进一步的产品信息。

    使用你的登录页来创建一个叙述

    在开发不同的设计块时,请记住,每个设计块都是更大的着陆页故事的一部分。如果你不理解一本书的章节与整个故事的关系,你就不会去读它。你网站上的每一个登陆页都是一样的:你带着购物者走过你的产品之旅,而你希望流程反映这一点

    当您在登录页上构建每个元素时,在将它们拼接在一起时检查它们的内聚性。页面的流程是否感觉像是一个完整的叙述,讲述了您的产品的故事?还是元素感觉是脱节的?这最后的检查将允许你移动块或调整拷贝在你进入一个页面之前。