淺析網(wǎng)頁設(shè)計中的視覺藝術(shù)處理

唐雨薇

[摘要]就網(wǎng)頁設(shè)計過程中所涉及到的視覺元素的藝術(shù)處理進行分析，主要嘗試從網(wǎng)頁設(shè)計的內(nèi)容與原則等方面，對這個新的藝術(shù)設(shè)計領(lǐng)域進行探討。

[關(guān)鍵詞]網(wǎng)頁藝術(shù)處理版面布局風(fēng)格設(shè)計色彩搭配

中圖分類號：TP3文獻標(biāo)識碼：A文章編號：1671－7597(2009)0210052－01

一、版面布局中藝術(shù)處理

從功能上來看，首頁主要承擔(dān)著樹立企業(yè)形象(當(dāng)然不僅僅是首頁)的作用，網(wǎng)站首頁是企業(yè)網(wǎng)上的虛擬門面。

設(shè)計首頁的第一步是設(shè)計版面布局。所謂版面，指的是瀏覽器看到的完整的一個頁面(可以包含框架和層)。所謂布局，是指以最適合瀏覽的方式將圖片和文字排放在頁面的不同位置。一般來說，網(wǎng)站首頁的形式有兩種，一種是形象展示型，這種類型文字信息較少，圖像信息較多，通過藝術(shù)造型和設(shè)計布局，將圖文組成一幅生動的畫面。另一種是信息羅列型，即在首頁中就羅列出網(wǎng)站的主要內(nèi)容分類、重點信息、網(wǎng)站導(dǎo)航、公司信息等等，這種風(fēng)格比較適合網(wǎng)站信息量大、內(nèi)容豐富的網(wǎng)站。無論采用何種形式，都可以遵循如下原則：

1、主次分明，中心突出。在一個頁面上，必然考慮視覺的中心，這個中心一般在屏幕的中央，或者在中間偏上的部位。這樣在頁面上就突出了重點，做到了主次有別。

2、大小搭配，相互呼應(yīng)。較長的文章或標(biāo)題，不要編排在一起，要有一定的距離，同樣，較短的文章，也不能編排在一起。對待圖片的安排也是這樣，要互相錯開，造成大小之間有一定的間隔，這樣可以使頁面錯落有致，避免重心的偏離。

3、圖文并茂，相得益彰。文字和圖片具有一種相互補充的視覺關(guān)系，頁面上文字太多，就顯得沉悶，缺乏生氣。最理想的效果是文字與圖片的密切配合，互為襯托，既能活躍頁面，又使主頁有豐富的內(nèi)容。

網(wǎng)站首頁的布局比較靈活，著重設(shè)計，而內(nèi)頁的版面布局主要是考慮導(dǎo)航、必要信息與正文之間的布局關(guān)系。在內(nèi)頁布局過程中，可遵循以下原則：

1、正常平衡——亦稱“勻稱”。多指左右、上下對照形式，主要強調(diào)秩序，能達到安定誠實、信賴的效果。

2、異常平衡——即非對照形式，但也要平衡和韻律，當(dāng)然都是不均整的，此種布局能達到強調(diào)性、不安性、高注目性的效果。

3、對比——所謂對比，不僅利用色彩、色調(diào)等技巧來做表現(xiàn)，在內(nèi)容上也可涉及古與今、新與舊、貧與富等對比。

4、凝視——所謂凝視是利用頁面中人物視線，使瀏覽者仿照跟隨的心理，以達到注視頁面的效果，一般多用明星凝視狀。

5、空白——空白有兩種作用，一方面對其他網(wǎng)站表示突出卓越，另一方面也表示網(wǎng)頁品位的優(yōu)越感，這種表現(xiàn)方法對體顯網(wǎng)頁的格調(diào)十分有效。

6、盡量用圖片解說——此法對不能用語言說服、或用語言無法表達的情感，特別有效。圖片解說的內(nèi)容，可以傳達給瀏覽者更多的心理因素。

以上的設(shè)計原則，雖然枯燥，但是我們?nèi)绻茴I(lǐng)會并活用到頁面布局里，效果就會大不一樣。比如：網(wǎng)頁的白色背景太虛，則可以加些色快；版面零散，可以用線條和符號串聯(lián)；左面文字過多，右面則可以插一張圖片保持平衡；表格太規(guī)矩，可以改用導(dǎo)角等等。

二、風(fēng)格設(shè)計中的藝術(shù)處理

首頁風(fēng)格的形成主要依賴于主頁的版式設(shè)計，依賴于頁面的色調(diào)處理，還有圖片與文字的組合形式等。如何統(tǒng)一網(wǎng)站風(fēng)格，除考慮上述首頁風(fēng)格外，更多的還應(yīng)在內(nèi)頁設(shè)計過程中考慮以下幾種設(shè)計方式：

1、結(jié)構(gòu)的一致性：網(wǎng)站的統(tǒng)一性在網(wǎng)站營銷中占重要地位，而網(wǎng)站結(jié)構(gòu)是網(wǎng)站風(fēng)格統(tǒng)一的重要手段，包括網(wǎng)站布局、文字排版、裝飾性元素出現(xiàn)的位置、導(dǎo)航的統(tǒng)一、圖片的位置等等。

2、色彩的一致性：方式是保持站點主體色彩的一致，只改變局部色塊，優(yōu)點是一個獨特色彩的網(wǎng)站會給人留下很深刻的印象，因為人的視覺對色彩要比布局更敏感，更容易在大腦中形成記憶符號。建議是選取一兩種主要色彩，幾種輔助色彩。

3、利用導(dǎo)航取得統(tǒng)一：導(dǎo)航是網(wǎng)站的一項重要組成部分，一個出色的富有企業(yè)特性的導(dǎo)航將會給人留下深刻的印象，比如將標(biāo)志的形態(tài)寓于導(dǎo)航之中。

4、特別元素的一致性：在網(wǎng)站設(shè)計中，個別具有特色的元素(如標(biāo)志、象征圖形、局部設(shè)計等)重復(fù)出現(xiàn)，也會給訪問者留下深刻印象。

5、利用圖像取得統(tǒng)一：網(wǎng)頁中的圖像在使用上一定要謹慎，尤其是一些與內(nèi)容無關(guān)的動畫不能使用在網(wǎng)頁中。這里我們所說的利用圖像取得統(tǒng)一，決不是在每頁中放置幾個動畫!而是根據(jù)網(wǎng)頁內(nèi)容的不同，配以相應(yīng)的圖像或動畫，從而給瀏覽者形成頁面的連續(xù)性。

6、利用背景取得統(tǒng)一：從技術(shù)上而言，網(wǎng)頁背景包括背景色和背景圖像兩種，一般提倡使用背景色或色塊而非背景圖像。原因很明顯，第一，背景色的下載速度比背景圖像的下載速度快；第二，顯示效果，圖像作為背景往往使得前面的文字很難辨認!給人一種很不舒服的感覺，讓人無法停留。那么什么適合網(wǎng)頁背景呢?一個好的建議是將公司的標(biāo)志、象征性的簡單圖片作為背景，并將其淡化，使瀏覽者在閱讀網(wǎng)站內(nèi)容的同時不經(jīng)意記下公司的標(biāo)志。

三、色彩搭配中的藝術(shù)處理

色彩是人的視覺中最敏感的東西，網(wǎng)頁中最難處理的也就是色彩搭配的問題了。在色彩的運用上，可以根據(jù)主頁內(nèi)容的需要，分別采用不同的主色調(diào)。網(wǎng)頁設(shè)計中色彩的使用原則一般有：

1、用一種色彩。這里是指先確定一種色彩，然后調(diào)整該色彩的透明度或者飽和度產(chǎn)生新的色彩(說得通俗些就是將色彩變淡或者加深)，用于網(wǎng)頁。這樣的頁面看起來色彩統(tǒng)一，有層次感。

2、用兩種色彩。先選定一種色彩，然后選擇它的對比色。

3、用一個相同色系。所謂相同色系，簡單的說就是同一個感覺的色彩，例如淡藍，淺藍、深藍；而在色相環(huán)上是指位置十分相近的色彩，這種色彩搭配的優(yōu)點是易于使網(wǎng)頁色彩趨于一致，容易塑造網(wǎng)頁和諧統(tǒng)一的氛圍，缺點是容易造成頁面的單調(diào)，因此往往利用局部加入對比色來增加變化，如局部對比色彩的圖片等。

充分運用色彩的這些特性，可以使我們的主頁具有深刻的藝術(shù)內(nèi)涵，從而提升網(wǎng)站的文化品位。根據(jù)色彩的心理感覺，下面介紹幾種常用的配色方案：

1、暖色調(diào)。即紅色、橙色、黃色、赭色等色彩的搭配。這種色調(diào)的運用，可使主頁呈現(xiàn)溫馨、和煦、熱情的氛圍。

2、冷色調(diào)。即青色、綠色、紫色等色彩的搭配。這種色調(diào)的運用，可使主頁呈現(xiàn)寧靜、清涼、高雅的氛圍。

3、對比色調(diào)。所謂對比色，是指色相環(huán)相距較遠，即把色性完全相反的色彩搭配在同一個空間里。例如：紅與綠、黃與紫、橙與藍等。這種色彩的搭配，可以產(chǎn)生強烈的視覺效果，給人亮麗、鮮艷、喜慶的感覺。當(dāng)然，對比色調(diào)如果用得不好，會適得其反，產(chǎn)生俗氣、刺眼的不良效果。這就要把握“大調(diào)和，小對比”這一個重要原則，即總體的色調(diào)應(yīng)該是統(tǒng)一和諧的，局部的地方可以有一些小的強烈對比。