很久之前我在 Hotjar 上启动了一个实验,分析了访问者(也就是客户)在产品主页上的行为。
 
我知道,“首屏”部分对于 CR 优化很重要,但没想到它是转换优化中最重要的部分(到目前为止)。
 
在 Hotjar ,我们有一项功能可以查看人们滚动页面的时长。
 
有了这个功能,我发现了让我大吃一惊的事实:
 
——56% 的访问者甚至没有滚动鼠标就离开了页面。
 
典型电子商务产品页面的滚动数据通常如下所示:
 
 
这意味着,如果我们想提高CR,我们就要把注意力集中在访问者在前 10 秒内看到的内容上。
 
如果我们能让人们对产品感兴趣并滚动页面,我们就完成了 50% 的工作。
 

如何改进产品页面的“首屏”部分

 
1.“首屏”部分应包含有关产品和产品提案的所有最重要的信息。
 
  • 产品名称/标题+图片(即,产品是什么)

 
  • 产品的好处(人们如何从这个产品受益?)

 
  • CTA(人们如何购买这个产品?)

 
  • 产品的保障/运输(人们的购买是否安全?)

 
  • 折扣——如果有折扣,一定要标注出来(营造紧迫性)

 
你可能已经知道我们上面说的这几点,但你可能不知道的是,视觉层次结构非常重要。
 
在构建页面时,我们需要考虑图片大小、空间布局、字体大小、颜色和对比度。
 
下面这张图说明了一切:
 

 
我们要确保网站访问者在尽可能短的时间内,以正确的顺序(按重要性排序)查看所有最重要的信息。
 

正确顺序(根据产品的不同而有所变化)

 
·        产品名称/标题
·        产品图片
·        CTA +退货保障/发货
·        产品优势
·        质保/其他徽章
 
以下是来自Skinnyfit的一个很好的例子:
 
它使用了很好的视觉层次,不到5秒就能让人迷上这个产品。
 
不到5秒,浏览页面的人就可以知道:
 
-这个产品和它的功能是什么(" Super youth " =它让我们更健康、更年轻)
 
-它看起来怎么样
 
-它的好处是什么
 
-怎么买+购买保障是什么
 

 
现在,想象一下这个产品的首屏如果是这样的:


虽然第二张图片也包含了所有完全相同的信息,但是呈现得非常糟糕——它没有遵循任何视觉层次的原则。
 
我可以保证,第一个版本的表现要比第二个至少好两倍。
 
这就是框架效应。
 

7个提高“首屏”表现的建议:

 
1. 使用一个引人注目的标题,并使用通用的产品名称作为副标题
 


 
2.  用标题和特殊的标志突出我们的产品保证
 

3.  不要让产品描述非常显眼——它是次要元素。
 


4.  改变背景颜色——色彩对比更有可能使人产生兴趣。

 

5. 在列出产品好处时,使用彩色的点或文字,让它从其他内容中脱颖而出。

 

 
  1. 6. 添加一个小的好评。这将增加一些社会证明,使人们更感兴趣。

 


  1. 7. 使用明确的CTA,促使人们采取行动——例如,“Buy it now” “grab mine now” “Buy now” “Select a size”等等

 

关键点总结

 
  • 我们要把精力集中在“首屏”部分。超过50%的访问者甚至没有滚动屏幕就离开了

 
  • “首屏”元素之间要建立一个良好的视觉层次结构,可以让人们更快地浏览到产品及其优点。

 
  • 快速浏览=较少的购买阻碍

 
  • 减少购买阻碍=减少劝退的可能性

 
  • 更少的退出页面=更高的转换率



点赞(8) 打赏

评论列表 共有 0 条评论

暂无评论

服务号

订阅号

备注【拉群】

商务洽谈

微信联系站长

发表
评论
立即
投稿
返回
顶部