我们重点介绍了 Microsoft Clarity,它是一款由真正了解像 Switas 这样的公司所面临挑战的产品开发人员,以实际应用场景为导向打造的产品。诸如“愤怒点击”和 JavaScript 错误跟踪等功能,在识别用户痛点和技术问题方面发挥了至关重要的作用,从而能够进行有针对性的改进,直接提升用户体验和转化率。
热图是一种网页用户行为的可视化呈现方式,它使用颜色渐变,通常从冷色调(例如蓝色,代表低活跃度)到暖色调(例如红色,代表高活跃度),直接在网页的单张图像上叠加显示用户在多个会话中的点击、光标移动或滚动位置。最常见的三种类型是点击热图和滚动热图。点击热图显示用户点击或轻触的位置,无论该位置是否为实际可点击元素;移动热图跟踪光标移动,以此粗略反映桌面设备上用户的视觉注意力;滚动热图显示用户向下滚动到页面底部时,到达页面各个垂直区域的百分比。第四种不太常见的类型是注意力热图或悬停热图,有时会在移动设备上单独列出,因为在移动设备上,点击和滚动事件完全取代了光标移动,成为主要的行为信号。
热图之所以重要,是因为它们能将抽象的行为数据转化为直观的视觉形式,让设计师、营销人员和利益相关者无需深入了解原始分析表格或事件报告即可立即理解。例如,一张滚动热图显示,只有 20% 的访客会访问位于长页面底部附近的定价部分,这种形式比隐藏在电子表格中的同等数值滚动深度报告更能清晰有效地传达可操作的问题。这种视觉上的易用性正是热图在转化率优化 (CRO) 和用户体验 (UX) 工作中被广泛应用于利益相关者演示和客户报告的主要原因。
热图由 Hotjar、Microsoft Clarity 或 Crazy Egg 等工具生成。这些工具会注入一个轻量级的跟踪脚本,记录用户访问会话期间的光标和触摸坐标以及滚动位置,然后在积累到足够的样本量后(通常每个页面至少需要 1,000 到 3,000 个会话才能形成相对稳定且具有代表性的模式,因为流量较低的页面可能会因少量异常会话而导致热图出现偏差),将这些原始数据聚合到可视化叠加层中。分析师通常会按设备类型和流量来源对热图进行细分。移动设备上的点击和滚动模式与桌面设备截然不同,因为来自不同渠道的访问者往往具有不同的意图,即使在完全相同的页面和布局下,他们的行为也会有所不同。
人们常常误以为热图显示的是用户的视线落点,但实际上,移动热图仅追踪光标位置,虽然这与桌面端的视觉注意力相关,但并不完全吻合,因为用户在阅读时经常会将光标保持在屏幕的某个位置,而视线却会落在屏幕的其他区域;真正的视线追踪需要专用的眼动追踪硬件,而这种硬件在商业转化率优化(CRO)工作中的应用远不如基于软件的热图普遍,后者仅仅依赖于光标和触摸数据。另一个常见的误区是,在没有结合点击目标和页面结构进行交叉比对的情况下,仅凭热图就得出确切的结论。例如,将用户频繁点击非交互式图像的行为误解为积极的互动,而实际上这可能表明用户对该图像是否可点击感到困惑。
In CRO 在用户体验咨询中,热图通常用于审核初期,以生成关于摩擦或困惑可能出现位置的假设。例如,识别用户反复点击静态横幅图片,期望它链接到某个页面;或者滚动热图显示关键行动号召按钮的位置远低于大多数访客实际停止滚动的位置。由于热图是描述性的而非因果性的,也就是说,它们只显示发生了什么,而无法明确解释其原因,因此几乎总是会结合会话录制来获取更深入的定性背景信息,并随后进行受控的 A/B 测试,以确认提出的解决方案是否真正改善了预期指标。在设计更改后刷新热图也可以作为一种快速、低成本的有效性检查,以确保新布局的使用符合预期,而无需等待完整的实验达到统计显著性。
我们重点介绍了 Microsoft Clarity,它是一款由真正了解像 Switas 这样的公司所面临挑战的产品开发人员,以实际应用场景为导向打造的产品。诸如“愤怒点击”和 JavaScript 错误跟踪等功能,在识别用户痛点和技术问题方面发挥了至关重要的作用,从而能够进行有针对性的改进,直接提升用户体验和转化率。