所有你应该知道的关于Above The Fold(页面首屏)

Above The Fold(页面首屏)是网页的一部分,无需进一步向下滚动即可看到。首屏内容对于网站所有者向用户提供引人注目的信息是最重要的。

该术语源自报纸的用法,其中重要信息在报纸的前半部分提供。当纸张对折时,可以看到顶部折叠处的信息。这对于一个网页具有相同的字面意义,其内容在顶部而不是向下滚动被称为“首屏”内容。

Above The Fold的重要性

首屏或首屏内容对于在页面上显示内容和广告都有重要用途。

报纸头版

用户体验

用户与首屏内容而不是首屏内容进行更多交互。因此,发布商和网站所有者应考虑将网站的所有业务目标置于对观众清晰可见的首屏之上。业务目标包括放置良好的导航、横幅或文字广告、面包屑、特色图片和文章的良好开端。用户登陆页面时的可见部分应提供更好的用户体验并鼓励他们访问网站上的其他文章。以下是放置在网页折叠区域上方的最常见的项目:

  • 网站标志,以便用户记住品牌
  • 导航菜单可帮助用户移动到网站上最重要的页面
  • 搜索框可快速搜索并从站点获取所需页面
  • 增加在线销售的商店或购物车图标
  • 号召性用语按钮可将流量吸引到特定页面
  • 顶部通知栏显示重要公告
  • 带有重要页面链接的幻灯片
  • 广告创收

Above The Fold广告

除了在折叠区域上方放置广告的用户体验之外,还提高了点击率,从而提高了网站的广告收入。AdSense等PPC程序建议发布商将广告置于首屏以使其可见,并在广告置于首屏区域下方时显示警告消息。

Above The Fold测试

测试顶部的内容在不同设备和浏览器上的外观非常重要。不同的用户可以在不同的浏览器、操作系统和设备上查看网站。因此,网站所有者应测试网站在不同平台上的可见性,以确保更好的用户体验。使用响应式站点布局是在所有设备上调整站点的简单方法之一。

谷歌首屏推荐

谷歌首屏推荐

尤其是在手机等小型设备上,网页应该具有用户可见的可读内容。

Above The Fold问题

由于更加重视可见区域,因此发布商倾向于在此处放置更多广告,而不关注内容广告比例。这会惹恼用户并迫使他们使用广告拦截器拦截广告或离开网站并且不再返回。除了用户之外,搜索引擎还会惩罚在网站顶部显示过多广告且内容非常少的网站。因此,如果您是网站所有者,请确保在折叠区域上方提供适当的内容广告比例。这不仅有助于实现您网站的目标,还可以提高用户的可读性。

如果您是网站所有者,则在折叠区域上方进行优化对于获得良好的页面速度分数很重要。以下是您应该考虑的一些因素以及您将在Google PageSpeed Insights等速度测试工具中看到的警告消息。

警告 解决方案
消除渲染阻塞资源 将JavaScript移动到您网站的页脚部分并异步加载页眉中的脚本。
删除了未使用的 CSS 减少在折叠区域上方转储所有CSS,并考虑使用在折叠内容上方加载所需的关键CSS或内联CSS
删除未使用的JavaScript 减少页眉中的JavaScript文件并将它们移动到页脚区域。
减少第三方代码的影响 在正文内容之后的标题部分中移动Google Analytics、AdSense和任何其他代码。
延迟加载离屏图像 使用延迟加载来延迟加载折叠区域上方不需要的图像。
本文提到: