使用热图了解访问者在您的网站上所做的事情

人类天生好奇。 在许多方面，好奇心是使我们进化最多的特征之一。 信息就是力量，拥有关于他人的信息在许多不同领域都非常有用，包括网页开发。

在不进入隐私世界的黑暗面的情况下，有很多方法可以管理网页并以合乎道德的方式利用好奇心来提高其性能并让您的访问者比以前更喜欢您的网页。

热图是一种旨在发现访问者在网页上所做的事情并了解他们如何与之交互的技术。 也就是说，热图允许我们以聚合和匿名的方式分析访问者的行为。 通过分析光标在网页上的移动，热图是一种视觉表示，它显示了用暖色绘制的页面热点。

更重要的是，热图使我们能够获得改进的想法以应用于我们的网站。 我们只需要研究我们在热图中看到的数据，就可以得出关于正在发生的事情、访问者在做什么、网络上出了什么问题以及我们如何解决问题的结论。

如何在 WordPress 中创建热图

如今，创建热图非常简单。 在 WordPress 中，我们只需要使用允许我们创建热图的插件。 事实上，热图是我们的 Nelio A/B 测试用户最需要的功能之一。

我们长期以来一直在创建热图，以继续研究我们网站上可能的改进。 例如，我将在这里向您展示我们在 Nelio 主页上创建的最新热图。

首先是创建一个新的热图。 为此，我们选择 Nelio A/B 测试中的新测试并选择我们感兴趣的页面，如以下屏幕截图所示：

然后，我们只需要开始测试，以便插件跟踪您的访问者并自动汇总信息。 从这一刻起，将逐步生成新的热图，我们将能够以图形方式查看结果。

热图结果

一旦我们跟踪了具有代表性的访问者数量，我们就可以详细观察热图的结果。 请记住，从我们的访问者那里提取的这些数据有不同的看法。

最常见的可视化类型是热图本身，它显示了在分析页面顶部显示的一系列暖色点。 这些热点被放置在互动最多的元素上。

另一方面，我们有滚动图，它以较暖的颜色显示访问者在离开前向下滚动页面的距离。

最后，我们通常可以找到的最后一种表示是将页面上的点击视为一团点或五彩纸屑。

在之前的图库中，您可以看到我们的插件在分析我们网站的主页时创建的完整热图、滚动图和 cofetti。 接下来，让我们仔细看看我们可以从所有这三种表示中提取的信息的一些细节。

热图详细信息

热图显示访问我们主页的人的大部分活动都发生在页面的第一部分。 我们发现按钮上有很多交互，这些按钮将我们带到每个插件的特定页面，这是我们想要发生的事情：

但我们也发现很多人点击了第一折中的箭头标志，表示他们向下滚动。 不幸的是，这个箭头只是一个指示器，并不是一个可点击的元素。 所以它肯定会让我们的观众感到困惑，他们仍然点击它。

作为一种解决方案，我们可以选择将箭头转换为自动向下滚动页面的按钮。 通过这样做，我们使用户期望与现实保持一致。

另一方面，很好奇页脚如何也受到很多关注。 这很重要，因为它表明一些用户直到页面最后才找到他们正在寻找的内容。 特别是，最热门的领域是联系链接。 因此，一个好的测试想法是将此链接移动到页面更显眼的区域，以确保没有人在没有找到他们需要的东西的情况下离开。

滚动图详细信息

滚动图显示我们的大多数访问者看不到任何超过半页的内容。 有了这些信息，我们可以得出的主要结论是，从那时起的内容将被遗漏，因此，它不应该是相关的。

为了使我们的内容对我们的观众更具吸引力，从而防止他们离开，一种可能性是展示更具视觉性和动态性的部分。 静态内容不够突出，我们失去了访问者的注意力。 出于这个原因，在这些部分中提出更改可能是在未来的 A/B 测试中进行测试的一个很好的可能性。

五彩纸屑细节

至于五彩纸屑，它显示了我们在测试运行时收到的所有点击的点云。 与常规热图相比，五彩纸屑包含有关每次点击的更多信息。

我们看到大多数点击的访问者是如何在 5 到 10 秒之间完成的。 知道这些数据是非常有趣的，因为我们有一个相当近似的时间来衡量我们必须引起他们的注意。

页面越复杂，似乎越难以理解，我们就会失去更多的访问者。 这些信息可以帮助我们提出一个更简单、更激进的页面版本。 例如，我们可以显示更少的信息并直奔主题。 这是我们接下来可以尝试的另一个可能的 A/B 测试。

此外，我们可以看到有访问者点击了不可点击的元素。 这里一个特别相关的部分是使用我们产品的公司的徽标列表，或我们客户的推荐：

在这些部分中，我们没有可点击的元素，但它们仍然可以点击。 同样，这可能会造成混淆，因此确保我们网站的行为符合访问者的期望非常重要。 为避免这种情况，我们可以决定修改这些部分的设计，以使您不必单击那里更清楚。 甚至删除部分，考虑到滚动图中的信息，我们已经看到我们在这部分网络中失去了人。

关于热图的重要一点是通过分析我们的访问者如何与我们的网站互动来获得改进的想法。 通过这种方式，我们可以纠正失败的行为，并对我们的页面提出可能的改进建议，然后我们可以通过 A/B 测试进行测试。

让我提醒您，Nelio A/B 测试的免费版本允许您在 WordPress 页面上创建热图，就像我在这里解释的那样简单。 继续尝试。 然后让我们知道您的体验以及您可以通过访问者行为的这种可视化表示提取哪些信息。

由 Almos Bechtold 在 Unsplash 上拍摄的特色图片。