首屏(above the fold)是指不滚动web网页屏幕就能被用户看到的画面。
世界著名的网页易用性专家尼尔森以前有报告显示，首屏以上的关注度为80.3%。首屏下面的关注度仅有19.7%。这两个数据足以表明，首屏对每个须要转化率的站点都非常重要。尤其是电商站点。
在电子商务站点中，用户最急切须要获得的不外乎两点：吸引人的商品或店铺，以及站点可以给予他的信任感。信任须要积累。因此，各类宣传推广信息就成了电商首屏展示的不二之选。
一个能引人驻足停留的首屏一定会为站点带来很多其它的客户和利益，会告诉你怎样策划设计出一个好看好用的电商首屏。
1.确定可视范围
依据统计报告显示，2014年使用率最高的Internet用户屏幕分辨率为1366px*768px。
以此为例。浏览器边框宽度普遍在21左右。所以网页首屏宽度在无干扰因素的情况下能够确定为1345;而屏幕总高度为768。除去任务栏高度40、店铺页头106、浏览器(工具栏、边框等)160和位置工具栏30，初步估算首屏高度控制在432较为合适。因此我们能够得出，最符合时下趋势的首屏设计宽高基本范围是1345*432。重要的内容能够尽量放在这个区间里。
2.展示吸引用户的信息
首页的首屏位置在整个站点中都称得上寸土寸金。正由于如此。此处展示的文字应该短小精悍，尽可能用最少的篇幅就把信息表达清晰。
标题性文字更应该把商家的商业诉求清晰直接的表达出来。在这类文字的策划上需注意符合站点的总体风格。
一号店的banner文案就能非常好的抓住浏览者的眼球，有趣的标题文字加上“0元领”这种醒目的字眼，让用户充满了好奇心。
Gap的首屏尽管没有将广告的下半部分非常完整的展现出来，可是这似乎并没有影响到用户想要继续点击的心情，真正吸引用户的信息点都被整齐的陈列在首屏中，供用户逐一了解。
3.视觉焦点要显眼
大多数用户的浏览习惯是走马观花式的，以现在国内电商站点普遍的布局来看，用户在第一屏中的视觉焦点基本上以Banner和导航为主。因此，当中所表现的不管是文字还是大图，都应该让用户一眼看清内容，降低其思考时间。设计师在设计时能够用“去色”的方法来检验实际效果。
去色前：
去色后：
易迅首屏算是个反面教材。首屏原图会令人认为太过繁复，所以视觉焦点自然会分散开来。
通过去色前后的对照图我们能够发现，去色后，导航上的文字内容会变得不够清晰，因此我们能够得出，色彩是锁定用户视觉焦点的主要问题。
去色前：
去色后：
唯品会首屏去色后的效果就截然不同了。
去色后，Banner上的内容仍然能够非常easy的辨认出来，文字和背景都非常清晰。
4.图片让内容更利于理解
要让用户在短短的几秒钟之内就了解站点或商家公布的一系列信息，单凭简短的文字是不够的，还需借力于图片的帮助。图片的使用能从側面含蓄的衬托主题。因此，在图片素材的选择上应该保证对主旨的表达有帮助。而且在视觉上保持风格一致。
凡客诚品的首屏走的是极简路线，没有什么修饰，让用户能够专注于商品本身。
配图没有把商品全貌都展现出来，但在极简的风格下，也能增强用户的点击欲。
5.用风格强调主题
站点首屏的风格是依据目的来决定的，在设计之前，必需要了解这个首屏到底在整个站点中会起到什么样的作用。一般来说，电子商务站点的首页首屏会用来进行推广宣传，比方单品推广、店铺推广和活动宣传等。
单品：
以单品推广作为主题的首屏通常会用卖点组成文案。再配上简单的图片。
店铺：
店铺的推广事实上并不须要用非常大的篇幅来详细说明，仅仅要将一些用户在意的关键点表现出来就可以，比如优惠信息。活动形式范围等。
活动：
一项活动的宣传非常难用简单的文案在首屏中描写叙述清楚，所以要尽量用有冲击力的字词来吸引用户点击到详情页。
6.锁定用户的视觉重点
当用户对站点还不太熟悉的时候。进入首页必定会一头雾水，此时，给予用户视觉上的引导变得格外重要。引导的方法多种多样，比方醒目的大字或图片。吸引人的标题、或是条理清晰总体布局等。所谓引导，并不仅仅是代表让顾客购买商品，更意味着让用户点击进入其它页面，产生很多其它的消费。
非常少有电商站点的首屏像好乐买一样干净整洁、分类明白。清晰的布局让用户一眼就能找到自己的需求。
7.动画吸引用户视线
在站点用户体验比較流畅的基础上，在首屏中能够适当的添加一些鼠标互动效果，或是Flash动画效果会让页面看起来更加生动有趣，这样的做法也能添加一定数量的点击，而且吸引用户的注意力。
但这些效果仅仅能作为点缀，大面积的使用反而会适得其反。
淘宝网在右上角有一个小小的鼠标交互效果，点击后进入的是一个活动专区。翻页效果在心理学上被觉得更easy触发用户想要点击的冲动。
8.符合视觉习惯的图文混排
大片单一的文字或图片会让用户产生厌倦感。而图文混排非常好的弥补了这一点。
图文混排的方式有非常多，比方色彩上的对照、文字或图片的放大等等，在布局上尽量做到错落有致，让用户的视线顺畅的转移。
不管用哪一种形式。都必须确保的是主要内容的可读性。
一淘网的首屏不太符合大多数人的使用习惯。
当用户进入一个电商站点。首先一定会被图片吸引，非常少有人会愿意逐字逐句的看完大段文字，所以具体的描写叙述并不适合放在首屏的位置。
聚美优品首屏的图文搭配恰如其分。简单的大图和一些短句，两者之间相辅相成。图片便于用户理解，文字非常精简，重点分明。
总结：
首屏是吸引用户至关重要的通道。非常多站点由于对首屏的忽视。从而产生了一些用户体验上的问题。电商站点相比較普通的官方站点在性质上更特殊一些。电商首屏应该带着商家的目的性去迎合用户的常规使用习惯，而不是漫无目的地把首屏变成布告栏。
设计师在做一个设计项目之前，最好还是多从用户的角度思考，或许会有意想不到的收获。