网页首屏设计

1.什么是首屏？

 ”首屏”就是指网页视图呈现给访客的第一屏幕，在不需要滚动条的前提下可观看的浏览面积。

2.为什么需要注意”首屏”设计

设计的效果需要媒介来支撑，杂志的设计需要考虑纸张的大小，修订及读者的阅读习惯。而网页设计同样需要媒介:显示器.

显示器的大小直接关系到访客的阅读体验，访客大都数在一个陌生网页停留的时间不会太长，如果短时间内没有能够将文案想表达的重要内容第一时间呈现出来，那么就很有可能重要内容被忽略，效果也就大打折扣。

3.第一屏的设计标准是什么？

下图为2011年度 Internet 用户屏幕分辨率实时统计报告：

一般情况下我们以占有比率最多的显示器分辨率为参考，原则上向下兼容，高度在768像素。
在768像素的高度基础上，还需要减去浏览器的界面高度和系统任务管理器的高度。

下图以界面所占最大的火狐浏览器和win7的任务管理器为例：

图中可看出，第一屏的大众高度差不多是572PX*,*我们在制作专题或邮件的时候，以572px为参考，尽量把重要内容放到572px高度以内。

4.案例
下面为具体的案例：
图一为不考虑”第一屏”的设计稿： 

以1280*800的笔记本为标准，网页所呈现给访客的真实情况为：

从图中可知，banner下面的文本内容包括我们希望访客点击的链接没能够在第一屏中显示，访客不清楚下面还有内容，就很有可能直接忽略了。

下图是修改后的文稿：

再以1280*800的笔记本为标准，网页所呈现给访客的真实情况为：

网页虽然没有能够在显示器中完全显示，但溢流的文本链接呈现在第一屏上，起到了提示作用，访客自然就会知道下面还有更多内容。

在大家所熟悉的大型网站首页，第一屏的高度不需要考虑太多，基本上内容都很紧密，重要内容第一屏优先即可。但像专题、批量邮件这种内容不多又陌生的页面时，第一屏的框架就需要特别注意，因为这直接关系着页面宣传的实际效果。

当我们在完成一个设计工作时，花点时间从用户的角度想想，会有意想不到的收获。