網(wǎng)頁(yè)中的平衡、對(duì)比、連貫和留白

網(wǎng)頁(yè)設(shè)計(jì)中需要把握好很多原則和細(xì)節(jié)，今天我們來(lái)談?wù)劸W(wǎng)頁(yè)設(shè)計(jì)中的平衡、對(duì)比、連貫和留白。

一、平衡

如果你的頁(yè)面是平衡的，當(dāng)用戶(hù)瀏覽這個(gè)頁(yè)面的時(shí)候就會(huì)感覺(jué)它們是一個(gè)整體，看得時(shí)候目光的跳轉(zhuǎn)也會(huì)很自然。同時(shí)，構(gòu)成頁(yè)面的元素仍然是彼此獨(dú)立(注意不是孤立)的，你不需要用線用顏色將它們直接地串接起來(lái)，這是為什么呢?因?yàn)樗鼈儽舜酥g是平衡的。這就好比蹺蹺板，即便你看不到連接兩端的人的木板，你也能感覺(jué)到他們是一個(gè)整體，因?yàn)椤捌胶狻?

1、對(duì)稱(chēng)平衡

對(duì)稱(chēng)是最常見(jiàn)、最自然的平衡手段，這種方式通常用來(lái)設(shè)計(jì)比較正式的頁(yè)面，不過(guò)也還需要和下面介紹的多種方式結(jié)合起來(lái)使用。比如圖 1所示的網(wǎng)站，如果你在頁(yè)面正中間劃一條垂直向下的直線，你會(huì)發(fā)現(xiàn)頁(yè)面的兩邊的布局是基本對(duì)稱(chēng)。

2、非對(duì)稱(chēng)平衡

非對(duì)稱(chēng)其實(shí)并不是真正的“不對(duì)稱(chēng)”，而是一種層次更高的“對(duì)稱(chēng)”，如果把握不好頁(yè)面就會(huì)顯得亂，因此使用起來(lái)要慎重，更不可用的過(guò)濫。網(wǎng)站就打破了常見(jiàn)的對(duì)稱(chēng)。但是如果仔細(xì)看的話(huà)還是能夠感到某種“對(duì)稱(chēng)”的影子。

3、輻射平衡

頁(yè)面中的元素以某一個(gè)點(diǎn)為中心展開(kāi)就可以構(gòu)成輻射平衡。比如圖3就是典型的例子，頁(yè)面的正中是一個(gè)大大的LOGO，外側(cè)環(huán)繞著多個(gè)鏈接 。

4、實(shí)戰(zhàn)平衡

下面我們通過(guò)一個(gè)LOGO設(shè)計(jì)實(shí)例來(lái)看一看平衡的多種變化。

二、對(duì)比

如果說(shuō)平衡搭起了一個(gè)穩(wěn)定的頁(yè)面框架，那么對(duì)比就是這個(gè)框架中的動(dòng)態(tài)點(diǎn)綴。這里說(shuō)動(dòng)態(tài)并不是說(shuō)要真的讓元素動(dòng)起來(lái)，而是要有“變化”?？梢宰兓囊蛩匕?大小、顏色、字體、重心、形狀、紋理等等。 我們還是通過(guò)簡(jiǎn)單的例子來(lái)介紹一下對(duì)比的應(yīng)用，圖 9是我們?cè)O(shè)計(jì)的底版，字體一樣、大小一樣、顏色一樣，單調(diào)枯燥。

三、連貫

前面談到了對(duì)比，對(duì)比離不開(kāi)變化，然而如果對(duì)比太多，變化也會(huì)太多，頁(yè)面就會(huì)顯得零亂，因此我們現(xiàn)在來(lái)談“連貫”。在一個(gè)成功的頁(yè)面設(shè)計(jì)中，有很多要素是必須保持一致的，這些要素通常包括:

1、布局

頁(yè)面的上下、左右，頁(yè)面與頁(yè)面中間要保持布局一致。比如如果頁(yè)面上方的表格居中對(duì)齊而頁(yè)面下方的表格卻左對(duì)齊，那么整個(gè)頁(yè)面就會(huì)很難看。

2、字體

字體的大小、顏色應(yīng)當(dāng)基本保持一致。

3、導(dǎo)航欄

導(dǎo)航欄應(yīng)當(dāng)保持完全一樣，通常應(yīng)單單獨(dú)為導(dǎo)航欄建立一個(gè)框架頁(yè)，這樣就可以保證更新導(dǎo)航欄的時(shí)候，所有網(wǎng)頁(yè)都會(huì)被自動(dòng)更新。

四、留白

國(guó)畫(huà)中“畫(huà)魚(yú)不畫(huà)水”的妙處就是留白的妙處。留白可以讓訪問(wèn)者有更大的想象空間，就好像就如一個(gè)沒(méi)有過(guò)多擺設(shè)的房間一樣。上上下下、里里外外都塞得滿(mǎn)滿(mǎn)當(dāng)當(dāng)就是很糟糕的設(shè)計(jì)。

網(wǎng)站留白的原則包括:

1、元素之間的留白不能太大 這是基本的原則，留白過(guò)多，葉面會(huì)變得零碎。

2、文本中間的間隔不能太大 文本應(yīng)當(dāng)緊湊，尤其漢字文本，如果字與字之間或者行與行之間空白太大頁(yè)面就會(huì)非常難看。

總的來(lái)說(shuō)平衡、對(duì)比、連貫和留白設(shè)四條原則是在網(wǎng)頁(yè)設(shè)計(jì)中必須始終牢記，但絕不是教條，應(yīng)當(dāng)結(jié)合自己的實(shí)際需要靈活的應(yīng)用。

本文來(lái)源于成都網(wǎng)站建設(shè)公司與成都網(wǎng)站設(shè)計(jì)制作公司-創(chuàng)新互聯(lián)成都公司！

名稱(chēng)欄目：網(wǎng)頁(yè)中的平衡、對(duì)比、連貫和留白
網(wǎng)頁(yè)路徑：http://redsoil1982.com.cn/news8/321308.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供域名注冊(cè)、外貿(mào)網(wǎng)站建設(shè)、微信小程序、微信公眾號(hào)、網(wǎng)站改版、Google

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)