網頁排版——Z型模式
Z型模式的是一種比較經典的排版方式。因為它解決了任何網站的核心要求：品牌，層次結構，結構和號召性操作。
一、什麼是Z型模式
Z型模式閱讀佈局遵循字母Z的形狀，跟從人眼掃描頁面時從左到右，從上到下的行進路線：
首先，我們從左上角到右上角進行閱讀，形成一條水平線；
接著，在頁面左下方。會建立一條對角線；
最後，再往右轉，形成第二條水平線。
當用戶的眼睛以這種模式移動時，它形成了一個虛構的”Z”形
Z型模式
Z型模式的應用
簡單吧，其實排版沒什麼複雜的。Z型模式能夠以邏輯順序快速有效地將點1從點1轉移到第4點。當然作為設計師，我們肯定不能僅僅作到以上幾點，我們還需要再潤色一下介面，使得介面更加豐滿。
二、用在哪裡?
前面提到的，Z型模式肯定不一定是所有網站的最終具體解決方案，但正如我前面提到的，任何設計專案往往它都是一個很好的跳躍點，因為它解決了有效設計的四大原則：品牌、層次機構、結構、號召性操作。這就像看一本書一樣，從上到下，從左往右。基於這個基礎，可以解決很多問題，我們可以新增多個號召性操作按鈕，縮小Z的高度，擴充套件它，做任何你想要的，這對於網站的目標是有意義的。比如Facebook的登入頁
Facebook登入頁
Z模式的瀏覽模式在於網頁內容主要不是文字的頁面。它幾乎可以適用到任何的網頁互動，Z模式的優點就是簡單。如果你的網站內容很多並且很複雜的話，那麼用這個模式，效果就會稍差。當然，這些都不是絕對的。那麼接下來說說，怎麼使用這種模式。
三、如何使用
在開始排版前，首先思考以下三點：
1.當用戶登入這個頁面時，你希望他們注意什麼？
2.你希望他們以什麼順序來檢視資訊？
3.你想要他們做什麼？
考慮好了以上3點，然後你可以是否可以套用Z型佈局啦，其實設計方式很簡單：在頁面上加字母”Z”就好了。在理想情況下，你希望使用者首先看到你最重要的資訊，以及你下一個重要的資訊。因為。沿著視覺掃描路徑位置放置重要元素，並在正確的時間向用戶提供正確的資訊就好了。
Z型模式
建立Z型模式視覺流的時候要注意以下幾個方法：
點1——使用者視覺流的起點，也是放logo的黃金位置
點2——Z的頂部，放你希望使用者首先看到的東西。眼睛比較自然地遵循Z型路線，所以比較重要的東西就要放在這裡了。在設計時要注意視覺重量，要讓使用者注意並引導使用者沿著Z型走。
中心區域——這個區域的訣竅是補充使用者感興趣的內容，同時仍然將視線向下延伸至下一行。比如放一些輪播圖等，來分離頂部和底部。
點3——點3的目的就是去點4進行最後的行動。比如，想要銷售某些產品，希望潛在客戶在看到“立即購買”按鈕之前說服他們去購買的一些引導。因此，可以在點3為他們提供利息或其他引導的資訊。這個在排版時需要注意不要和點4位置太遠。因為我們要它隨時抵達最終目標。
點4——終點。它和點3之間應該包含將使用者視線推向角落的內容。這裡主要是使用者行動按鈕的位置。
Basecamp和Evernote的首頁也是採用了Z型模式進行排版的。
Basecamp
Evernote
四、Z型模式拓展
關於Z型排版，我們不一定是一個大“Z”來運動的，我們還可以看作一系列的Z連續運動。比如dropbox，引導使用者通過幾個關鍵產品功能完成他們重複的Z型模式佈局。在這裡，“learn more”按鈕起到輔助行動按鈕的作用，可以幫助使用者進入下一個相關頁面。
dropbox
五、總結
Z型模式是眾多網站採用的原因是可以利用Z，是能夠將重要資訊自然而然的突出。我們在使用時，記住要確定資訊的層級關係。