作者: 賈凡，用戶體驗設計師，GE數字集團
今天我們繼續上一次的網頁設計 Z 型佈局話題談一談網頁佈局中的 F 型佈局.
網頁設計中的 F 型佈局其實來源於眼動儀對現有網頁的實驗結果.在對測試者只用眼動儀觀測其瀏覽大量的網頁以後,結果發現,被測試者的閱讀習慣是從頁面的左上角瀏覽到右上角,頁面左側是視線停留很長的部分,偶爾會看相頁面右邊的部分. 這樣的眼動實驗告訴我們,應該儘量把頁面比較重要的信息,例如 logo, 導航,重要的操作指引放在頁面的左側.
下圖就是測試者視覺停留熱區的展示.
用戶的普遍視覺流程是:
- 從頁面的左上角開始
- 瀏覽最上部分(導航/訂閱信息/搜索框 ....)
- 然後視覺向下轉移,從左往右
在設計中的實際應用有很多,比如 Predxi UI:
