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

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

一、平衡

如果你的頁面是平衡的，當(dāng)用戶瀏覽這個頁面的時候就會感覺它們是一個整體，看得時候目光的跳轉(zhuǎn)也會很自然。同時，構(gòu)成頁面的元素仍然是彼此獨立(注意不是孤立)的，你不需要用線用顏色將它們直接地串接起來，這是為什么呢?因為它們彼此之間是平衡的。這就好比蹺蹺板，即便你看不到連接兩端的人的木板，你也能感覺到他們是一個整體，因為“平衡”!

1、對稱平衡

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

2、非對稱平衡

非對稱其實并不是真正的“不對稱”，而是一種層次更高的“對稱”，如果把握不好頁面就會顯得亂，因此使用起來要慎重，更不可用的過濫。網(wǎng)站就打破了常見的對稱。但是如果仔細看的話還是能夠感到某種“對稱”的影子。

3、輻射平衡

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

4、實戰(zhàn)平衡

下面我們通過一個LOGO設(shè)計實例來看一看平衡的多種變化。

二、對比

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

三、連貫

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

1、布局

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

2、字體

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

3、導(dǎo)航欄

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

四、留白

國畫中“畫魚不畫水”的妙處就是留白的妙處。留白可以讓訪問者有更大的想象空間，就好像就如一個沒有過多擺設(shè)的房間一樣。上上下下、里里外外都塞得滿滿當(dāng)當(dāng)就是很糟糕的設(shè)計。

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

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

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

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

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

名稱欄目：網(wǎng)頁中的平衡、對比、連貫和留白
網(wǎng)頁路徑：http://www.rwnh.cn/news8/321308.html

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

廣告

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