從字體設(shè)計(jì)到繪圖到頁面布局，總有一些適用于網(wǎng)頁或打印的一般設(shè)計(jì)原則。然而，在網(wǎng)頁設(shè)計(jì)方面，許多本應(yīng)該搞砸的規(guī)則，只是按照感覺。這并不是說設(shè)計(jì)師在規(guī)則上松懈，而是大多數(shù)網(wǎng)絡(luò)工作者不知道遵循這些規(guī)則。——即使他們知道，他們也不知道如何使用它們。

結(jié)合網(wǎng)頁，它是以下內(nèi)容：

平 衡

平衡感很難處理。網(wǎng)頁上顯示的余額有兩個(gè)——對稱性和不對稱性。我們非常習(xí)慣于看到對稱的圖片，就像我們小時(shí)候剪紙花一樣，我們將它們一起切割，使開口對稱。這種對稱平衡是公認(rèn)的（無論如何都存在鏡面反射），并且難以在不對稱組合物中平衡。

舉兩個(gè)例子:

圖1減法

不對稱平衡

圖1顯示了多個(gè)位置的非對稱平衡的一些重要原則。你看，狗的照片是主橫幅——狗身上的黑色是在屏幕的左側(cè)。此時(shí)，屏幕右側(cè)出現(xiàn)X.這似乎是一個(gè)隨機(jī)的灰色X，但是平衡圖片的關(guān)鍵因素！通過這種方式，您的視線將涉及圖片的中間。除了橫幅圖之外，這種設(shè)計(jì)還出現(xiàn)在網(wǎng)頁的標(biāo)題中?！藛螜诘拇笮『皖伾鄬^大。然后在減法標(biāo)識中，應(yīng)用黑白背景，并在頂部添加黑線，使得上側(cè)和下側(cè)相對平衡。

圖2蘋果

對稱平衡

Apple是在現(xiàn)代網(wǎng)頁中實(shí)現(xiàn)對稱平衡的典范。如圖2所示，每個(gè)元素排列在中心軸的兩側(cè)，形成視覺上和諧的場景。

比 例

對于網(wǎng)頁元素，它不是那么清晰，或者文本有多長，它的布局和網(wǎng)頁平衡在視覺上強(qiáng)調(diào)誰與它有很多關(guān)系。

Tumbrl

如何權(quán)衡這些元素的大小與每個(gè)元素的性質(zhì)密切相關(guān)。例如，當(dāng)您瀏覽兩列頁面時(shí)，通常會發(fā)現(xiàn)右側(cè)的框大于左側(cè)的框。還要在其中加入一些關(guān)鍵信息。這取決于人們的視覺習(xí)慣?！词刮谋究蚍旁谧髠?cè)，目錄的元數(shù)據(jù)也會放在右側(cè)，它會無意識地向右看。因此，占用右側(cè)的元數(shù)據(jù)是不科學(xué)的。有些人喜歡每列寬度相同的網(wǎng)格布局，就像圖1中的那樣;其他人可能喜歡黃金比例，這是右邊方框的1.62倍。

一些網(wǎng)頁的設(shè)計(jì)只與重要性成正比：

尾

在此頁面上，元素的比例得到了很好的控制。視覺水平不僅非常好，而且意義水平也非常好。從產(chǎn)品標(biāo)識（1）開始，然后引導(dǎo)用戶的行為（2），然后到文本密集型相關(guān)介紹（3），安排是非常合理的。文本混合的區(qū)域，標(biāo)題的權(quán)重與正文分開，與左側(cè)圖標(biāo)的關(guān)系非常明顯。當(dāng)您瀏覽此頁面時(shí)，您會感覺整體非常協(xié)調(diào)。

但是，上面的示例有點(diǎn)舊，網(wǎng)頁非常扁平。

今天的網(wǎng)頁可以交互式設(shè)計(jì)，以提高網(wǎng)頁上的演示文稿的比例。

例如，國際廣告獎D＆amp; AD的網(wǎng)站，當(dāng)滑動內(nèi)頁時(shí)，菜單欄到頁面的比例會相對減少，這樣人們的注意力會集中在中間部分，更加注重閱讀內(nèi)容。