F式布局的設(shè)計(jì)基礎(chǔ)是用戶掃視內(nèi)容的時(shí)候，實(shí)現(xiàn)的運(yùn)動(dòng)軌跡和字母F相似，而布局匹配這種這種閱讀方式可以讓用戶更快（Fast）地獲取信息，因此得名為F式布局。雖然網(wǎng)頁排版方式千變?nèi)f化，但是布局方式通常都遵循著幾種常見的規(guī)則。在諸多布局方式當(dāng)中，F(xiàn)式布局是可用性較強(qiáng)，且適用范圍較廣的一種。今天海之睿小編來和大家探討F式布局在網(wǎng)頁中的運(yùn)用。

一、內(nèi)容的優(yōu)先級

如果你對于頁面中內(nèi)容的輕重緩急有著足夠的了解，那么就可以結(jié)合用戶的瀏覽習(xí)慣，將重要的內(nèi)容排布在用戶視線時(shí)常停留的位置。讓這些呈現(xiàn)重要內(nèi)容的“熱點(diǎn)區(qū)域”承載核心的交互。

二、設(shè)置初始預(yù)期

文本的前幾段內(nèi)容是非常之重要的。盡量讓最核心、最重點(diǎn)的內(nèi)容放置在頁面的頂端，這也是為什么標(biāo)題、引言和導(dǎo)航欄是如此的重要的原因。

三、為速讀而設(shè)計(jì)

用戶通常不會(huì)一個(gè)字一個(gè)詞地閱讀文章，而是通過意群來獲取內(nèi)容，所以，你需要將可能包含用戶感興趣內(nèi)容的意群按照F式布局來排布，這樣可以盡可能高效地呈現(xiàn)內(nèi)容：

1.段落以新鮮有趣、關(guān)鍵核心的詞匯開頭。

2.用戶會(huì)優(yōu)先查看優(yōu)先級最高的元素（也就是視覺重量最重的區(qū)域）。因此，在文本為主的網(wǎng)站中，你應(yīng)該突出文本本身的重要性（比如關(guān)鍵詞），并且借助配色等元素，強(qiáng)化按鈕等涉及關(guān)鍵交互的元素的存在感。

3.每個(gè)段落陳述一件事情，并盡量有針對性地陳述。

4.將最重要的元素（諸如CTA按鈕等）置于最左側(cè)或者最右側(cè)，也就是用戶閱讀的起始部分。這個(gè)時(shí)候，用戶通常會(huì)有閱讀的停頓，而這個(gè)時(shí)刻可以讓他們有額外的時(shí)間來考慮并且選擇下一步的交互。

四、善用側(cè)邊欄

側(cè)邊欄通常可以幫助用戶深入到下一個(gè)層級，用戶的交互也更加的深入：

1.提供用戶想要看到的內(nèi)容，而不是廣告、相關(guān)文章和小控件這樣的東西。

2.將它設(shè)計(jì)成為用戶找到特定內(nèi)容的工具。最常見的設(shè)計(jì)是目錄列表，標(biāo)簽云和“最多點(diǎn)擊”文章列表。
五、避免無聊的布局

F式布局最大的問題是它會(huì)讓整個(gè)頁面看起來比較無聊。相似而重復(fù)的內(nèi)容出現(xiàn)在整個(gè)頁面的不同位置，用戶很可能在相似的布局中快速感到疲倦。所以，你需要?jiǎng)?chuàng)造一些和打破尷尬格局的元素，讓用戶不斷調(diào)整注意力，持續(xù)的閱讀。
總結(jié)：F式布局是遵循人類瀏覽信息的趨勢和習(xí)慣的，它能幫你優(yōu)化布局與結(jié)構(gòu)，但有趣的設(shè)計(jì)和良好的可讀性同等重要，如何兼顧兩者也是設(shè)計(jì)師需要考慮的問題。

轉(zhuǎn)載請注明來自：http://www.zfmj.com.cn/help/website/153353.html

標(biāo)簽：網(wǎng)頁設(shè)計(jì) 網(wǎng)站排版 海之睿