首页 > 网络营销 > 尼尔森F形状网页浏览模式

尼尔森F形状网页浏览模式

作者：樂思蜀 时间：2008年5月7日

今天，樂思蜀给大家分享一项有点老的、但非常经典的研究。

Jakob Nielsen2006年4月，美国长期研究网站可用性的著名网站设计师杰柯柏·尼尔森（Jakob Nielsen）发表了一项《眼球轨迹的研究》报告（原文：F-Shaped Pattern For Reading Web Content）。

报告中提出，大多数情况下浏览者都不由自主的以“Ｆ”形状的模式阅读网页，这种基本恒定的阅读习惯决定了网页呈现F形的关注热度（见附图）。

F形状网页浏览模式的形成

研究表明，浏览者打开网页后，按照下面的习惯形成F形网页浏览模式：

F形状浏览模式形成

第一步：水平移动

浏览者首先在网页最上部形成一个水平浏览轨迹。

第二步：目光下移，短范围水平移动

浏览者会将目光向下移，扫描比上一步短的区域。

第三步：垂直浏览

浏览者完成上两步后，会将目光沿网页左侧垂直扫描；这一步的浏览速度较慢，也较有系统性、条理性。

附图：F形状网页浏览模式

下面为杰柯柏·尼尔森报告中的3张热度图，用颜色来表示浏览者眼光聚集的热度，分为最热（红色）、较热（黄色）、不热（蓝色）和基本不关注（灰色）4种。其中图3搜索结果页因SERP中网站标题、网页摘要较宽，第二条线会随之加长，但仍然是F形状。

F形状网页浏览模式：一般说明性网页

图1 一般说明性网页

F形状网页浏览模式：电子商务网页

图2 电子商务网页

F形状网页浏览模式：Google搜索结果页

图3 Google搜索结果页

作者: 樂思蜀
原载: 点石互动搜索引擎优化博客

版权声明：仅代表作者个人观点。版权所有，谢绝任何形式的转载。

樂思蜀的其他文章：

网络营销

  1. fzle
    2008年5月7日03:35 | #1
    回复 | 引用

    真的很强悍，我关注的地方和图中基本一样
    不过我从不看，google搜索出来的右边广告 ：）

  2. sofiscal
    2008年5月7日04:02 | #2
    回复 | 引用

    谢谢乐兄分享这么高深的研究^_^

  3. 在线漫画
    2008年5月7日04:32 | #3
    回复 | 引用

    呵呵，有点想根据这个来调整网站内容了！

  4. hfmd
    2008年5月7日07:22 | #4
    回复 | 引用

    沙发,哈哈!
    学习了.

  5. 输入法
    2008年5月7日08:17 | #5
    回复 | 引用

    确实是这样?一般首页位置的第一个有可能是赞助商,做推广的,这种网页不喜欢看?

  6. 特产
    2008年5月7日08:22 | #6
    回复 | 引用

    这种研究是最基础也是最有价值的，希望中国也多一些这样的研究学术报告！

  7. wyw
    2008年5月7日08:38 | #7
    回复 | 引用

    按用户的阅读心理去做网站，会使网民更容易接受，更感觉有亲切感。

  8. blank
    2008年5月7日08:54 | #8
    回复 | 引用

    感觉这和美式的简洁页面关联很大

    中文站,个人认为,"F"的竖位应该在右侧,"3区"在右侧

    老美用刀叉进食,而大陆人用的是筷子

    先天性!

  9. 网络之心
    2008年5月7日09:12 | #9
    回复 | 引用

    老乐，这文章不错。Jakob Nielsen乃用户体验方面的顶级专家。

  10. seok
    2008年5月7日09:15 | #10
    回复 | 引用

    嗯，不错的文章

  11. 北京兼职
    2008年5月7日09:22 | #11
    回复 | 引用

    不错，能够引导网站改变布局并符合用户体验提高流量，不知道广告再什么位置对用户来说是最容易接受的。。

  12. gnaw0725
    2008年5月7日09:23 | #12
    回复 | 引用

    这个理论的确是有够老的，不过我觉得还是有必要说明一下，不然很多人还是不知道这个理论的意义。

    1、不同类型的页面，热点不同。针对不同的页面，无论是自己安排内容或者是做外链，都要注意出现的位置不同，效果不同。

    2、内容关键字靠左上。从站长自己的内容安排来说，页面关键字也是靠页面左上角，越是有优势，特别对百度。

    3、侧边栏内容放置要谨慎，如果站点刚起步，建议左侧边栏最好不要，以内容为先；如果是大站点，可以放置左侧边栏，用以关键字或者频道导航，以架构优先。

  13. 百利来
    2008年5月7日09:27 | #13
    回复 | 引用

    收藏了
    设计网页的时候就要按照F型来设计
    把重要吸引内容放到热度高的地方

  14. moranda
    2008年5月7日09:31 | #14
    回复 | 引用

    想一下，确实是这样！

  15. 冠语国际
    2008年5月7日09:35 | #15
    回复 | 引用

    不错，重新拜读。

  16. 纳米阳光
    2008年5月7日09:40 | #16
    回复 | 引用

    “Ｆ”形状的模式阅读网页事实如此，的确是非常经典的研究，而且是非常值得参考和思考的。

  17. 非官方
    2008年5月7日09:48 | #17
    回复 | 引用

    真帅,点石的文章越来越有魅力了,多发点用户体验及用户行为研究的,爱死你们啦..

  18. jeok
    2008年5月7日09:50 | #18
    回复 | 引用

    很有新意，感觉点石文章的方向在改变。
    支持...

  19. 主流非官方
    2008年5月7日10:01 | #19
    回复 | 引用

    感觉点石的最近几篇文章发的都很棒,回归了SEO及建站的本质,以用户为中心,而不是以SE为中心

  20. dongdonglang
    2008年5月7日10:04 | #20
    回复 | 引用

    网站可用性
    一般是翻译成网站易用性，没有反应过来

  21. 感受北京
    2008年5月7日10:15 | #21
    回复 | 引用

    呵呵，与其吸引眼球，不如主动去找眼球！

  22. DNF
    2008年5月7日10:18 | #22
    回复 | 引用

    图片不错，哈，我现在就是F型的浏览呢

  23. 佳伦网站运营博客
    2008年5月7日10:21 | #23
    回复 | 引用

    好东西，，现在研究用户体验开始成体系了。

  24. Leon
    2008年5月7日10:51 | #24
    回复 | 引用

    不错，我到google广告投放上试试

  25. 重庆bamboo
    2008年5月7日10:57 | #25
    回复 | 引用

    可以开个栏目
    讲讲用户体验

  26. drivewind
    2008年5月7日11:00 | #26
    回复 | 引用

    我感觉中国2，3应该换一下，因为顶部468的广告曾经太普遍了，呵呵

  27. Dickey
    2008年5月7日11:02 | #27
    回复 | 引用

    超经典的实用资料！收藏了！谢谢！

  28. Dickey
    2008年5月7日11:10 | #28
    回复 | 引用

    根据Ｆ形原则，较理想的版式应该是侧边栏放在左边，但绝大多数SEOer都是为了配合蜘蛛而放在右边，其实通过DIV定位设定而显示到左侧应该效果更佳，理论上来讲广告放左边可能点击更高。

  29. 广东seo服务jc
    2008年5月7日11:14 | #29
    回复 | 引用

    恩~好像是这么一回事。
    以后做站的时候，可以参考~！

  30. 風俗
    2008年5月7日11:30 | #30
    回复 | 引用

    好文章,用户体验为中心

  31. 创业中国
    2008年5月7日11:34 | #31
    回复 | 引用

    如果谁持续跟进，做个实验就好了。

  32. mogle
    2008年5月7日12:54 | #32
    回复 | 引用

    这是一篇用户体验分析方面的好文章。
    收藏消化ing....

  33. zerty
    2008年5月7日13:20 | #33
    回复 | 引用

    浏览一张白纸也是这顺序吗？
    看一张不带css的网页又是什么顺序？
    用户的视线如何移动，并不是先天的习惯，而是网页设计师帮你计算好的。美国人真是生活太优越了，有空研究这种东西

  34. auto part supplier
    2008年5月7日13:21 | #34
    回复 | 引用

    经典用户体验设计资料 持续注意

  35. 何苦
    2008年5月7日13:32 | #35
    回复 | 引用

    这种结果，怎么测评的呢？

    应该是类似心理学的实验？

    给百度的serp做一个吧。

  36. 顾维
    2008年5月7日13:44 | #36
    回复 | 引用

    有点深奥，难懂

  37. 三横一
    2008年5月7日13:46 | #37
    回复 | 引用

    貌似可以解释为什么百度google右边栏不受欢迎了

  38. 飞天虎
    2008年5月7日14:15 | #38
    回复 | 引用

    这图片以前看过 呵呵 中国的习惯也许需要修改一下

  39. qlj
    2008年5月7日14:43 | #39
    回复 | 引用

    2天的文章内容详细
    点石越来越有看头了

  40. 千里草
    2008年5月7日14:55 | #40
    回复 | 引用

    我上午哪手机看的时候还一篇回复都没有了，没想到一会就这么多人了啊，郁闷没强沙发啊。
    哪这么说左边和顶部应该是导航性的链接比较合理了吧

  41. Laidz
    2008年5月7日15:36 | #41
    回复 | 引用

    好奇于怎么统计处出来的热图.
    靠鼠标悬停时间?

  42. qq繁体字
    2008年5月7日15:56 | #42
    回复 | 引用

    确实如此，最近怎么都关注搜索用户行为啊？

  43. qioaio
    2008年5月7日17:36 | #43
    回复 | 引用

    这个数据可行吗？不敢说，

  44. 部落格
    2008年5月7日19:01 | #44
    回复 | 引用

    ..说的有点复杂。。。。。

  45. Fly
    2008年5月8日08:16 | #45
    回复 | 引用

    分析很厉害,老外的技术就是比我们强

  46. 中国结
    2008年5月8日10:17 | #46
    回复 | 引用

    虽然很深奥,不过努力理解之中...

  47. 企业SEO
    2008年5月8日11:39 | #47
    回复 | 引用

    真的很强悍，我关注的地方和图中基本一样

  48. 奶瓶QQ空间
    2008年5月8日12:06 | #48
    回复 | 引用

    研究的够高深的啦。把广告放到那个位置也挺不错。红色放主要内容和广告。哈哈

  49. mscga
    2008年5月8日12:14 | #49
    回复 | 引用

    学习了,的确和自己看网页时的分布差不多

  50. 武汉汽车团购
    2008年5月8日13:01 | #50
    回复 | 引用

    点石的东西都很经典
    我很喜欢

  51. rimoyu
    2008年5月8日16:45 | #51
    回复 | 引用

    很有新意，感觉点石文章的方向在改变。
    支持...

  52. ssq3d8
    2008年5月8日16:46 | #52
    回复 | 引用

    呵呵，有点想根据这个来调整网站内容了！

  53. mogle
    2008年5月8日17:12 | #53
    回复 | 引用

    Google搜索结果页的右侧我关注的很少，可能是因为知道右侧是广告，长时间的意识形成了条件反射不想看广告，所以不会关注右侧了。

  54. 星宇SEO
    2008年5月8日21:44 | #54
    回复 | 引用

    看了这个很有启发,兄弟们都发表了自己看法，其中一位叫zerty兄弟说得很有道理，用户的视线如何移动，并不是先天的习惯，而是网页设计师帮你计算好的。我很赞同，可是我认为Jakob Nielsen所说的这个F型浏览模式应该代表着大多数网民的习惯,因为像Jakob Nielsen所提到的这种形式的网站太多了,毕竟会引导网民视觉习惯的设计师太少了不占多数~特别是在中国，更多的是如上图教科书式的网站布局，很难得看到有灵性的设计师！简而言之，用户体验优化才是王道~我觉得Jakob Nielsen想表达的更多是用户体验设计的一个思路~并不是要我们大受启发去做广告投放设计以及关键字优化布局！

  55. 百度hi
    2008年5月9日03:09 | #55
    回复 | 引用

    王通也提出过这个观点。就是说要让网站适合人阅读.所以做站的时候也要注意这个问题.
    比如我上alibaba的时候，我习惯只看中间那部分我关注的内容。

  56. 小小菜鸟
    2008年5月9日08:16 | #56
    回复 | 引用

    最近有点喜欢看老外的东西，他们研究的很深刻，甚至理论性的东西都很有深度。。。。

    转载了呵，不过放心。。保留了原帖地址呵。。。。

  57. 小小菜鸟
    2008年5月9日08:20 | #57
    回复 | 引用

    哎呀，我错了。。。不转了。。。呵呵。。看到声明了。。 ：）

  58. luanlun
    2008年5月9日08:34 | #58
    回复 | 引用

    研究很有意思 可是不知道怎么用啊......

  59. 7788
    2008年5月9日10:41 | #59
    回复 | 引用

    很是郁闷啊 我的新版网站就是按这个设计的 技术做了3个月了 老是生病 真没辙 到现在还没出来 倒是技术倒下了 。。。。。。。。。。。。。

  60. 广东seo服务jc
    2008年5月9日11:03 | #60
    回复 | 引用

    突然觉得。用这个理论放ggad.收益应该不错吧。！@

  61. 中国神秘网
    2008年5月9日12:07 | #61
    回复 | 引用

    不错

  62. drivewind
    2008年5月9日13:32 | #62
    回复 | 引用

    不同意星宇SEO兄的看法，呵呵
    我感觉用户的习惯是已经形成了的，做为设计者要去适应客户，而不是让客户来适应我们

  63. 港盛国际
    2008年5月9日14:32 | #63
    回复 | 引用

    对照自己的习惯，这种说法真的有道理~~~

  64. espow
    2008年5月10日15:54 | #64
    回复 | 引用

    呵呵，我要看自己所要找的内容是什么，
    一般都直接看内容，不看导航

  65. SEO服务
    2008年5月10日17:54 | #65
    回复 | 引用

    恩，之前看过一些这方面的东西

  66. 北京兼职
    2008年5月10日23:19 | #66
    回复 | 引用

    实时的改变下布局，吧最有用的放在第一屏客户第一眼就能够找到自己需要的内容，页面的布局有意识的吸引用户找到最需要的内容，符合用户体验，楼上的不错，有意识的排布关键词达到需要的效果！

  67. 高温瓷像
    2008年5月11日00:22 | #67
    回复 | 引用

    今天看到了尼尔森F形状网页电子商务浏览模式，确实反映了，因为我做的一个站也是这样！

  68. chemshows
    2008年5月12日13:32 | #68
    回复 | 引用

    受教了，试试做个这种站

  69. recycle bag
    2008年5月14日11:59 | #69
    回复 | 引用

    老乐，这文章不错。Jakob Nielsen乃用户体验方面的顶级专家

  70. 石客
    2008年5月17日20:56 | #70
    回复 | 引用

    关注很长一段时间了，但是没有动过手！，此文确实对电子商务网，很好的思路，在结合一些自己的东西，相信是一个不错的站！

  71. 第一商贸网
    2008年5月24日09:07 | #71
    回复 | 引用

    收藏下,DMMT也有详细讲,很不错的一本书.

  72. ITFLY
    2008年5月31日07:02 | #72
    回复 | 引用

    这对设计中需要强调的内容的放置位置给出了一个不错的提示。

  73. 易兰视界
    2008年6月17日00:39 | #73
    回复 | 引用

    很有意思的文章，可以尝试去适当改变布局。

  74. 成都iphone
    2008年6月17日20:07 | #74
    回复 | 引用

    非常好，我现在设计的页面基本上都是这种的了。

  75. 曦望
    2008年7月16日14:17 | #75
    回复 | 引用

    从自己视觉习惯，有这中类似的感觉已经有一年多了，但没人家哪么高深，哪么详细。这也是我一直喜欢用800靠左排版的原因

  76. xbojie
    2008年9月9日17:23 | #76
    回复 | 引用

    其实这个浏览模式只适用于第一次浏览，不适用回头客

  77. zhurui
    2008年9月17日11:14 | #77
    回复 | 引用

    这对设计中需要强调的内容的放置位置给出了一个不错的提示。

  78. 周易
    2008年10月3日09:53 | #78
    回复 | 引用

    其实这个浏览模式只适用于第一次浏览，不适用回头客

  79. 飞信
    2008年12月22日23:18 | #79
    回复 | 引用

    有没有可能跟百度搜索结果页的浏览热点一致呢？

  1. 2008年5月7日17:44 | #1
    尼尔森F形状网页浏览模式 | 人因实验室
本文的评论功能被关闭了.