學習UI設計的時候，經常要接觸到頁面的布局，布局的方式會直接影響壹個APP的視覺效果，好的布局方式，往往能帶來舒服的視覺效果，更能得到用戶的接受與好評。然而萬變不離其宗，移動端頁面常用的布局，不外乎以下8種。
1.列表式布局
·列表式布局
特點：內容從上向下排列，導航之間的跳轉要回到初始點
優點：
1.層次展示清晰明了
2.視線流從上到下，瀏覽體驗快捷
3.可展示內容較長的菜單或擁有次級文字內容的標題
缺點：
1.導航之間的跳轉要回到初始點，靈活性不高
2.同級內容過多時，用戶瀏覽容易產生視覺疲勞
3.只能通過排列順序、顏色來區分各入口重要程度
的很多地方都運用了列表式布局，這種布局方法能夠讓用戶清晰明了地知道頁面的內容，簡介又大方。
2.陳列館式布局
支付寶·陳列館式布局
特點：布局比較靈活，即可以平均分布這些網格，也可以根據內容的重要性做不規則分布
優點：
1.同樣的高度下可放置更多的菜單，流動性強
2.直觀展現各項內容，方便用戶瀏覽經常更新的內容
缺點：
1.不適合展示頂層入口框架
2.界面內容過多時顯得雜亂，讓用戶眼花繚亂
支付寶的界面相信大家都很熟悉，它的首頁就使用了陳列館式布局，它能直觀得展現各項內容，而且首頁的內容都是用戶經常遊覽的，不過由於界面過多，視覺體驗效果就稍微遜色了壹點。
3.九宮格布局
·九宮格布局
特點：相比陳列館式，九宮格布局比較穩定為壹行三列式
優點：清晰展現各入口，方便用戶快速查詢
缺點：
1.菜單之間的跳轉要回到初始點
2.容易形成更深的路徑，不能顯示太多入口次級內容
很多軟件都喜歡運用九宮格布局，的專題管理員這裏也使用了這種布局，井然有序且間隔合理，視覺效果挺舒服的。
4.選項卡式布局
·選項卡式布局
特點：導航壹直存在，具有選中狀態，可快速切換另壹個導航
優點：
1.直接展示最重要接口內容信息
2.分類位置固定，清楚當前所在入口位置
3.減少界面跳轉的層級，輕松在各入口間頻繁跳轉
缺點：1.功能入口過多時，該模式顯得笨重不實用
的首頁也使用了選項卡布局，圖中上面的紅色框和下面的紅色框都是此布局，但是，個人覺得上面的選項卡由於功能入口太多而顯得笨重，下面的則恰到好處。
5.旋轉木馬式布局
壹個·旋轉木馬式布局
特點：重點展示壹個對象，通過手勢滑動查看更多內容
優點：單頁面內容整體性強，聚焦度高
缺點：1.受屏幕寬度限制，可顯示的數量較少
2.不能跳躍性地查看間隔的頁面
3.各頁面內容結構相似，容易忽略後面的內容
閱讀軟件“壹個”的首頁則使用了旋轉木馬式布局，壹個的主題是“復雜的世界裏，壹個就夠了”，所以它選用此布局起到了畫龍點睛的作用，更能提高單頁面的聚焦度。
6.行為擴展式布局
QQ好友列表·行為擴展式布局
特點：能在壹屏幕內顯示更多的細節，無需頁面跳轉
優點：
1.減少頁面跳轉的層級
2.對分類有整體性的了解，清楚當前所在的入口位置
缺點：分類位置不固定，當展開的內容較多時，跨分類跳轉不方便
騰訊QQ的聯系人頁面使用了行為擴展式布局，相信大家也不陌生，用起來也很方便。
7.多面板布局
QQ興趣部落·多面板布局
特點：能同時呈現比較多的分類及內容
優點：1.分類位置固定，清楚當前所在入口位置
2.對分類有整體性的了解，減少界面跳轉的層級
缺點：界面比較擁擠，容易產生視覺疲勞
騰訊QQ的興趣部落頁面使用了多版面布局，能同時呈現出比較多的興趣分類及內容，這也是壹種典型的頁面布局方式。
8.圖表式布局
支付寶·圖表式布局
特點:用圖表的方式直接呈現信息
優點：直觀，總體性強
缺點：詳細信息顯示有限
支付寶作為壹個與金錢有關的軟件，它余額寶頁面選擇了與自身比較符合的圖表式布局，這種布局能直觀詳細地顯示出信息，很適合用於數據、賬單有關的APP。