對(duì)于攝影師來說，三步取景法是一個(gè)非常熟悉的概念。雖然這是一個(gè)迷人的概念，但很少有人會(huì)在設(shè)計(jì)網(wǎng)頁時(shí)以三點(diǎn)法為例。當(dāng)然，這并不意味著這是不可能的，但這種跨類別的事情很少被注意到。因此，在今天的文章中，我將解釋三點(diǎn)方法，并分享一些將其應(yīng)用于網(wǎng)頁設(shè)計(jì)的技巧和經(jīng)驗(yàn)。然而，二分法可能并不適用于所有人。有許多技術(shù)和方法可以促進(jìn)設(shè)計(jì)和設(shè)計(jì)過程。然而，作為一個(gè)基本的布局規(guī)則，三等分當(dāng)然值得學(xué)習(xí)，它也非常適用于網(wǎng)頁設(shè)計(jì)

為什么三分

你可能會(huì)問，為什么你必須得到三分？這種奇怪的環(huán)境是從哪里來的？幸運(yùn)的是，我很高興地告訴你，這件事與數(shù)學(xué)定理或復(fù)雜的邏輯推理無關(guān)，也沒有太多必要深入探討這件事的起源。三等分法只來自傳統(tǒng)藝術(shù)，目前特別用于攝影。縱向和橫向，整個(gè)布局分為9個(gè)平均塊，橫向和縱向有2個(gè)邊界。三等分法規(guī)定，為了盡可能吸引觀眾的注意力，視覺重心或最吸引人的東西應(yīng)該盡可能靠近四條線的交點(diǎn)

你可以在這篇WDD文章中找到一個(gè)很好的例子。在許多情況下，非對(duì)稱布局可以使所有頁面更加有趣，但這并不意味著應(yīng)該一直使用非對(duì)稱布局，因?yàn)樵谀承┑胤剑瑢?duì)稱布局會(huì)更加有趣，而此時(shí)，三點(diǎn)規(guī)則沒有什么意義

在拍攝時(shí)，最富想象力的目的是從一個(gè)奇怪的角度捕捉一些有吸引力的場(chǎng)景。不對(duì)稱的布局使得視野中的一些元素比其他元素更突出，這些突出的元素通常壓在上述四個(gè)交叉點(diǎn)上

那么，回到網(wǎng)頁設(shè)計(jì)的問題，三部曲方法和網(wǎng)頁設(shè)計(jì)是如何協(xié)同工作的？正如攝影中三等分法下的布局可以吸引觀眾一樣，符合三等分法的網(wǎng)頁也可以讓讀者更加關(guān)注聚焦內(nèi)容

了解三等分網(wǎng)格

四線四點(diǎn)九塊是三等分法下的網(wǎng)格框架。許多網(wǎng)站的主頁設(shè)計(jì)都是按照F型布局或Z型布局，用戶已經(jīng)習(xí)慣了這種閱讀方式。通常，視覺起點(diǎn)在左上角，這是設(shè)計(jì)師首先應(yīng)該注意的塊，這意味著左上角的交點(diǎn)應(yīng)該與頁面的一些主要內(nèi)容重疊。沒有必要在交叉點(diǎn)放置鏈接或圖片（當(dāng)然，這不是必需的）。它更像是一個(gè)標(biāo)志，用于區(qū)分布局的主要節(jié)點(diǎn)。例如，頁面標(biāo)題的起點(diǎn)可以與其重疊，所有標(biāo)題與第一條水平線齊平，然后橫幅圖形等放置在標(biāo)題下方

值得注意的是，在web設(shè)計(jì)中應(yīng)用三分分析更多的是用戶體驗(yàn)設(shè)計(jì)的概念，而不是完整的設(shè)計(jì)標(biāo)準(zhǔn)。因此，如果要使用此概念來分析網(wǎng)頁設(shè)計(jì)，建議在閱讀器中打開網(wǎng)頁后分析和處理屏幕截圖。整個(gè)網(wǎng)頁太長(zhǎng)。用戶總是根據(jù)屏幕閱讀頁面，而不是一次查看整個(gè)頁面。不必應(yīng)用所有頁面。屏幕截圖就足夠了。如果設(shè)計(jì)仍處于原型階段，建議參考屏幕規(guī)模攔截分析

因此，應(yīng)從用戶的閱讀習(xí)慣出發(fā)，結(jié)合三點(diǎn)法進(jìn)行分析和優(yōu)化。在閱讀網(wǎng)頁時(shí)，用戶會(huì)下意識(shí)地注意到問題的癥結(jié)所在，并準(zhǔn)確地使用三點(diǎn)法來設(shè)計(jì)頁面。您將發(fā)現(xiàn)此3&；次數(shù)；3網(wǎng)格可以幫助你帶來非常有啟發(fā)性的設(shè)計(jì)

小調(diào)整而不是重新設(shè)計(jì)

在你知道如何應(yīng)用三分網(wǎng)格后，你需要澄清一個(gè)更重要的點(diǎn)：三分方法不會(huì)帶來完美的網(wǎng)頁設(shè)計(jì)框架，而是一個(gè)用于微調(diào)現(xiàn)有設(shè)計(jì)的布局測(cè)試框架

有太多免費(fèi)的網(wǎng)格系統(tǒng)可以幫助你設(shè)計(jì)網(wǎng)頁，例如960gs，但基于三分法的九格系統(tǒng)可以幫助您稍微調(diào)整網(wǎng)頁的布局，例如調(diào)整導(dǎo)航欄的高度和將徽標(biāo)移近或移遠(yuǎn)

幸運(yùn)的是，這種測(cè)試方法非常適用且簡(jiǎn)單，并且不選擇軟件。在屏幕截圖分析之后，您可以在PS中畫一條虛線。Gimp和其他開源免費(fèi)軟件也可以輕松幫助您。如果出現(xiàn)問題，你可以在屏幕上畫一個(gè)九方形來分析它（據(jù)說盲人狙擊手在一開始玩CS時(shí)使用了如此愚蠢的方法~），無論如何，它可以幫助你構(gòu)建一個(gè)分析九宮格線的工具，幫助你找到準(zhǔn)確的設(shè)計(jì)方向

完成初稿，用三點(diǎn)法測(cè)試，然后繼續(xù)下一步。隨著時(shí)間的推移，您將更好地了解如何將視覺元素放置在正確的位置

處理對(duì)稱

有時(shí)在頁面中正確應(yīng)用對(duì)稱元素非常有用。但如果我們?cè)?strong>網(wǎng)頁設(shè)計(jì)中到處使用對(duì)稱設(shè)計(jì)，那就太盲目了。事實(shí)上，在藝術(shù)和攝影領(lǐng)域，非對(duì)稱布局的應(yīng)用仍然占據(jù)主流，因?yàn)槠湎鄬?duì)大小和適當(dāng)?shù)木嚯x更令人愉悅，這也證明了非平衡視覺設(shè)計(jì)可以吸引我們的注意

事實(shí)上，布局設(shè)計(jì)也有類似的原則和規(guī)格。例如，當(dāng)您在頁面頂部應(yīng)用大型橫幅圖形時(shí)，它通常占據(jù)頁面高度的三分之二左右。同樣，需要比較標(biāo)題和文本的字體大小，讀者自然會(huì)注意到更大的橫幅圖形、標(biāo)題和副標(biāo)題。一方面要進(jìn)行大小比較，另一方面要考慮圖片和文本在頁面上的位置。簡(jiǎn)單地應(yīng)用三等分法并不能保證構(gòu)圖的完整性。最好將九宮格放在頁面上，并適當(dāng)調(diào)整頁面上元素的位置和中心

三等分法的優(yōu)點(diǎn)是可以兼容不對(duì)稱布局，也可以用來優(yōu)化對(duì)稱布局。這兩種布局巧妙地搭配在一起。借助三點(diǎn)法，我們可以突出頁面的關(guān)鍵點(diǎn)，控制頁面的平衡，從而培養(yǎng)優(yōu)秀的網(wǎng)頁

最后的想法

大多數(shù)藝術(shù)情境沒有固定的規(guī)則，但有規(guī)則可供參考，設(shè)計(jì)在這些規(guī)則的基礎(chǔ)上不斷改進(jìn)。像三等分一樣控制法則，理解這個(gè)法則的目標(biāo)，并深刻理解即使不是故意應(yīng)用，它也會(huì)自然地出現(xiàn)在你的設(shè)計(jì)中，類似于第二本能。此時(shí)，你有可能打破規(guī)則，盡管設(shè)計(jì)和藝術(shù)之間有著根本的區(qū)別，但它們并不是對(duì)立的。誠(chéng)然，根據(jù)規(guī)則，你可以設(shè)計(jì)出更符合人們口味的作品，但那些違反規(guī)則、充滿個(gè)性和藝術(shù)感的設(shè)計(jì)作品并不能打動(dòng)人們。