网站转化率提升与用户体验优化的13个方法

不论你是网站的设计者还是运营者，目标转化率都是衡量网站成败最关键的指标。在如何提高转化这一问题上，最近总结一些能帮助我们洞察用户行为下更深层次的原因的方法。

热图可分为点击热图、注意力热图和浏览触达率热图。

点击热图展示了用户在页面上的点击位置，点击越集中的地方，色调越暖（红色），反之则色调越冷（蓝色）。它也提供用户在每个区域的具体点击数和占比，根据它你很容易找出那些高频次点击的区域，了解到用户点击了哪些被你忽略的地方，用更精确的方式验证你的模块和内容是否放置在恰当的地方。

注意力热图则是根据用户实际浏览页面各部分的时长，显示用户在某个内容板块的注意力程度，浏览时间越久的区域热度越高（红色）。你可以通过注意力热图了解到网页哪些内容吸引用户，哪些内容你认为重要而用户却不感冒，最佳的页面长度是多少，以及哪些元素促使用户继续和你的网站产生交互或再次访问。

浏览触达率热图使用水平线把页面分割成不同的区域，通过监测用户浏览页面时鼠标滚动的情况，显示用户触达到页面某区域的占比。利用它你可以优化关键内容的摆放位置，把用户关注度高或者重点宣传的产品和信息放在触达率更高的区域。

现在，让我们看看使用热图发现的13个有意思的结论。

1.关键内容必须首屏显示

虽然用户在浏览过程中会滚动页面，但当他们下拉到首屏以下的区域时，浏览时间会大幅度减少。

通过对热图分析工具分析大量客户的首页热图进行总结，我们发现：访客的浏览时间有80%左右都花在了首屏，其余页面只占20%。因此，对于目标转化率最重要的内容，务必放在首屏显示。

在首屏以下，用户的注意力也会随之降低。内容离标题越远，用户的关注和阅读就会越少。因此，一定要把最关键的内容放在页面顶部。如果你确实要做一个很长的页面，设计一些引导元素，提醒并鼓励用户向下滚动。

这项研究里，我们同时发现：在网页的最底部，用户的浏览时间会有小幅增加，他们的注意力也会再次上升。因此，在页面末尾放置召唤按钮（Call-to-action：页面上醒目突出的按钮，用于“召唤”用户点击这个按钮，比如“立即注册”）或相关链接也可以有效提高目标转化率。

最后，你还应该知道“近因效应”——人在了解事物的过程中，最近最新的印象会占据主导地位。因此，多花点时间和心思，好好设计你的页面末尾吧。

2.匆忙决策时，用户看到什么就会选择什么

加州理工的神经科学研究发现：人在快速决策的时候，更加注重视觉感受而不是个人喜好。这意味着用户在匆忙访问你的网站时，会更少地考虑个人偏好，并倾向于根据看到的内容做出选择。当他心不在焉或者没有太强烈的偏好时，这种倾向会更加的明显。

这项研究为营销人员提供了一个全新的思路，而且具有很大的市场潜力。在一些时间匆忙或者容易分心的环境下（例如电商购物），既然产品的视觉冲击可以超越消费者的个人偏好，那么在页面设计上做一些优化，就有可能对用户的选择产生巨大的影响。

这是美国一家美食网站使用Ptengine点击热图和浏览触达率热图得到的首页效果图。图中被选中的部分虽然只有37%的用户浏览到这个区域看到了它们，但这部分商品依然聚集了非常大的点击。毫无疑问，这就是我们所说的有很大视觉冲击，能让用户产生购买欲望的商品。你需要将这些商品的位置上移，让更多的用户一进网站就能立刻看到，这样会大幅提升页面转化率和网站的收益。

去优化你的网站设计吧，让你的用户在第一时间看到他们想买的和你想卖的。

3.用户更关注页面左侧

 

许多研究都表明，用户更加关注页面的左侧。在普遍的浏览习惯里，人们也会先从左边开始阅读。因此，务必把你最关键的信息放置在页面左侧。

研究也发现：用户浏览网页左侧的时间占据了总浏览时间的69%，是右侧浏览时间的两倍还要多。

4.用户习惯以“F”形状的观测模式浏览网页

 

这项研究发现：用户倾向于以“F”形状的观测模式浏览文字型网页，把主要的注意力放在文章的开始。他们仔细阅读最重要的标题和副标题，选择性地阅读篇幅较大的正文。你的前两个段落是用户最有可能阅读的，务必在这里说明最重要的信息。

你应该多使用副标题，符号和段落，让你的文章层次分明。当你把重要信息用符号标出时，那些跳跃性阅读的用户才更有可能注意到。

需要注意的是，当浏览那些由图片构成的网页时，“F”型的观测模式便不再成立。此时，人们更倾向于以水平方式来浏览基于图像的页面。

5.别在网页头屏的大Banner上浪费精力

 

用户已经会习惯性地忽略网页头屏的大Banner，因为它看起来太像广告了。现在用户每天会被成千上万的广告轰炸，他们会下意识地忽略网站上的广告。任何看起来像广告的文字或图像，用户几乎不会再看一眼。

上图中的某网站热图也表明：大Banner很难有太好的效果。当用户把banner当做广告时，它们就再也无法吸引注意力了。因为用户需要快速搜索信息时，他们会忽略广告；而用户全神贯注地阅读一段内容时，他们就更不可能关注广告了。

你需要及时发现并调整这些低效的Banner，多使用一些热图工具，例如Ptengine的数据监测和热图分析，监测流量在你网站的行为，衡量投入产出（ROI）。

6.图片中人物的视线方向非常重要

 

使用人物在设计中是很重要的，它是一个有利于吸引用户注意力的元素。需要注意的是，图中人物的视线方向非常重要。许多热图研究表明：用户会沿着人物视线的方向去浏览。因此，如果你想让用户多关注人物图片旁边的正文内容，务必让图中的人物看向该内容的方向。

使用情感充沛的人物会对转化率产生积极的影响。热图研究也发现，在设计时使用一张热情的人物照片得到的转化率比冷静的人物照片要高很多。

你最好将这两点结合起来：使用一个情感充沛的人物，同时让他的眼睛看向页面上的关键位置。

7.男人看重视觉体验，女人重视具体信息

 

热图研究发现：男女在查看约会网站上的个人信息时，注意力的重点有明显差异。男人会更关注档案里的照片；女人则倾向于阅读更多的具体信息，她们几乎要花50%的时间看对方的个人简介。

另一项研究发现：在观察对方照片时，男性有37%的时间在看对方胸部，而女性有27%的时间在看对方的无名指。从这两项研究中我们不难看出，男性倾向于追求视觉上的体验，而女性则更注重搜寻有用的信息（即使是在她们查看照片的时候）。

8.放弃图片自动切换和横幅来提高点击率

 

研究发现：当用户带着明确的目的浏览网页时，他们会完全忽略页面上方的大横幅和图片自动切换的动画。这两种形式会被用户误以为是广告而下意识地忽略，同时也会浪费首屏上宝贵的空间，最好不要使用。

上图是使用Ptengine呈现出来的某网站热图，我们可以很直观地看到有大横幅和自动切换的区域点击量都很低。它们占用了首屏几乎一半的空间，效果却非常不理想。你需要使用热图发现这些低效的区域，及时调整网页的设计才能有效提高转化率。

9.使用色彩对比引导用户

 

在使用热图分析了不同页面的用户行为之后，我们发现色彩对比在引导用户方面有着极其重要的作用。那些与周围区域颜色不同的元素总能获取非常高的用户注意力和点击数。只要我们对首页的颜色设计进行一定的调整，就可以轻松将用户的注意力引导至我们想要的区域。

这是某汽车新闻网站使用Ptengine得到的点击热图。在他们将每个模块的“了解更多”按钮设置成深色以后，这四个元素轻而易举获得了非常大的点击量。

不要忽视色彩对比的作用，多使用热图工具监测颜色调整的效果，你会有意想不到的收获。

10.使用照片吸引用户的注意力

 

人都是视觉动物。许多网站在使用图片后，目标转化率都有明显的提高。在网站里使用一些精心挑选的图片，对拉近你和用户之间的距离也非常有帮助。

用户对真实人物的照片反应会更积极。研究发现：在大多数网站上，用户浏览照片的时间要比阅读文字的时间多10%。尽管用户会把大Banner和自动切换的图片当成广告，但他们还是希望在正文中看到真实人物的照片，这会增强他们对网站的信任感。需要注意的是，用户已经学会了辨别照片的真实性，他们会下意识忽略那些艺术照。因此，不要过度编辑和修饰你的照片。

11.多使用文章摘要

 

热图研究发现：在博客首页使用文章摘要跟放置完整文章比较，用户的阅读量会升高很多。如果你的博客主页上放置的都是完整文章，一旦用户对第一篇的内容不太感兴趣，他就可能因此离开你的网站。

如上图所示，前两个示例是在首页上显示完整的文章内容。这种情况下，用户会点击第一篇文章的相关区域，但很少继续阅读其它的文章。中间两个示例是在首页上只显示文章摘要，此时用户会点击到所有的区域，其他文章也会有相对较高的阅读量。最后一个示例是一种混合情况：一些较短的文章完整显示；较长的则被折叠，只显示文章摘要。

使用摘要可以向用户更好地展现文章主题，提供不同的选择也有利于用户找到感兴趣的方面，从而在网站上点击更多的内容阅读并停留更长的时间。

12.用户在你的邮件上只会花不到一分钟的时间

热图研究显示：67%的用户对于邮件里介绍的段落都不太关注，他们会直接跳过，阅读邮件的正文。人们阅读一封邮件的平均时间是51秒，通常只阅读19%的内容。用户习惯一眼扫过，因此确保你的内容足够短，要点突出，并且有一个明确的召唤按钮（Call-to-action：页面上醒目突出的按钮，用于“召唤”用户点击这个按钮，比如“立即注册”）。

13.结合A/B测试和点击热图来提高效率

 

这是一家日本的旅游公司，通过Ptengine的点击热图发现网站首页的流量分布非常集中，大量点击都聚集在导航栏和下方的一个模块。为了更好地引导流量，他们决定根据用户的关注点，在首页展示更多用户感兴趣的内容。新的首页模板设计完成后，他们又使用A/B测试对假设进行验证并不断优化，最终大幅提升了网站首页的转化率。

在网站A/B测试中，你可以通过设置不同的按钮颜色，背景颜色，文案或元素位置来引导同一网页的两个或多个版本之间的流量，以分析每个版本的优劣。有时在点击热图里你会发现，一个小的设计改动能引发用户行为的巨大变化（例如按钮的颜色改变可以带来更高的转化率）。当你将A/B测试与点击热图相结合时，你可以大大提高页面设计的效率。

总结：

现在，许多类型的数据都可以通过创建热图来进行可视化分析。在研究目标转化率的提升时，我们主要关注的是点击热图，注意力热图和浏览触达热图。

我们再回顾一下使用热图得出的重要结论：

1.对目标转化率最重要的内容，务必放在页面顶部。用户在向下滚动页面时，他们的注意力也会随之减弱。

2.用户经常选择他们看见的东西。多使用视觉元素突出页面上的重点内容，某些独特的视觉元素（例如颜色）会抓取大量的用户注意力，这种方法能有效突出你想要销售的产品。

3.及时测试Banner的效果。当页面上的一些元素设计得像广告横幅，用户会习惯性地忽略它们。

4.放弃图片自动切换来提高点击率。当用户有明确的浏览目的时，他们会将图片自动切换的动画当做广告直接忽略。

5.使用照片获取关注并引导用户。用户对于真实人物和产品细节照片的反应会更加积极。你可以通过图中人物的视线方向来引导用户浏览时的注意力。

6.在博客上，首页最好使用文章摘要。使用摘要时，用户的阅读量会有显著提升；而放置全文时，用户很容易因为对内容不感兴趣直接离开页面。

7.结合A/B测试和点击热图来提高效率。两种方式结合使用，可以大幅提升你的页面设计效率。

热图分析工具

尽管我们已经运用热图研究得出了上述13个重要的结论，但如果你想更好地改进自己的网站，最好使用热图工具做一些相应的研究。如果你也有其他的技巧推荐，可以留言和大家一起分享！