試探網(wǎng)頁(yè)風(fēng)格定位中的色彩搭配

張 贏 （湖北國(guó)土資源職業(yè)學(xué)院 430090）

試探網(wǎng)頁(yè)風(fēng)格定位中的色彩搭配

張 贏 （湖北國(guó)土資源職業(yè)學(xué)院 430090）

互聯(lián)網(wǎng)時(shí)代，網(wǎng)絡(luò)正以一種前所未有的沖擊力影響著人們的生活。合理的網(wǎng)頁(yè)布局，賞心悅目的網(wǎng)頁(yè)配色，可以讓瀏覽者過(guò)目不忘。如何設(shè)計(jì)出一個(gè)版式新穎、布局合理的網(wǎng)站來(lái)吸引瀏覽者的眼球，成為網(wǎng)頁(yè)設(shè)計(jì)者更加關(guān)注的問(wèn)題。網(wǎng)頁(yè)設(shè)計(jì)除了要首先確定建站的目的，還要定位好網(wǎng)站的風(fēng)格。決定網(wǎng)站風(fēng)格的因素有很多，色彩的搭配就是其關(guān)鍵因素之一。

風(fēng)格定位；色彩搭配；心理效應(yīng)

前言

網(wǎng)頁(yè)的色彩是構(gòu)建網(wǎng)站形象的關(guān)鍵之一，色彩搭配看似簡(jiǎn)單，卻是一門(mén)深?yuàn)W的學(xué)問(wèn)，這往往使網(wǎng)頁(yè)設(shè)計(jì)者感到頭疼。色彩作為網(wǎng)頁(yè)形象給人最直觀的特征之一，與文字信息比較，色彩的優(yōu)勢(shì)是它給人的視覺(jué)沖擊力，色彩的基調(diào)能強(qiáng)化網(wǎng)頁(yè)主題和個(gè)性化特征，在表現(xiàn)特征上具有抒情性，色彩的聯(lián)想能使人產(chǎn)生強(qiáng)烈的情感反應(yīng)。

互聯(lián)網(wǎng)時(shí)代，在電商的影響下，各類網(wǎng)站繁多。但目前一些網(wǎng)站在配色上并沒(méi)有太多獨(dú)特之處，許多網(wǎng)站開(kāi)發(fā)人員對(duì)色彩學(xué)和有效色彩組合的原理還不夠理解。所以在設(shè)計(jì)網(wǎng)頁(yè)時(shí)違背了色彩搭配原則，忽視了網(wǎng)頁(yè)色系與主題的一致性，會(huì)造成整個(gè)網(wǎng)頁(yè)的色彩脫離網(wǎng)站功能，沒(méi)有主題，更加無(wú)法體現(xiàn)網(wǎng)頁(yè)的整體風(fēng)格。希望通過(guò)本課題的研究，使色彩搭配在今后的網(wǎng)頁(yè)設(shè)計(jì)風(fēng)格中得到更廣泛的重視，把網(wǎng)頁(yè)設(shè)計(jì)提升到更高的藝術(shù)境界，為更多的設(shè)計(jì)者善用色彩來(lái)駕馭網(wǎng)頁(yè)設(shè)計(jì)貢獻(xiàn)綿薄之力。

一、網(wǎng)頁(yè)設(shè)計(jì)中風(fēng)格定位與色彩的關(guān)系

（一）網(wǎng)頁(yè)設(shè)計(jì)中風(fēng)格定位的要素

一個(gè)網(wǎng)站由多個(gè)網(wǎng)頁(yè)組成，通過(guò)網(wǎng)頁(yè)來(lái)傳遞網(wǎng)站信息。不管是網(wǎng)站的色彩、技術(shù)、文字和布局還是交互方式，只要能由此讓瀏覽者明確分辨出這是本網(wǎng)站獨(dú)有的，這才形成網(wǎng)站的“風(fēng)格”。

影響網(wǎng)站風(fēng)格定位的因素有很多，每個(gè)要素都是相互關(guān)聯(lián)的。主要包括以下幾個(gè)要素：

（1）網(wǎng)站標(biāo)志：標(biāo)志的設(shè)計(jì)創(chuàng)意來(lái)自網(wǎng)站的名稱和內(nèi)容，能代表網(wǎng)站形象。

（2）頁(yè)面布局：整體框架、表格、文字編排等。

（3）網(wǎng)站色系：包括網(wǎng)頁(yè)的底色、圖片的色系、文字顏色等。

（4）網(wǎng)站內(nèi)容：網(wǎng)站主題、整體實(shí)用性、內(nèi)容切合度等。

（5）程序應(yīng)用：能使網(wǎng)頁(yè)更生動(dòng)的各種應(yīng)用，如Flash . Java script.Java applets等。

在做網(wǎng)頁(yè)的設(shè)計(jì)時(shí)，設(shè)計(jì)者所需要把握的就是要在定位好的網(wǎng)頁(yè)的風(fēng)格的各個(gè)要素之后，使這些要素統(tǒng)一形成網(wǎng)站統(tǒng)一的整體形象。

（二）色彩搭配對(duì)網(wǎng)頁(yè)設(shè)計(jì)中風(fēng)格的影響

色彩搭配對(duì)網(wǎng)站風(fēng)格的定位有著非常重要的影響。如果網(wǎng)站的色系能具有一致性，不僅會(huì)增加整個(gè)網(wǎng)站的美觀性，更能讓瀏覽者不易對(duì)訪問(wèn)內(nèi)容混淆，使瀏覽更便捷。網(wǎng)站的色彩搭配能襯托出網(wǎng)站的主題，如果整體色彩能與主題合理搭配將會(huì)增加網(wǎng)站的易讀性。網(wǎng)頁(yè)的整體色彩包括網(wǎng)頁(yè)的底色和圖片的色系。

網(wǎng)頁(yè)的底色是整個(gè)網(wǎng)站風(fēng)格的重要指針。例如，以灰色作為背景顏色的網(wǎng)頁(yè)會(huì)使瀏覽者的視覺(jué)上感覺(jué)沉穩(wěn)。但若拿來(lái)用作兒童網(wǎng)站的底色就不適合，因?yàn)樾『⒆拥奶煺鏌o(wú)邪、朝氣蓬勃與黑色的沉穩(wěn)、黯淡很難聯(lián)想在一起。

把網(wǎng)站圖片的色系跟網(wǎng)站整體色系相對(duì)應(yīng)起來(lái)就比較困難。以圖片內(nèi)容來(lái)說(shuō)要切合網(wǎng)站主題，若二者不能切合也不要太大差異。以顏色為例，由于綠色屬冷色系的顏色，如某網(wǎng)頁(yè)以綠色為底色，卻大量選用大紅色、橘色等圖片，各種顏色紛呈，那將使整個(gè)網(wǎng)頁(yè)看起來(lái)雜亂無(wú)章。

所以，網(wǎng)頁(yè)與圖片的顏色色系一致或視覺(jué)效果一致將對(duì)網(wǎng)頁(yè)風(fēng)格的整體定位有著重要影響，將色彩的搭配加以合理運(yùn)用，會(huì)使網(wǎng)頁(yè)看起來(lái)更為美觀。

二、網(wǎng)頁(yè)設(shè)計(jì)確定風(fēng)格色彩巧搭配

（一）網(wǎng)頁(yè)色彩的搭配原則

（1）色彩的鮮明性：網(wǎng)頁(yè)的色彩要鮮艷，容易引人注目。

（2）色彩的獨(dú)特性：網(wǎng)頁(yè)的用色必須要有自己獨(dú)特的風(fēng)格，使得大家對(duì)你的印象深刻。

（3）色彩的適合性：色彩與網(wǎng)頁(yè)表達(dá)的內(nèi)容相適合。如用藍(lán)色體現(xiàn)科技型網(wǎng)站的專業(yè)，用粉紅色體現(xiàn)女性的柔情等。

（4）色彩的聯(lián)想性：不同色彩會(huì)產(chǎn)生不同的聯(lián)想。藍(lán)色想到天空，黑色想到黑夜，紅色想到喜事等，選擇色彩要和網(wǎng)頁(yè)的內(nèi)涵相關(guān)聯(lián)。

（二）網(wǎng)頁(yè)設(shè)計(jì)中的色彩搭配技巧

網(wǎng)頁(yè)設(shè)計(jì)的色彩搭配沒(méi)有固定的模式，色彩的選擇需根據(jù)網(wǎng)頁(yè)的內(nèi)容和風(fēng)格定位來(lái)確定。作為網(wǎng)頁(yè)設(shè)計(jì)師，要做到有針對(duì)性的用色。因?yàn)榫W(wǎng)站的類型是各種各樣的，比如政府部門(mén)、公司企業(yè)、電子商務(wù)平臺(tái)、個(gè)人主頁(yè)等，不同內(nèi)容的網(wǎng)頁(yè)在色彩的選擇和搭配上也應(yīng)有較大的區(qū)別。網(wǎng)頁(yè)的色彩應(yīng)用首先要具有與眾不同的個(gè)性，所用色彩要和網(wǎng)頁(yè)表達(dá)的內(nèi)容與氣氛相適應(yīng)，并與網(wǎng)頁(yè)的內(nèi)涵相關(guān)聯(lián)。讓人一看到這個(gè)網(wǎng)站的用色就立即明確該網(wǎng)頁(yè)所屬的類型和所表達(dá)的主題，應(yīng)注意以下幾點(diǎn)：

（1）了解網(wǎng)站要傳達(dá)的訊息和品牌，選擇能加強(qiáng)這些訊息的顏色。例如某汽車貿(mào)易公司的官方網(wǎng)站，網(wǎng)站背景選用較高飽和度的藍(lán)色，與產(chǎn)品的冷灰色形成呼應(yīng)，突出金屬車體流線型的質(zhì)感。網(wǎng)站的整體風(fēng)格清爽自然又具備商業(yè)網(wǎng)站的功能性。在這種狀況下，如果使用暖色系或活潑的顏色，可能會(huì)破壞了該網(wǎng)站品牌。

（2）了解網(wǎng)站的目標(biāo)受眾，根據(jù)群體的特點(diǎn)來(lái)搭配適當(dāng)?shù)木W(wǎng)頁(yè)色彩。例如一個(gè)針對(duì)女性消費(fèi)者的時(shí)尚站點(diǎn)，整個(gè)頁(yè)面沒(méi)有很跳躍的色彩，大面積紫色柔和的漸變色塊體現(xiàn)了女性的柔美，顯得異常優(yōu)雅迷人。而一個(gè)男裝品牌的網(wǎng)站，則會(huì)采用沉穩(wěn)的色調(diào)，如灰色和軍綠色。

（3）色彩調(diào)和是求得視覺(jué)統(tǒng)一，達(dá)到人們心理平衡的重要手段。在色相環(huán)中，色相越靠近就越容易調(diào)和。類似色的調(diào)和是主要靠類似色之間的共同色來(lái)產(chǎn)生作用，例如一個(gè)由很多綠色植物點(diǎn)綴的網(wǎng)頁(yè)，頁(yè)面文字也使用綠色，會(huì)使整個(gè)頁(yè)面顯得清新自然，與網(wǎng)站內(nèi)容相得益彰。

（4）合理的使用補(bǔ)色對(duì)比能使網(wǎng)頁(yè)產(chǎn)生主題突出的效果。把紅與綠、黃與紫、橙與藍(lán)等有補(bǔ)色關(guān)系的色彩彼此并置，使色彩純度增加，感覺(jué)更為明朗，即可在對(duì)比中襯托網(wǎng)頁(yè)的主題。對(duì)比色的合理搭配和補(bǔ)色對(duì)比能拉開(kāi)前景與背景的空間感，突出網(wǎng)頁(yè)主體物。在設(shè)計(jì)時(shí)一般以一種顏色為主色調(diào)，對(duì)比色作為點(diǎn)綴。尤其一些網(wǎng)站定位意在其品牌的宣傳推廣，如此的色彩搭配使得產(chǎn)品和文字信息具有強(qiáng)烈的視覺(jué)沖擊力，形成獨(dú)特的風(fēng)格，為其產(chǎn)品的宣傳起到很好的效果。

不同網(wǎng)站具有不同的風(fēng)格和不同的顏色配置。在確定色彩含義以及在網(wǎng)頁(yè)設(shè)計(jì)中各方面的使用規(guī)則和技巧以后，會(huì)發(fā)現(xiàn)不同色調(diào)表現(xiàn)不同含義，所設(shè)計(jì)的網(wǎng)站將會(huì)產(chǎn)生不同的風(fēng)格，而同一種色相搭配不同顏色，也會(huì)產(chǎn)生不同的效果。

結(jié)論

網(wǎng)頁(yè)的色彩搭配是整個(gè)網(wǎng)站風(fēng)格的指南針，搭配出適合網(wǎng)站風(fēng)格的色彩才能達(dá)到網(wǎng)頁(yè)設(shè)計(jì)的預(yù)期效果。通過(guò)研究分析，總結(jié)出很多影響網(wǎng)頁(yè)風(fēng)格定位的因素，但色彩無(wú)疑是確立網(wǎng)站風(fēng)格的靈魂。色彩搭配對(duì)于網(wǎng)頁(yè)風(fēng)格的定位關(guān)鍵性作用，對(duì)設(shè)計(jì)師在網(wǎng)頁(yè)設(shè)計(jì)制作中做出更多的優(yōu)秀網(wǎng)站是有很大幫助的。然而，還有更多的經(jīng)驗(yàn)教訓(xùn)是需要在實(shí)踐中不斷總結(jié)，網(wǎng)站色彩的駕馭能力會(huì)不斷提高。

[1]柳冬青．網(wǎng)站設(shè)計(jì)風(fēng)格與色彩[J]．電子商務(wù)期刊，2007（4）．

[2]王駿．網(wǎng)頁(yè)創(chuàng)意[M]．湖北美術(shù)出版社，2004．

[3]李東生，蘇靜．網(wǎng)頁(yè)設(shè)計(jì)與配色技術(shù)精粹[M]．清華大學(xué)出版社，2007．