【摘 要】 網(wǎng)頁(yè)設(shè)計(jì)在網(wǎng)絡(luò)高速發(fā)展的今天已經(jīng)成為重要的設(shè)計(jì)門(mén)類(lèi)，不僅是對(duì)平面視覺(jué)傳達(dá)設(shè)計(jì)美學(xué)的一種繼承和延伸，更是藝術(shù)與技術(shù)的高度統(tǒng)一。作者以哈爾濱商業(yè)大學(xué)設(shè)計(jì)藝術(shù)學(xué)院網(wǎng)頁(yè)設(shè)計(jì)為例分析網(wǎng)頁(yè)的平面設(shè)計(jì)，嘗試從平面藝術(shù)設(shè)計(jì)的內(nèi)容、原則和形式美等方面分析；從網(wǎng)頁(yè)的色彩設(shè)計(jì)和網(wǎng)頁(yè)心理學(xué)方面分析，對(duì)這個(gè)新的藝術(shù)設(shè)計(jì)領(lǐng)域進(jìn)行初步的歸納總結(jié)和理論探討。
【關(guān)鍵詞】 網(wǎng)頁(yè)與平面設(shè)計(jì)　色彩　心理學(xué)
１　網(wǎng)頁(yè)的平面設(shè)計(jì)
每個(gè)網(wǎng)站都是由諸多網(wǎng)頁(yè)構(gòu)成，故網(wǎng)頁(yè)是構(gòu)成互聯(lián)網(wǎng)的基本元素。我國(guó)這兩年的網(wǎng)絡(luò)發(fā)展非?？?，網(wǎng)站數(shù)量也以倍率增長(zhǎng)，然而網(wǎng)頁(yè)的設(shè)計(jì)卻不容樂(lè)觀。除了一些大的專(zhuān)業(yè)網(wǎng)站在版面的編排上比較講究之外，其他很少見(jiàn)到界面設(shè)計(jì)考究、美術(shù)創(chuàng)意優(yōu)秀的中文網(wǎng)站，這是因?yàn)闆](méi)有和平面設(shè)計(jì)緊密結(jié)合。網(wǎng)頁(yè)本身就是無(wú)數(shù)個(gè)“頁(yè)面”的平面，平面設(shè)計(jì)規(guī)則也適用網(wǎng)頁(yè)設(shè)計(jì)，網(wǎng)頁(yè)設(shè)計(jì)的審美需求是對(duì)平面視覺(jué)傳達(dá)設(shè)計(jì)美學(xué)的一種繼承和延伸。兩者的表現(xiàn)形式和目的都有一定的相似性，把傳統(tǒng)平面設(shè)計(jì)中美的形式規(guī)律同現(xiàn)代的網(wǎng)頁(yè)設(shè)計(jì)的具體問(wèn)題相結(jié)合起來(lái)，才能設(shè)計(jì)出符合審美規(guī)則的網(wǎng)頁(yè)。故設(shè)計(jì)者應(yīng)該巧妙利用平面設(shè)計(jì)的設(shè)計(jì)規(guī)則，結(jié)合網(wǎng)絡(luò)媒體的特點(diǎn)，認(rèn)識(shí)網(wǎng)絡(luò)，了解平面的特征，才能使網(wǎng)頁(yè)更加適合于網(wǎng)絡(luò)上的傳播。
平面設(shè)計(jì)中如變化和統(tǒng)一、條理與反復(fù)、對(duì)比和調(diào)和、均齊與平衡等，對(duì)網(wǎng)頁(yè)中文字、圖形、色彩的設(shè)計(jì)都是十分有效的視覺(jué)規(guī)律。首先，網(wǎng)頁(yè)的內(nèi)容與形式的表現(xiàn)必須統(tǒng)一和具有秩序，形式表現(xiàn)必須服從內(nèi)容要求，網(wǎng)頁(yè)上的各種構(gòu)成要素之間的視覺(jué)流程，能自然而有序地達(dá)到信息訴求的重點(diǎn)位置。在我們把大量的信息塞到網(wǎng)頁(yè)上去的時(shí)候，考慮怎樣把它們以合理的統(tǒng)一的方式來(lái)排布，使整體感強(qiáng)的同時(shí)又要有變化，怎樣使它們脈絡(luò)清楚又富有清晰的視覺(jué)效果等等。例如哈爾濱商業(yè)大學(xué)設(shè)計(jì)藝術(shù)學(xué)院網(wǎng)頁(yè)設(shè)計(jì)之歡迎界面，在黃色的背景襯托下，各種線(xiàn)條貫穿其中，運(yùn)用平面設(shè)計(jì)中的圖形設(shè)計(jì)加以修飾，增加網(wǎng)頁(yè)設(shè)計(jì)的美感和大眾的視覺(jué)審美需求。符合設(shè)計(jì)學(xué)院的設(shè)計(jì)的理念，又有學(xué)術(shù)機(jī)構(gòu)的沉穩(wěn)。內(nèi)容與形式的表現(xiàn)達(dá)到了高度的統(tǒng)一。其次，突出主題要素，必須在眾多構(gòu)成要素中突出一個(gè)清楚的主體，它應(yīng)盡可能地成為閱讀時(shí)視線(xiàn)流動(dòng)的起點(diǎn)。哈爾濱商業(yè)大學(xué)設(shè)計(jì)藝術(shù)學(xué)院網(wǎng)頁(yè)設(shè)計(jì)之主頁(yè)設(shè)計(jì)作為設(shè)計(jì)的主體，如果沒(méi)有這個(gè)主體要素，瀏覽者的視線(xiàn)將會(huì)無(wú)所適從，或者導(dǎo)致視線(xiàn)流動(dòng)偏離設(shè)計(jì)的初衷。主頁(yè)設(shè)計(jì)中各構(gòu)成要素在組合時(shí)，要注意其結(jié)構(gòu)的輕重大小、虛實(shí)、多少等對(duì)比因素，加強(qiáng)視覺(jué)力度，以強(qiáng)化頁(yè)面的整體吸引力。再次，網(wǎng)頁(yè)版式的新意，網(wǎng)頁(yè)的版式設(shè)計(jì)同報(bào)刊雜志等平面媒體的版式設(shè)計(jì)有很多共同之處，它在網(wǎng)頁(yè)的藝術(shù)設(shè)計(jì)中占據(jù)著重要的地位。所謂網(wǎng)頁(yè)的版式設(shè)計(jì)，是在有限的屏幕空間上將視聽(tīng)多媒體元素進(jìn)行有機(jī)的排列組合，將理性思維個(gè)性化地表現(xiàn)出來(lái)，是一種具有個(gè)人風(fēng)格和藝術(shù)特色的視聽(tīng)傳達(dá)方式，它在傳達(dá)信息的同時(shí)，也產(chǎn)生感官上的美感和精神上的享受。哈爾濱商業(yè)大學(xué)設(shè)計(jì)藝術(shù)學(xué)院網(wǎng)頁(yè)設(shè)計(jì)的版式設(shè)計(jì)賦予了很多心意，版面運(yùn)用歡快輕盈的風(fēng)格進(jìn)行設(shè)計(jì)，打破常理設(shè)計(jì)規(guī)范，有鮮明的節(jié)奏感，給人以生機(jī)盎然的感受，版面中的文字和圖片利用線(xiàn)條隔開(kāi)，主題突出，追求某種富于活力的圖文編排與設(shè)計(jì)。
２　網(wǎng)頁(yè)視覺(jué)設(shè)計(jì)中色彩的設(shè)計(jì)
網(wǎng)頁(yè)的色彩，是最先也是最持久地給瀏覽者以網(wǎng)站形象的因素，瀏覽者在瀏覽網(wǎng)頁(yè)時(shí)，留下的第一印象就是頁(yè)面的色彩設(shè)計(jì)。色彩本身是無(wú)任何含義的，有的只是人賦予它的。但色彩確實(shí)可以在不知不覺(jué)間影響人的心理，左右人的情緒，所以就有人給各種色彩都加上特定的含義：紅色：強(qiáng)有力、喜慶的色彩，很容易使人有興奮感覺(jué)，是一種雄壯的精神體現(xiàn)；黃色：亮度最高的色，給人感覺(jué)就是很有溫暖感；綠色：美麗、優(yōu)雅，給人感覺(jué)大度、寬容；藍(lán)色：永恒、博大，給人感覺(jué)平靜、理智；紫色：神秘、女性、溫柔、冒險(xiǎn)；黑色：有時(shí)給人沉默、虛空的感覺(jué)，但有時(shí)也給人一種莊嚴(yán)肅穆的感覺(jué)；白色：有時(shí)給人無(wú)盡的希望感覺(jué)，但有時(shí)也給人一種恐懼和悲哀的感受；灰色：具有中庸、平凡、溫和、謙讓、中立和高雅的感覺(jué)。網(wǎng)頁(yè)的色彩使用得當(dāng)可以產(chǎn)生強(qiáng)烈的視覺(jué)效果，使頁(yè)面更加生動(dòng)。巧妙使用色彩可以直接影響閱讀者的觀賞興趣，因此，色彩設(shè)計(jì)在網(wǎng)頁(yè)設(shè)計(jì)中居于十分重要的地位。網(wǎng)頁(yè)的色彩設(shè)計(jì)應(yīng)把握以下幾個(gè)方面：
2.1　確定主體色。確定一個(gè)主色調(diào)，可以有利于體現(xiàn)網(wǎng)站主題，遵循主從關(guān)系，這是最穩(wěn)定的處理色彩原則，在網(wǎng)頁(yè)設(shè)計(jì)頁(yè)面上，除白色為背景外大量使用的顏色，就是這個(gè)網(wǎng)頁(yè)的主體顏色。如果在同一個(gè)頁(yè)面內(nèi)運(yùn)用了多種顏色，把握不好的話(huà)，就無(wú)法確定哪個(gè)是主體色。因?yàn)槠渌念伾娣e不能過(guò)大，要遵循主從關(guān)系。我們現(xiàn)在看到的網(wǎng)頁(yè)，一般以淺顏色為背景的居多，如淺灰色、淺黃色、淺藍(lán)色、淺綠色。以淺顏色為底，哈爾濱商業(yè)大學(xué)設(shè)計(jì)藝術(shù)學(xué)院網(wǎng)頁(yè)的主體色就是以淺黃色、淺藍(lán)色為主色調(diào)，整體感覺(jué)柔和、素淡，配上深顏色的字，如黑色，讀來(lái)自然、流暢，也有利于突出頁(yè)面的重點(diǎn)，有利于整個(gè)頁(yè)面的配色，更容易為大多數(shù)人認(rèn)可和掌握。
其他一些次要內(nèi)容，如背景圖片、線(xiàn)條適宜采用不搶眼的顏色，以免喧賓奪主。只有少量精心選擇的元素，為了突出強(qiáng)調(diào)主頁(yè)的視覺(jué)效果，題頭部分采用明亮的色彩，這些彩色亮點(diǎn)就會(huì)產(chǎn)生強(qiáng)烈的視覺(jué)沖擊，并有設(shè)計(jì)藝術(shù)學(xué)院的特色。
2.2　背景色處理。在背景的色調(diào)搭配上一定要注意不能有強(qiáng)烈的對(duì)比，特別是同時(shí)使用色彩對(duì)立的顏色。大面積顏色適宜采用低比度，因?yàn)檫^(guò)于豐富的背景色彩會(huì)影響前景圖片和文字的取色，嚴(yán)重時(shí)會(huì)使文字溶于背景中，不易辨識(shí)。所以，背景一般應(yīng)以單純?yōu)橐?。如果需要一定的變化以增加背景的厚度，也?yīng)是在盡量統(tǒng)一的前提下的一種變化。例如在制用標(biāo)題時(shí)，為追求醒目的視覺(jué)效果，可用比較深的顏色，配上對(duì)比鮮明的字體。實(shí)際上背景的作用主要在于統(tǒng)一整個(gè)網(wǎng)頁(yè)的風(fēng)格和情調(diào)，對(duì)視覺(jué)的主體起到一定的襯托和協(xié)調(diào)作用，一方面吸引網(wǎng)民的注意力，另一方面有助于體現(xiàn)網(wǎng)站的主題。對(duì)一些明度較高的網(wǎng)站，配以黑色，可以適當(dāng)?shù)亟档推涿鞫?。白色是網(wǎng)站用的最普遍的一種顏色。很多網(wǎng)站甚至留出大塊的白色空間，作為網(wǎng)站的一個(gè)組成部分，這就是留白藝術(shù)。哈爾濱商業(yè)大學(xué)設(shè)計(jì)藝術(shù)學(xué)院網(wǎng)頁(yè)設(shè)計(jì)的二級(jí)界面就較多運(yùn)用留白藝術(shù)。留白，給人一個(gè)遐想的空間，讓人感覺(jué)心情舒適，暢快，恰當(dāng)?shù)牧舭讓?duì)于協(xié)調(diào)頁(yè)面的均衡起到相當(dāng)大的作用。
2.3　頁(yè)面的色彩分配。網(wǎng)頁(yè)標(biāo)題是網(wǎng)站的指路燈，瀏覽者要在網(wǎng)頁(yè)間跳轉(zhuǎn)，要了解網(wǎng)站的結(jié)構(gòu)，哈爾濱商業(yè)大學(xué)設(shè)計(jì)藝術(shù)學(xué)院網(wǎng)頁(yè)設(shè)計(jì)的導(dǎo)航設(shè)計(jì)利用頁(yè)面中的一些小標(biāo)題，使用稍微具有跳躍性的色彩，吸引瀏覽者的視線(xiàn)，讓他們感覺(jué)網(wǎng)站清晰明了，層次分明。網(wǎng)頁(yè)標(biāo)志是宣傳網(wǎng)站最重要的部分之一，所以這兩個(gè)部分一定要在頁(yè)面上突迎而出。怎樣做到這一點(diǎn)呢？LOGO和BANNER設(shè)計(jì)來(lái)源是哈爾濱商業(yè)大學(xué)設(shè)計(jì)藝術(shù)學(xué)院標(biāo)志，鮮亮、對(duì)比強(qiáng)烈的標(biāo)志設(shè)計(jì)寓意哈爾濱商業(yè)大學(xué)設(shè)計(jì)學(xué)院的設(shè)計(jì)精神和學(xué)術(shù)精神，LOGO和BANNER的色彩跟網(wǎng)頁(yè)的主題色分離開(kāi)來(lái)，突出主題。網(wǎng)頁(yè)文字是網(wǎng)頁(yè)傳遞信息的主體，如果一個(gè)網(wǎng)站用了背景顏色，必須要考慮到背景顏色的用色，與前景文字的搭配等問(wèn)題。一般的網(wǎng)站側(cè)重的是文字，所以背景可以選擇純度或者明度較低的色彩，文字用較為突出的亮色。讓人一目了然。設(shè)計(jì)藝術(shù)學(xué)院網(wǎng)頁(yè)頁(yè)面當(dāng)中的文字設(shè)計(jì)并沒(méi)有使用大眾的黑色，在白色背景的襯托下，深灰色的文字既有利于讀者的閱讀，又賦予了活躍的氣氛。導(dǎo)航菜單所在區(qū)域是網(wǎng)民利用率比較高的，把菜單背景顏色設(shè)置暗一些，然后依靠較高的顏色對(duì)比度、比較強(qiáng)烈的圖形元素或獨(dú)特的字體將網(wǎng)頁(yè)內(nèi)容和菜單的不同目的準(zhǔn)確地區(qū)分開(kāi)。頁(yè)腳，這一項(xiàng)最不重要，不應(yīng)該喧賓奪主?？梢钥紤]和側(cè)欄相同的顏色，設(shè)計(jì)學(xué)院的頁(yè)腳稍微壓了一下深一些的顏色，也可以在配色上使用一些比較跳躍的顏色，用來(lái)引導(dǎo)視線(xiàn)。
３　心理學(xué)與網(wǎng)頁(yè)設(shè)計(jì)
人類(lèi)在互通信息的同時(shí)也在交換彼此的情緒，如果沒(méi)有好的溝通情緒，所謂話(huà)不投機(jī)半句多，雙方可能說(shuō)沒(méi)有兩句話(huà)就結(jié)束談話(huà)了。因此若要利用網(wǎng)絡(luò)的方式做有效的溝通，則必須讓溝通雙方有臨場(chǎng)感，并引起彼此“良好溝通情緒”。由于網(wǎng)頁(yè)在計(jì)算機(jī)屏幕上呈現(xiàn)給別人視覺(jué)畫(huà)面，因此一方面觀者要學(xué)習(xí)從計(jì)算機(jī)畫(huà)面上看見(jiàn)信息；另一方面網(wǎng)頁(yè)設(shè)計(jì)者要了解觀者的“看見(jiàn)”的能力，從而設(shè)計(jì)能使人易懂的畫(huà)面，協(xié)助觀者能看見(jiàn)信息。由此就涉及到一個(gè)認(rèn)知的過(guò)程。認(rèn)知心理學(xué)可以定義為：為了解人類(lèi)行為，而對(duì)人類(lèi)心智歷程及結(jié)構(gòu)所作的科學(xué)分析。認(rèn)知心理學(xué)的主要理論架構(gòu)是“信息處理模式”。這個(gè)模式視人類(lèi)為主動(dòng)的信息處理者，探討人類(lèi)憑感官接受信息、貯存信息以及提取、運(yùn)用信息等不同階段所發(fā)生的事，所以認(rèn)知心理學(xué)也常被稱(chēng)做“信息處理心理學(xué)”。而對(duì)于信息，感官記憶可貯存大量的信息，只是若不予以注意，信息很快就會(huì)失去。所以要進(jìn)一步“注意”，作“圖樣辨識(shí)”，選擇需要的感官信號(hào)做進(jìn)一步的處理。一般說(shuō)來(lái)，感覺(jué)刺激很少的信息很難被記憶，而那些能引起人們很強(qiáng)感覺(jué)刺激的信息很容易被人記憶。而現(xiàn)今社會(huì)是一個(gè)信息爆炸的時(shí)代，人們獲取信息的方式主要是從網(wǎng)絡(luò)獲得，這就必定要求在網(wǎng)頁(yè)的設(shè)計(jì)上要遵循認(rèn)知心理學(xué)的要求，才可以被人們?nèi)菀赘兄＞W(wǎng)頁(yè)設(shè)計(jì)就要善于通過(guò)信息處理心理學(xué)，喚起欣賞者身心結(jié)構(gòu)上的類(lèi)似反應(yīng)，利用心理學(xué)在設(shè)計(jì)網(wǎng)頁(yè)時(shí)，會(huì)縮短與網(wǎng)民的距離。設(shè)計(jì)學(xué)院網(wǎng)頁(yè)設(shè)計(jì)運(yùn)用了信息心理學(xué)和審美心理學(xué)進(jìn)行設(shè)計(jì)，瀏覽者也會(huì)在高速的信息傳遞中快速掌握信息，讓網(wǎng)民對(duì)頁(yè)面有深刻的認(rèn)識(shí)和感知，增強(qiáng)版面的表現(xiàn)力和可讀性。
網(wǎng)頁(yè)設(shè)計(jì)是一種綜合性的設(shè)計(jì)，它所涉及的范圍非常的廣泛，包括消費(fèi)者心理學(xué)、視覺(jué)設(shè)計(jì)美學(xué)、字體設(shè)計(jì)、標(biāo)志設(shè)計(jì)、人機(jī)工程、哲學(xué)、等諸多方面，當(dāng)然也離不開(kāi)一定的科學(xué)技術(shù)發(fā)展。技術(shù)與藝術(shù)、色彩與版式、圖片與文字、構(gòu)成了網(wǎng)頁(yè)設(shè)計(jì)，哈爾濱商業(yè)大學(xué)設(shè)計(jì)藝術(shù)學(xué)院網(wǎng)頁(yè)設(shè)計(jì)只是網(wǎng)頁(yè)設(shè)計(jì)中遵循原則的一個(gè)成功案例，在網(wǎng)絡(luò)高速發(fā)展下，網(wǎng)頁(yè)設(shè)計(jì)更似工作站，發(fā)揮更大的機(jī)能。
參考文獻(xiàn)
1　徐珂等.網(wǎng)頁(yè)視覺(jué)與設(shè)計(jì)[M].北京：人民郵電出版社，2003
2　張憲榮等.設(shè)計(jì)色彩學(xué).北京：化學(xué)工業(yè)出版社，2005
3　張金霞.網(wǎng)頁(yè)設(shè)計(jì)參考手冊(cè).北京：清華大學(xué)出版社，2009