加入收藏
您好,歡迎光臨上海麥大投資管理!
如何利用F型瀏覽模式來設計網站頁面
2017-08-23

大多數情況下瀏覽者都不由自主的以“F”形狀的模式閱讀網頁,這種基本恒定的閱讀習慣決定了網頁呈現F形的關注熱度。研究者用了幾種不同的頁面做眼動儀測試,得到了3張熱度圖,用顏色來表示瀏覽者眼光聚集的熱度,分為*熱(紅色)、較熱(黃色)、不熱(藍色)和基本不關注(灰色)4種。其中搜索結果頁因SERP中網站標題、網頁摘要較寬,第二條線會隨之加長,但仍然是F形狀。那么如何運用F型瀏覽模式來設計網站頁面呢?


通常來說,設計師會把導航條放在頂部,從左上角到右上角,方便用戶點擊及搜索關鍵詞,設計師們對導航條的設計也各有不同:輕細的導航條會讓用戶進一步瀏覽下方的其他內容,厚重的導航則會讓用戶更多的關注到導航條本身,而不是下方的內容。

第一行之后,用戶就會來到下一個關鍵節點并做同樣的動作。理論上,用戶會繼續往下瀏覽,直到他們找到感興趣的內容。但實際情況是,他們很可能在幾秒后就走人了,除非你能繼續吸引住他們。

因此,為了打破頁面的單調,專家們建議設計師在第二行或第三行(即“F”的第二橫或“E的第三橫)之后,借助一些“突兀的”元素來“破壞”整體布局的連續性。利用一些設計上的變化來保持視覺刺激。常用的做法是,在每過1000像素的版塊后方就來一些不一樣的布局設計。

F 模型不僅僅適用于文本,要展示多樣化的內容,免不了對內容進行組織整理。F 模型僅僅遵循了人眼(運動)的共同趨勢,因此,你可以根據自己的布局做不同的優化處理。它只是一個指南,而不是一個模板,不用完全照搬。哪怕你只是想添加一個按鈕來強化頂部導航欄,小調整也可能帶來大不同。


暫無評論!
我要評論 只有購買過該商品的用戶才能評論。
新聞動態

加載中
免責聲明:本網站部分內容由用戶自行上傳,如權利人發現存在誤傳其作品情形,請及時與本站聯系。
  • QQ咨詢
  • 電話咨詢
内蒙快三开奖