讲解网页的首屏标准你了解多少？

首屏的英文是above the fold，fold有折叠之意，above the fold是指在折叠之后能看到的，为什么首屏的英文翻译会跟折叠有关系呢，原因很简单，因为这个概念最早用于出版领域，可以简单的理解为“头版”因为报纸的运输和分发过程是折叠起来的，所以报纸的折叠后暴露在读者面前的那一部分内容就显得尤其重要，读者会根据头版的内容决定是否购买。

因此处于头版的内容意味着一个，编辑认为它们是最重要的，头版的内容也决定了出版物的立场和定位。所以“above the fold”也用来表示所有优先显示或或优先级最高的内容。

“above the fold(头版)”的概念延伸到互联网领域。用来指代web网页中不用滚动屏幕看到的信息。

与出版业的“头版”不同的是互联网的首屏区域是动态的，由于互联网用户复杂的屏幕分辨率环境，导致他们看到的首屏内容有很大差距。

很多店铺设计就是因为对首屏的忽视导致很严重的体验问题。

天猫&淘宝的首屏

那么我们店铺的买家看到的首屏是什么样的呢?

首先看以下天猫和淘宝的买家用户的屏幕分辨率占比情况：

下图是最近的淘宝网用户屏幕分辨率占比情况的分布图。

其中屏幕高度在768以内的用户有41.57%，18.78%(1024X768)+2.91%(1280X768)+19.88%(1366X768)>41.57%

这就是你为什么一定要关注首屏。我们的设计师们都用上20寸以上的大屏幕的时候41%的用户还在用768的显示设备

典型问题

以下案例均以用户浏览器分辨率占比最高的768像素为例

首屏差异性

店铺类目结果列表的差异

点击店铺左侧类目，首屏内容没有任何变化，天猫和淘宝的店铺普遍存在这个问题，如下图：

这种问题导致用户误以为自己的点击没有产生预期的页面跳转，自己还停留在原始页面。多次尝试都没有效果之后，最终跳失是很正常的。