05
網(wǎng)格式布局
如果有很多圖片，內(nèi)容細(xì)碎的網(wǎng)頁(yè)，可以選擇網(wǎng)格布局。網(wǎng)格布局可以使用不同大小網(wǎng)格來(lái)表達(dá)內(nèi)容，不同網(wǎng)格里所表達(dá)的內(nèi)容不同。網(wǎng)格會(huì)給人一種整齊的秩序感。網(wǎng)格設(shè)計(jì)可以提升整個(gè)網(wǎng)頁(yè)的整齊性，保持內(nèi)容的有序，并且很容易使用。
應(yīng)用：圖片，文字比較多的網(wǎng)站。
06
雜志版式布局
如果是每天都需要更新的網(wǎng)站，可以學(xué)習(xí)雜志和期刊的布局，運(yùn)用到網(wǎng)頁(yè)上。雜志版式的網(wǎng)頁(yè)布局就和我們平時(shí)看到的雜志上的布局一樣，根據(jù)種類的劃分，進(jìn)行排列。這樣的布局可以讓網(wǎng)頁(yè)是多樣化，也能讓用戶每天都有新鮮感！
應(yīng)用：內(nèi)容多，種類多的網(wǎng)站。
07
單頁(yè)布局
對(duì)于內(nèi)容稀疏的網(wǎng)站，單頁(yè)布局是一個(gè)很好的選擇。單頁(yè)布局是將網(wǎng)站中的所有的主要內(nèi)容放在一個(gè)網(wǎng)頁(yè)上，通過(guò)滾動(dòng)完成導(dǎo)航。單頁(yè)布局是內(nèi)容敘事的完美選擇，還可以使用視差滾動(dòng)的效果，讓畫面產(chǎn)生一種交互感，并且讓觀者沉浸在其中。
應(yīng)用：內(nèi)容稀疏，沉浸式敘事網(wǎng)站，交互式讀物。
08
F型布局
F型的布局是適合很多的頁(yè)面布局好的網(wǎng)頁(yè)圖片例子--瀑布圖片，有研究表明，用戶在瀏覽網(wǎng)頁(yè)的時(shí)候，會(huì)習(xí)慣于沿著F式的閱讀軌跡來(lái)瀏覽信息。從左到右的閱讀是用戶閱讀的習(xí)慣，用戶通過(guò)從左到右的閱讀然后向下閱讀，繼續(xù)從左到右。F型的布局有很明確的視覺(jué)層次結(jié)構(gòu)。
應(yīng)用：以文字為主，大部分網(wǎng)站都適用。
09
Z型布局
Z型布局是將用戶的視線吸引到頂部，遵循著從左到右的規(guī)律，用戶會(huì)從左到右，從上到下的習(xí)慣來(lái)進(jìn)行閱讀網(wǎng)頁(yè)，這樣的布局比較簡(jiǎn)單，合理的運(yùn)用從左到右看的規(guī)律，將元素合理整齊的排布好就行了。
應(yīng)用：以圖片為主的網(wǎng)站布局好的網(wǎng)頁(yè)圖片例子--瀑布圖片，大部分網(wǎng)站都適用。