Nielsen Norman Group 的研究发现,用户在首屏(above the fold)花费的页面浏览时间占 57%,且注意力在第一屏之后会急剧下降。对于落地页而言,这一数据更为极端——访客会在 2-3 秒内决定是留下还是离开。
这意味着,首屏设计几乎是你留住访客的唯一机会。
眼动追踪研究揭示了什么
由 Djamasbi et al. (2010) 进行的眼动追踪研究识别了首屏中吸引注意力的关键元素:
| 元素 | 平均注视时间 | 首次注视比例 |
|---|---|---|
| 主视觉图 / 视觉元素 | 1.2s | 67% 的人首先看这里 |
| 主标题 | 0.8s | 22% 的人首先看这里 |
| CTA 按钮 | 0.4s | 3% 的人首先看这里 |
| 导航栏 | 0.3s | 8% 的人首先看这里 |
主视觉图吸引了最多的注意力,但转化发生在 CTA 处。挑战在于如何设计一条从主视觉 → 标题 → CTA 的视觉路径。
高转化率首屏的 5 个要素
1. 激发欲望的主视觉图
主视觉图应该展示结果,而非产品本身。Adaval & Wyer (1998) 的研究表明,描绘最终状态(如客户愉快地使用产品)的图像所产生的购买意愿是仅展示产品图片的 2 倍。
2. 作为唯一价值承诺的标题
根据 Copyhackers 的转化文案研究,与访客内心对话相契合的标题,其表现优于通用价值主张 3-5 倍。标题应该能补全这句话:“我需要一个能……”
3. 引导视觉的视觉层级
Faraday (2000) 对网页设计视觉层级的研究表明,大小、对比度和位置共同构成了可以被测量和优化的“阅读顺序”。视觉流向应该是:视觉锚点 → 问题/解决方案 → CTA。
4. 具有最大对比度的 CTA
Ling & van Schaik (2006) 发现,无论使用何种颜色,与背景对比度最高的 CTA 按钮点击率会提高 21%。重点在于对比度,而非颜色本身。
5. 首屏的社交证明
如 Klucharev et al. (2009) 所示,在首屏放置信任信号(客户数量、评分、Logo 栏)可以降低前额叶皮层的风险评估。一句简单的“深受 10,000+ 营销人员信赖”就能将转化率提高 15-20%。
测试你的落地页
将你的落地页 URL 粘贴到 FlowDx 中,即可查看访客视线的确切去向。注意力热力图将揭示你的 CTA 是处于“热区”,还是淹没在了杂讯中。
参考文献
- Nielsen Norman Group. Scrolling and Attention.
- Djamasbi, S. et al. (2010). Generation Y, web design, and eye tracking. Int. Journal of Human-Computer Studies.
- Klucharev, V. et al. (2009). Reinforcement learning signal predicts social conformity. Neuron.