很多優(yōu)秀的作品簡(jiǎn)單卻美，他們?cè)趩我坏脑O(shè)計(jì)元素基礎(chǔ)上設(shè)計(jì)成功的要素就在于黃金比例，首先我們理清下概念，什么叫黃金比例？黃金比例是一個(gè)數(shù)學(xué)比率，通常在自然界中都能發(fā)現(xiàn)它，用來(lái)建立平衡的構(gòu)圖，如下圖。

它大約等于1.6180，臘字母Ф表示這個(gè)值。黃金比例雖是一個(gè)數(shù)學(xué)比率，但對(duì)美的影響卻是巨大的，例如蘋果和Twitter的LOGO就是非常成功的例子。

既然你已經(jīng)了解了黃金比例的基礎(chǔ)知識(shí)，那么接下來(lái)看看如何借助它來(lái)提升你的設(shè)計(jì)。由于黃金比例的呈現(xiàn)形式很多，所以你可以將它用到布局、間隔、內(nèi)容、圖像和圖形當(dāng)中，下面是看看我們?cè)谠O(shè)計(jì)中如何利用“黃金比例”。

1、布局：將尺寸設(shè)置成黃金比例

在布局中使用黃金比例的方法并不難，關(guān)鍵是控制比例和尺寸。重點(diǎn)很簡(jiǎn)單，把握好1:1.618的黃金比例。

舉個(gè)例子，使用960px的寬度布局的時(shí)候，除以1.618可以得到594px，這個(gè)可以用作你的布局的高度，然后將整個(gè)布局劃分為兩欄，一欄方形，一欄矩形，一個(gè)協(xié)調(diào)的布局就出來(lái)了。

這種兩欄式布局在網(wǎng)頁(yè)上非常實(shí)用，我們所熟知的美國(guó)國(guó)家地理的網(wǎng)頁(yè)就是使用的這樣的布局方式，看起來(lái)可讀性非常不錯(cuò)，比例平衡，符合網(wǎng)站內(nèi)容自然的特性。

2、間距：使用黃金螺旋布局

間距的控制和留白一樣，是設(shè)計(jì)中非常關(guān)鍵的元素。協(xié)調(diào)的布局能夠營(yíng)造出優(yōu)秀的作品，那么如何借助黃金比例來(lái)協(xié)調(diào)頁(yè)面中的多種元素呢？合理的計(jì)算有的時(shí)候比直覺(jué)合適，如果能結(jié)合起來(lái)就更好了。

在基本的布局上，借助黃金螺旋來(lái)調(diào)整，是個(gè)不錯(cuò)的思路。多種不同的元素在同一頁(yè)面上的時(shí)候，黃金螺旋可以幫你篩選出合理的空間布局和間隙。

3、內(nèi)容：沿著黃金螺旋的軌跡

對(duì)于頁(yè)面排版內(nèi)容而言，黃金螺旋的軌跡同樣可以起到重要的作用。我們的視覺(jué)可以很自然地沿著黃金螺旋的軌跡運(yùn)動(dòng)，這也就是說(shuō)這樣設(shè)計(jì)的頁(yè)面布局會(huì)讓訪客更加自然地瀏覽內(nèi)容。

4、圖片：黃金比例和三分法

對(duì)于圖片而言，布局自然是很重要的，無(wú)論是用來(lái)傳遞信息還是呈現(xiàn)圖像布局的美感。黃金比例可以讓圖片變得更加吸引眼球，讓重要的信息脫穎而出。平時(shí)我們所說(shuō)的三分法布局，如何結(jié)合黃金比例，可以讓布局更漂亮。

參考上方的圖片，將頁(yè)面進(jìn)行黃金比例分割的四條線，線條兩兩交匯的地方是最吸引用戶的地方。當(dāng)然，我們常見(jiàn)的三分法是讓同一個(gè)方向上的兩條線將布局按照1：1: 1的比例分割開(kāi)來(lái)。

5、圖形：黃金比例圓形

黃金比例可以用來(lái)創(chuàng)建矩形也能用來(lái)創(chuàng)建比例協(xié)調(diào)的圓形。使用黃金比例不僅可以產(chǎn)生和諧的比例，而且能夠讓圖形保持較高的一致性。