网易门户163.com 改版了！胆很肥！

正文

请到「今天看啥」查看全文

预测用户的视线将会占有极大的优势。在布局你的页面元素时前，你就可以知道优先的该摆放在什么位置。一旦你知道你想要用户先看到什么，你就能可以通过视线的规律，将你的重点内容放在用户的“热点”里。

你可以在整个页面不断重复Z模式的规律，就像你在下图中看到的那样，一开始这个页面就有一个注册按钮，通过水平位置的浏览，用户已经获悉了这一信 息，下拉会出现产品的卖点，这些卖点的展示就是遵循重复着Z模式的最佳例子，直到最下方的支付选项就抵达了Z模式的最尾部那个水平线。

网页设计中的F式布局

传统的布局方式，依赖布置视觉线索，“控制”用户的视觉路径，相较之下，F式布局更加自然，更加友好。

F式布局简介

F式布局是一种很科学的布局方法，基本原理依据了大量的眼动研究。一般来说，用户浏览网页的视觉轨迹是这样的——先看看顶部，然后看看左上角，然后沿着左边缘顺势直下….而用户往往不太注意右边的信息，这是不是有点像字母F?据此，我们习惯性的把重要元素（诸如品牌Logo，导航，行为召唤控件）放在左边，而右边一般放置一些对用户无关紧要的广告信息。

我们来看一下Webdesigntuts+的眼动热点图：

这张眼动热点图展示了用户浏览此网站的视觉轨迹，呈一个F型。热区（途中红色、黄色、橙色部分）代表用户注意力最集中的地方。
总结一下用户浏览网页的一般模式：

先看看页面的左上角，了解一下这是什么网站（因此此处适合放置Logo)——“知道是什么”
然后扫描一下页面的顶部（导航栏，搜索栏）——“了解用法”
下一步，用户的视线下移，开始阅读下一行的内容。
用户进入“扫描模式”，一旦找到感兴趣的内容便会打开。

请到「今天看啥」查看全文