（注：本文譯自Interaction-Design.org，譯者荷籽記憶）

什么是三分法則？

三分法則是另一種看待設(shè)計(jì)（如網(wǎng)頁，油畫或是攝影）布局的方法。這種方法非常的簡單易懂：在你的設(shè)計(jì)上面鋪設(shè)一層網(wǎng)格（水平和垂直各三等分）。這使得九個(gè)格子每一個(gè)都是一模一樣的。?

如果你手頭有一張紙或者你想畫一個(gè)應(yīng)用，嘗試一下這種方法。用你的尺子測量一下寬度和高度（或者長度和寬度，如果你有紙張，請把它轉(zhuǎn)為橫向），然后縱橫分別三等分，把兩組平行線的四個(gè)交點(diǎn)標(biāo)出來。

三分法則示意圖

從審美的角度來看，將一項(xiàng)設(shè)計(jì)橫向和縱向分別三等分，每一份都有一個(gè)類似的主題，這種方法會(huì)使得你的設(shè)計(jì)更有意思。1797年雕塑家約翰·托馬斯在他的作品《田園風(fēng)光筆談》中首次創(chuàng)造了“三分法則”這一術(shù)語，他在書中認(rèn)為運(yùn)用網(wǎng)格手法將油畫分割的技巧能夠在參觀者眼中產(chǎn)生最優(yōu)化的視覺效果。

簡而言之，在將這種創(chuàng)意運(yùn)用到其他情形下時(shí)，無論是光線、陰影、形狀或是顏色，相比于常見的一分為二，我發(fā)現(xiàn)三分之二對(duì)三分之一（或者反過來）的比率是一種更好更和諧的均衡。

看一看那些著名攝影師的作品，我們就會(huì)發(fā)現(xiàn)，一張照片的主體很少會(huì)出現(xiàn)在正中心的位置，因?yàn)閿z影師們在構(gòu)圖的時(shí)候會(huì)考慮三分法則（確實(shí)，有很多相機(jī)也會(huì)在取景器上提供一層網(wǎng)格來幫助攝影師在腦海里構(gòu)思他們要拍攝的場景）。

網(wǎng)格中最重要的部分就是線相交的位置，這就是焦點(diǎn)（或者業(yè)內(nèi)稱作“甜蜜點(diǎn)”）。在攝影學(xué)中，你可能會(huì)引用一個(gè)人的眼睛或者微笑就是在這樣一個(gè)位置點(diǎn)的事實(shí)來講述攝影的學(xué)問。實(shí)際上，你有四個(gè)甜蜜點(diǎn)可以使用。對(duì)著畫面所描繪的場景，只要稍微思考一下（例如，背景是不是有一座山？），你就可以展示出最有影響的攝影作品。你的拍攝主體在登山的時(shí)候看上去是不是足夠自信？記住，一張圖片勝過千言萬語。

攝影作品中三分法則的運(yùn)用

這就是為什么網(wǎng)格是如此重要的原因，它同樣適用于我們設(shè)計(jì)師。在網(wǎng)頁和app設(shè)計(jì)中，我們可以把CTA或者一些關(guān)鍵元素放置在甜蜜點(diǎn)，因?yàn)槲覀冎罏g覽者的眼睛會(huì)自覺不自覺地停留在四個(gè)交錯(cuò)點(diǎn)上。需要注意的一點(diǎn)是這四個(gè)甜蜜點(diǎn)在瀏覽者眼中出現(xiàn)的頻率是不同的，所以在你的設(shè)計(jì)中采用對(duì)稱法并不總是最好的選擇。稍后，我們將來詳細(xì)看看這些甜蜜點(diǎn)究竟有何不同。

如果你旨在達(dá)到最佳的視覺效果，那么三分法則將是你重要的盟友。通過訓(xùn)練你的眼睛來確保你設(shè)計(jì)的關(guān)鍵元素落在最合適的甜蜜點(diǎn)，你將使用到你的另一個(gè)重要盟友：用戶的眼睛。如果你在一張橫向或者縱向的圖片或者背景上面鋪設(shè)一層網(wǎng)格并沒有多大關(guān)系。只要有九個(gè)方格和四個(gè)交錯(cuò)點(diǎn)，你就完美武裝了。

就像黃金率一樣，三分法則一直都存在，而且它的應(yīng)用在我們周圍隨處可見。說到黃金率，讓我們一起來看看它在創(chuàng)作最佳設(shè)計(jì)布局的問題上是如何與三分法則相關(guān)聯(lián)的。

黃金率與斐波那契網(wǎng)格線

發(fā)現(xiàn)黃金率之后，我們知道了如何制作一個(gè)理想的長方形（邊長為1，我們乘以一個(gè)黃金數(shù)值1.618，就得到寬度為1.618）。最終的形狀就是我們認(rèn)為的最滿意的長方形，因?yàn)樗谋壤褪屈S金率。

這個(gè)時(shí)候，我們要回到前面提到的網(wǎng)格和三分法則。首先，讓我們快速看一下另一種網(wǎng)格，斐波那契網(wǎng)格。通過它，我們將了解黃金率是如何運(yùn)用到網(wǎng)格設(shè)計(jì)中的。

在三分法則出現(xiàn)之前，早期的設(shè)計(jì)師使用的是其他的方法。這期中就涉及到黃金率，畫出這樣一個(gè)網(wǎng)格是，那九個(gè)方格中實(shí)際上包含四個(gè)長方形，每個(gè)長方形都是1：1.618比例。所以，如果我們有一個(gè)寬度為1.54cm，高度為1.02cm的背景，那么我們可以將水平標(biāo)記分別定在0.59cm和0.96cm。而垂直標(biāo)記則定在0.39cm和0.63cm。

藍(lán)色線框=三分法則，黑色線框=斐波那契網(wǎng)格

不用說，斐波那契網(wǎng)格要比三分法則網(wǎng)格花費(fèi)更多的功夫去畫。然而，人們相信它可以通過數(shù)學(xué)空間分割來培養(yǎng)用戶更好視覺和諧與平衡。同樣，使用斐波那契網(wǎng)格能過很好地確保對(duì)齊，尤其是在水平橫向圖片中。由于在斐波那契網(wǎng)格線相交的四個(gè)甜蜜點(diǎn)相對(duì)集中，用戶的視線很自然地就落到了這四個(gè)甜蜜點(diǎn)上。請參見下圖，注意這些點(diǎn)是如何瞄準(zhǔn)主體的。

斐波那契網(wǎng)格在攝影作品中的運(yùn)用

雖然有它的優(yōu)勢，但斐波那契網(wǎng)格同樣也有不足。同樣有四個(gè)集中在中間的甜蜜點(diǎn)（三分法則也具有這一特征），但是它卻容易使設(shè)計(jì)師分心，一些設(shè)計(jì)師會(huì)對(duì)他們的元素視而不見。更糟糕的是，對(duì)于復(fù)雜一點(diǎn)的工作過程使用這種網(wǎng)格會(huì)更費(fèi)時(shí)間和精力。有效使用斐波那契網(wǎng)格優(yōu)勢的繁重工作會(huì)使設(shè)計(jì)師很狼狽，反而得不償失。

如何在你的設(shè)計(jì)中運(yùn)用三分法則？

幸運(yùn)的是，正如我們所看見的，三分法則使我們能夠制作非常簡單的網(wǎng)格。正因?yàn)樗暮喴仔?，三分法則被廣泛使用。它吸收了斐波那契網(wǎng)格的優(yōu)勢，這意味著當(dāng)我們需要從使用計(jì)算器的繁重工作中解放出來的的時(shí)候，我們也可以運(yùn)用比例分割的原理。

作為網(wǎng)頁設(shè)計(jì)師，我們同樣可以使用三分法則來將最重要的內(nèi)容放置在任何一張網(wǎng)頁最上面的三分之一處。你也許會(huì)覺得奇怪，因?yàn)楹茱@然那個(gè)位置是高于交錯(cuò)甜蜜點(diǎn)的。但是，在網(wǎng)頁設(shè)計(jì)中，我們處理的是滾動(dòng)的頁面。在許多現(xiàn)代設(shè)備上，一整張的網(wǎng)頁是不適合放在屏幕上的。所以，通過把內(nèi)容放置在"第一屏"，我們也是在運(yùn)用三分法則。用戶的實(shí)現(xiàn)同樣會(huì)落在正確的位置上。

它同樣適用于我們消費(fèi)信息時(shí)的視覺層次（幾乎所有的語言，我們都是從上到下閱讀的）。研究表明，我們的眼睛傾向于用這樣的方式來瀏覽圖片：在這四個(gè)甜蜜點(diǎn)中，有超過40％的用戶會(huì)被左上的甜蜜點(diǎn)吸引。然后，視線會(huì)落到左下的甜蜜點(diǎn)，大約有25％的用戶關(guān)注。接著，視線會(huì)移動(dòng)到右上的甜蜜點(diǎn)，大約20％的用戶關(guān)注，最后就是位于右下的甜蜜點(diǎn)，只有14％的用戶關(guān)注。

由此，我們注意到，用戶傾向于以F形的方式閱讀（首先關(guān)注左上方，然后往下，接著往上到達(dá)右上方，最終很少有人會(huì)關(guān)注到右下方到內(nèi)容）。因此，左上方的甜蜜點(diǎn)就是你用來抓住用戶的首選位置了。

甜蜜點(diǎn)關(guān)注比例示意圖

結(jié)論

三分法則已經(jīng)幫助藝術(shù)家和設(shè)計(jì)師至少200年。它已經(jīng)成為一個(gè)普遍的概念：藝術(shù)家和設(shè)計(jì)師通過創(chuàng)作一個(gè)帶有九個(gè)方格的網(wǎng)格來將用戶的視線吸引到他們設(shè)計(jì)作品上的具體位置。通過測量，標(biāo)記和描畫兩組垂直和水平的平行線來找到四個(gè)交錯(cuò)點(diǎn)，這種網(wǎng)格讓你從一個(gè)不同的視角來考量你的設(shè)計(jì)。

三分法則與黃金率及其引入的動(dòng)人均衡比例相關(guān)聯(lián)。早期一點(diǎn)的斐波那契網(wǎng)格雖然是一種更完美的分割比例代表，但并不那么簡單易用。將九個(gè)中的四個(gè)方格塑造為擁有黃金率（1：1.618）的長方形，雖然被認(rèn)為提供了更令人滿意的視覺效果，但是在設(shè)計(jì)中并沒有被廣泛使用。

作為用戶和設(shè)計(jì)師，我們一般是以F形的方式瀏覽圖片。最開始，我們的大部分注意力都集中在左上的甜蜜點(diǎn)，然后往下看，到達(dá)左下的甜蜜點(diǎn)，接著上去跳到右上，最后才到右下的甜蜜點(diǎn)。

F型閱讀瀏覽方式

因此，作為一名設(shè)計(jì)師，你應(yīng)該充分利用這一優(yōu)勢，通過迎合用戶的瀏覽習(xí)慣來使你的設(shè)計(jì)作品影響最大化。

無論你是手工或者借助軟件來設(shè)計(jì)，你都會(huì)發(fā)現(xiàn)三分法則對(duì)于瞄準(zhǔn)你設(shè)計(jì)的關(guān)鍵點(diǎn)以及與你的用戶交流這些關(guān)鍵點(diǎn)都是大有裨益的。需要記住的是，在設(shè)計(jì)中，你可以橫向也可以縱向使用這一法則。