作者:heidixie 來源:Alibaba.com UED 時間:2009-09-17 類別:網頁理論
什么是F型瀏覽?
2006年4月,美國長期研究網站可用性的著名網站設計師 杰柯柏?尼爾森(Jakob Nielsen)發表了一項《眼球軌跡的研究》報告(原文:F-Shaped Pattern For Reading Web Content)。
報告中提出,大多數情況下瀏覽者都不由自主的以“F”形狀的模式閱讀網頁,這種基本恒定的閱讀習慣決定了網頁呈現F形的關注熱度。
研究者用了幾種不同的頁面做眼動儀測試,得到了3張熱度圖,用顏色來表示瀏覽者眼光聚集的熱度,分為最熱(紅色)、較熱(黃色)、不熱(藍色)和基本不關注(灰色)4種。其中圖3搜索結果頁因SERP中網站標題、網頁摘要較寬,第二條線會隨之加長,但仍然是F形狀。
圖1:F型瀏覽
研究人員這樣詮釋F型瀏覽:
第一步:水平移動
瀏覽者首先在網頁最上部形成一個水平瀏覽軌跡。
第二步:目光下移,短范圍水平移動
瀏覽者會將目光向下移,掃描比上一步短的區域。
第三步:垂直瀏覽
瀏覽者完成上兩步后,會將目光沿網頁左側垂直掃描;這一步的瀏覽速度較慢,也較有系統性、條理性。
F型瀏覽背后的問題
F型瀏覽模式這個理論已經推出很久了,我在很多網站和BLOG上也看到過這樣的分享。我在思考幾個問題:
帶著這些問題,我進行了一些資料的發掘和嘗試,進而有了更多的疑問。
什么造成了F型瀏覽?
Jakob Nielsen花費的苦心用三種不同的網頁進行測試,目的是為了告訴我們,F型瀏覽在不同的網站上都是通用的,用戶的F型瀏覽行為并不會受到網站內容和設計出現太大的不同。
但是他并未進一步分析出現F型瀏覽的原因,結果讓很多人誤認為這真的是一種“不由自主”的行為。
也正因為如此,F型瀏覽也很容易被看出很多漏洞來。比如:
為什么不是E而是F?因為我們看到很多眼動儀測試的圖片F下面并未一只有一個水平瀏覽線,而是多個。
為什么下面的一個水平瀏覽線要短于上面的一條,而實際上我們看到的很多眼動儀圖片卻是下面的水平瀏覽線要長于上面的一個?
而進一步的研究也發現,當考慮到網頁豐富的內容元素,比如圖片時,F型瀏覽很容易就被打破。如圖,你能看到一個典型的F嗎?
圖2:圖片因素對F型瀏覽的影響
那么,研究人員又來補充F型瀏覽了,他們說,當有了圖片元素影響后,用戶的瀏覽行為發生了改變,不再呈現F型瀏覽,而是出現了一個E字:
我想,再這么推下去,還是避免不了漏洞百出,E出來了,F出來了,將來還會有L,I,C,Z……
還是早早透過現象去分析本質,讓我們早點接觸F型瀏覽背后的原因更好。
F型瀏覽背后的研究以及眼動儀確實能夠幫助我們發現一些問題,但是F型瀏覽的理論在很多場合下顯得不是很靠譜。不要被F型瀏覽忽悠,主要是要警惕那些片面理解F型瀏覽的拿來主義者、理論主義者(F型瀏覽的英文原文值得好好閱讀并思考)。
我認為,F型或者是E型瀏覽方式,絕對不是無意識的“不由自主”的行為,而是網站內容、設計,用戶需求和用戶習慣多重因素作用下的結果。
用戶在瀏覽的時候,大腦里出現了三個詞語:也許是,是,否。
當詞語是“也許是”的時候,用戶水平瀏覽以獲取更多信息,當答案是否時,用戶放棄水平瀏覽,下移閱讀下一段或者下一個搜索條目。當答案是是時,一般會產生一個點擊。如圖所示:
圖3:F型瀏覽是有意識的行為
優秀包裝設計精選集(44)包裝設計2013-11-24
20個國外創意信封設計欣賞VI設計2013-11-14
6個創意品牌形象設計佳作VI設計2013-11-14
30款薯片包裝設計欣賞包裝設計2013-10-26
現代時尚的臥室設計欣賞裝修設計2013-10-25
優秀包裝設計精選集(43)包裝設計2013-10-25
設計師如何通過顏色來影網頁理論2013-12-03
做好扁平化設計:視覺篇網頁理論2013-11-28
如何讓響應式網頁設計保網頁理論2013-11-06
淺析專題中的構圖之美網頁理論2013-11-06
扁平設計之爭網頁理論2013-09-18
網頁設計可用性指導-如何網頁理論2013-07-26