網(wǎng)頁設(shè)計(jì)中信息傳遞和視覺傳達(dá)的統(tǒng)一

邵雪鶴

摘要：文章本著信息傳遞和視覺表達(dá)相結(jié)合的理念，對(duì)當(dāng)前網(wǎng)頁設(shè)計(jì)中存在的問題進(jìn)行了歸納，并從美學(xué)原理和技術(shù)因素雙方面入手提供了優(yōu)化設(shè)計(jì)的原則。

關(guān)鍵詞：網(wǎng)頁設(shè)計(jì)；信息 ；視覺

網(wǎng)頁設(shè)計(jì)并不僅僅是腳本編程，它也屬于平面設(shè)計(jì)在信息時(shí)代的延續(xù)。其特點(diǎn)在于網(wǎng)頁是一個(gè)動(dòng)態(tài)交互的視覺平臺(tái)，以超媒體的形式，向用戶傳遞非線性的信息流。設(shè)計(jì)者需要具有信息無二義的表達(dá)能力和善于引導(dǎo)用戶視覺注意力的藝術(shù) ，保證用戶迅速從某個(gè)網(wǎng)頁中捕捉到所需的信息。故網(wǎng)頁設(shè)計(jì)是一項(xiàng)現(xiàn)代數(shù)字科技與傳統(tǒng)人文美學(xué)相結(jié)合的創(chuàng)造性智力活動(dòng)。當(dāng)前的網(wǎng)頁設(shè)計(jì)雖然不乏精品，但還存在著諸多問題，影響了人們?cè)诰W(wǎng)絡(luò)沖浪時(shí)的滿意度，并使信息流動(dòng)偏離了人們預(yù)期的軌道，也給設(shè)計(jì)人員帶來了挫折感。本文從分析現(xiàn)存的問題入手，提出網(wǎng)頁設(shè)計(jì)的幾個(gè)基本原則，以實(shí)現(xiàn)信息傳遞和視覺傳達(dá)的統(tǒng)一。

一、當(dāng)前網(wǎng)頁設(shè)計(jì)中存在的問題

（一）視覺元素的堆砌和信息內(nèi)容的缺失

網(wǎng)頁中除了包括平面視覺構(gòu)成的各個(gè)元素和布局機(jī)制，還包括了動(dòng)態(tài)、多媒體、交互元素等網(wǎng)頁特有的視覺元素。但是大量有欠規(guī)劃、缺乏審美意識(shí)的設(shè)計(jì)卻以簡(jiǎn)單的堆砌浪費(fèi)了這些資源。雜亂無章的文字、圖片、動(dòng)畫、廣告窗口、色塊，都在挑戰(zhàn)用戶瀏覽網(wǎng)頁時(shí)的耐性極限。網(wǎng)絡(luò)倡導(dǎo)注意力，但是只有賞心悅目的才能夠吸引眼球，且形式和內(nèi)容缺一不可。而某些設(shè)計(jì)精美的網(wǎng)頁卻像花瓶一樣，在觀賞者對(duì)其美麗的容貌嘖嘖贊嘆后，發(fā)現(xiàn)其空洞無物。

（二）商業(yè)利益帶來的干擾

由于商業(yè)利益上的考慮，某些網(wǎng)站的設(shè)計(jì)者故意誘使用戶不斷刷新網(wǎng)頁或點(diǎn)擊廣告，或者將真正的資源鏈接隱藏在不被注意的位置，使用戶更多地將目光放在廣告區(qū)域。某些國內(nèi)網(wǎng)站首頁，經(jīng)常存在懸浮的廣告圖片，擋住了下層的頁面內(nèi)容。這些蓄意干擾，是網(wǎng)頁設(shè)計(jì)的大忌。畢竟用戶只有方便地從網(wǎng)站獲取利益之后，才樂意給予回饋。

（三）千篇一律的模仿喪失了獨(dú)立創(chuàng)造性

賽博空間是個(gè)雙刃劍。在帶來技術(shù)和藝術(shù)創(chuàng)新的同時(shí)，也使得跟風(fēng)模仿更加方便。缺乏獨(dú)立創(chuàng)造性一直是國內(nèi)網(wǎng)頁設(shè)計(jì)的軟肋。每個(gè)夢(mèng)想成為楊致遠(yuǎn)的人都匆匆忙忙地搭建網(wǎng)站開始叫賣。急功近利的結(jié)果是肆意模仿抄襲。千篇一律的網(wǎng)頁沒有給用戶帶來欣賞藝術(shù)品的愉悅感，而能與人內(nèi)心深處情感共鳴的設(shè)計(jì)才是好的藝術(shù)設(shè)計(jì)。

（四）動(dòng)態(tài)交互網(wǎng)頁設(shè)計(jì)中的界面友好性問題

網(wǎng)頁是活的，它具有交互性，可根據(jù)用戶指令的變化，顯示的信息內(nèi)容和樣式產(chǎn)生很大的區(qū)別；它還有動(dòng)態(tài)性，如圖片和文本等內(nèi)容可隨時(shí)間變化而自動(dòng)刷新替換。且網(wǎng)頁內(nèi)部可通過錨點(diǎn)進(jìn)行跳轉(zhuǎn)，網(wǎng)頁之間也可以通過超鏈接進(jìn)行跳轉(zhuǎn)。不負(fù)責(zé)任的設(shè)計(jì)可能使得用戶在變幻莫測(cè)的網(wǎng)頁元素中迷失自己的初衷。

（五）技術(shù)因素帶來的視覺尷尬

網(wǎng)頁中包含的圖片、影像、文字等媒體內(nèi)容需要通過專門的軟件（瀏覽器）在計(jì)算機(jī)屏幕上來顯示。即它的觀賞效果不僅由設(shè)計(jì)師和出版單位決定，還受到了用戶軟硬件（瀏覽器和顯示器的）的約束。設(shè)計(jì)時(shí)機(jī)器和瀏覽時(shí)機(jī)器的分辨率差異會(huì)導(dǎo)致網(wǎng)頁面容皆非。要觀賞flash動(dòng)畫等媒體形式，必須安裝特定的插件程序，否則將顯示空白框和提示文字給用戶，就像被遮去了頭部的蒙娜麗莎，極大地破壞了設(shè)計(jì)師的設(shè)計(jì)初衷和作品的美感。另外，不同的瀏覽器產(chǎn)品對(duì)同一網(wǎng)頁的顯示效果也有差別，用戶常需切換瀏覽器以達(dá)到最佳欣賞效果。

二、如何進(jìn)行有效的網(wǎng)頁設(shè)計(jì)

（一）傳統(tǒng)平面設(shè)計(jì)美學(xué)原理的設(shè)計(jì)原則

文字作為最原始、最有力的信息傳遞方式，在網(wǎng)頁設(shè)計(jì)中至關(guān)重要。通常可在CSS（層疊樣式表）中為字體指定多個(gè)方案，并默認(rèn)為機(jī)器常用字體如宋體。這樣可使網(wǎng)頁在安裝了相關(guān)字體的機(jī)器上顯示獨(dú)特的效果卻不影響標(biāo)配機(jī)器的使用。大小指定為印刷字號(hào)如12px，顏色要視背景色而定，原則上以能看清且與整個(gè)頁面搭配和諧為準(zhǔn)。顏色搭配要避免產(chǎn)生視覺疲勞，如黑字配白底能保證用戶長(zhǎng)時(shí)間地瀏覽網(wǎng)頁而不厭煩。色彩，在一個(gè)頁面不應(yīng)超過三個(gè)，其中擇一為主色調(diào)；應(yīng)恰當(dāng)使用顏色蘊(yùn)含的文化心理信息，如綠色表示環(huán)保、藍(lán)色表示科技，年輕人喜歡鮮艷的顏色、老年人喜歡灰色系、女性喜歡粉色系等；注意色彩的功能性，如藍(lán)色表示超鏈接，紅色表示刪除等警示操作；要注意色彩的誘目性及視認(rèn)性，如彩度高鮮艷的顏色可以用于提示標(biāo)題、關(guān)鍵字和當(dāng)前活動(dòng)區(qū)域，并且注意色彩的搭配和諧，還需要注意色彩的周期性，即色彩的定義會(huì)因時(shí)因地因人產(chǎn)生不同解讀。

網(wǎng)頁布局大致可分為“國”字型、拐角型、標(biāo)題正文型、左右框架型、上下框架型、綜合框架型、封面型、Flash型、變化型等。如果信息內(nèi)容多，可以用國字型或拐角型；雅虎就是典型的“國”字型。綱要性的網(wǎng)頁可以考慮標(biāo)題正文型；框架結(jié)構(gòu)的一個(gè)共同特點(diǎn)就是瀏覽方便、速度快，但結(jié)構(gòu)變化不靈活；對(duì)于企業(yè)宣傳和個(gè)人簡(jiǎn)歷而言，封面型是首選布局；Flash型則更靈活，但是不能表達(dá)過多的文字信息。由于網(wǎng)頁不像紙張有版面限制，所以應(yīng)把盡可能多的信息集中在一個(gè)頁面上，做到一目了然；對(duì)必須分屏的頁面也應(yīng)統(tǒng)一風(fēng)格。

（二）對(duì)新型媒體的設(shè)計(jì)要求

若帶寬允許，多媒體元素必能增加設(shè)計(jì)的情趣和個(gè)性，否則弄巧成拙，將影響用戶對(duì)目的信息的及時(shí)獲取。如應(yīng)避免“Gif”圖片、flash動(dòng)畫過大而增加網(wǎng)頁下載時(shí)間，分散觀眾對(duì)網(wǎng)站其他信息的注意力。有些網(wǎng)站大量地使用誘人的Flash技術(shù)，但其漫長(zhǎng)的等待下載和令人迷惑的結(jié)構(gòu)讓用戶難以忍受，不得不“暫時(shí)停止?fàn)I運(yùn)”。網(wǎng)頁設(shè)計(jì)還要注意瀏覽器的兼容性，設(shè)計(jì)人員應(yīng)當(dāng)針對(duì)不同系統(tǒng)平臺(tái)和軟件環(huán)境進(jìn)行測(cè)試。

（三）針對(duì)網(wǎng)頁的交互動(dòng)態(tài)性

網(wǎng)頁并非繪畫雕塑不可修改，其發(fā)布并非設(shè)計(jì)工作的終結(jié)。而應(yīng)根據(jù)網(wǎng)站各個(gè)階段的經(jīng)營(yíng)目標(biāo)，以及用戶的反饋信息，經(jīng)常地對(duì)網(wǎng)頁進(jìn)行調(diào)整和修改，這就需要設(shè)計(jì)者在保持網(wǎng)站視覺形象一貫性的基礎(chǔ)上，不斷創(chuàng)作出新的網(wǎng)頁設(shè)計(jì)作品。

（四）設(shè)計(jì)良好的導(dǎo)航系統(tǒng)

網(wǎng)絡(luò)導(dǎo)航可以解決網(wǎng)頁設(shè)計(jì)的非線性瀏覽問題。對(duì)于網(wǎng)頁設(shè)計(jì)者來說，面對(duì)的不是按順序排列的印刷頁面，而是自由分散的網(wǎng)頁。因此必須考慮構(gòu)建合理的頁面組織結(jié)構(gòu)，理清網(wǎng)頁內(nèi)容之間的關(guān)系，以有限清晰的鏈接進(jìn)行組織；建立包括站點(diǎn)索引，幫助頁面，查詢功能，網(wǎng)站地圖在內(nèi)的導(dǎo)航系統(tǒng)；當(dāng)用戶瀏覽每個(gè)頁面時(shí)，清晰醒目的提示本頁面所在位置，并且提供返回主頁面的鏈接和的歷史瀏覽的導(dǎo)航服務(wù)。

參考文獻(xiàn) ：

[1]黃海燕，張輝.網(wǎng)頁設(shè)計(jì)和平面設(shè)計(jì)[J].包裝工程，2004（1）

[2]袁璐.論網(wǎng)頁 藝術(shù) 設(shè)計(jì)的人性化[J].武漢科技學(xué)院學(xué)報(bào)，2005（11）

[3]張雪艷.初探色彩與網(wǎng)頁設(shè)計(jì)[J].吉林工程技術(shù)師范學(xué)院學(xué)報(bào)，2005（5）

[4]蘇玉蒼.網(wǎng)頁視覺藝術(shù)的探討[J].甘肅科技，2005（3）endprint