淺談網(wǎng)頁(yè)設(shè)計(jì)中顏色的搭配

巨　峰

[摘要]在網(wǎng)頁(yè)的設(shè)計(jì)中，顏色的搭配至關(guān)重要，從主題色的確定、輔助色的選取、文本顏色的搭配、背景顏色和背景圖像的設(shè)置四個(gè)方面對(duì)網(wǎng)頁(yè)設(shè)計(jì)中的顏色搭配進(jìn)行探討。

[關(guān)鍵詞]色彩主題色輔助色

中圖分類號(hào)：TP3文獻(xiàn)標(biāo)識(shí)碼：A文章編號(hào)：1671—7597(2009)0620118-01

一、色彩的分類及基本一性

現(xiàn)行色彩理論將自然界中的顏色分為彩色(有彩色)和無(wú)彩色兩大類。無(wú)彩色指黑色、白色和各種深淺不一的灰色，而其他所有顏色均屬于彩色。任何一種彩色具有三個(gè)基本屬性：1色相。顏色的基本特征，例如，紅、綠。2純度。也稱飽和度，指顏色的純潔程度。無(wú)彩色的飽和度為0.3明度。也稱亮度，體現(xiàn)顏色的深淺程度。白色明度最高，黑色最低。無(wú)彩色只有明度特征，沒(méi)有色相和飽和度的區(qū)別。

二、網(wǎng)頁(yè)中色彩的配置

(一)主題色的確定

1根據(jù)現(xiàn)實(shí)企業(yè)形象決定主題色。對(duì)于首先在物理世界中擁有實(shí)體的企業(yè)、機(jī)構(gòu)以及團(tuán)體來(lái)說(shuō)，他們的網(wǎng)站形象實(shí)際上是自身整體形象的一部分，或者說(shuō)應(yīng)當(dāng)被視為固有形象在網(wǎng)絡(luò)媒介中的延伸。這類站點(diǎn)的主題色應(yīng)當(dāng)保持與其實(shí)體周有形象的一致性，從而形成統(tǒng)一的視覺(jué)認(rèn)知。諸多知名企業(yè)的形象站點(diǎn)是這類用色模式的代表。例如：高戤潔的站點(diǎn)，以強(qiáng)烈北美風(fēng)格的紅、藍(lán)為主題色，這也是高露潔公司的企業(yè)標(biāo)準(zhǔn)色。同樣的色彩風(fēng)格也出現(xiàn)在該公司主要日化產(chǎn)品的包裝上。

2根據(jù)站點(diǎn)定位確定主題色。對(duì)于并沒(méi)有一個(gè)既定色彩形象作為用色依據(jù)的站點(diǎn)來(lái)說(shuō)，采用何種色彩或色彩組合作為主題色，應(yīng)當(dāng)視網(wǎng)站的性質(zhì)、功能、風(fēng)格特色等因素的具體定位而定。例如：認(rèn)證公司網(wǎng)站采用藍(lán)色為主色調(diào)代表了公正：一般農(nóng)林業(yè)、教育類網(wǎng)站常使用綠色代表希望與活力；紅色等暖色調(diào)的使用則體現(xiàn)了政府部門網(wǎng)站的嚴(yán)肅性與親和力；面向大眾的咨詢類、娛樂(lè)類、搜索服務(wù)類網(wǎng)站，大多選用飽和、鮮艷、視覺(jué)度較高的色彩作為主色調(diào)，以傳達(dá)豐富活躍的氣氛。

3注意色彩的公共聯(lián)想。色彩具有廣泛的象征性。但由于人類生理構(gòu)造和生活環(huán)境等方面的共性，大多數(shù)人在色彩心理方面，存在麩同的感情。例如紅，橙、黃色使人聯(lián)想到陽(yáng)光、活力、溫暖；藍(lán)、青色使人聯(lián)想到大海、天空、寒冷；明亮而鮮艷的色彩感覺(jué)興奮、明快、跳躍：深暗而混濁的色則感覺(jué)憂郁。

(二)輔助色的選取

頁(yè)面中主題色以外的其他顏色都可以歸類為輔助色，但其中并不包括頁(yè)面內(nèi)那些不確定的、經(jīng)常更新的圖片里的色彩。輔助色的使用能夠增加頁(yè)面的色彩層次，豐富視覺(jué)；同時(shí)，輔助色也可能執(zhí)行著一些具體功能，如視覺(jué)引導(dǎo)等。主要的輔助色與主題色共同建立起網(wǎng)頁(yè)的色彩基調(diào)。輔助色的選取遵循的原則是：對(duì)立中統(tǒng)一，具體有以下幾種手法：

1色彩的對(duì)比調(diào)和則指強(qiáng)調(diào)變化而組合的和諧色彩關(guān)系，富于活潑、生動(dòng)、鮮明的視覺(jué)效果。它往往不是依賴要素的一致，而是靠某種組合秩序來(lái)實(shí)現(xiàn)。例如可在在對(duì)比各色中混入同一色素或置入相同的色彩結(jié)構(gòu)，使各色具有和諧感：或利用色環(huán)尋求具有某種規(guī)律的色彩組合。

2色彩的類似調(diào)和和對(duì)比調(diào)和手法分別代表色彩調(diào)和中的兩種主要傾向。在實(shí)際的色彩應(yīng)用中，為了取得統(tǒng)一而豐富的色彩關(guān)系，往往需要將兩者有所側(cè)重地綜合運(yùn)用，以形成具有一定主從結(jié)構(gòu)的多層次的色彩調(diào)和。

(三)文本顏色的設(shè)定

1靜態(tài)文本的顏色。靜態(tài)文本是功能相對(duì)單純的閱讀型文本，在網(wǎng)頁(yè)中常以大段文字的形式出現(xiàn)。對(duì)于感必趣的文字內(nèi)容，瀏覽者需要集中注意力和花費(fèi)時(shí)間，因此這類文本與背景的顏色搭配應(yīng)以易于提取信息、利于減小視疲勞為原則。

若眼睛同時(shí)聚焦于兩種對(duì)比明顯的鮮艷彩色上，眼部周圍的肌肉會(huì)特別緊張。一些鮮艷補(bǔ)色、準(zhǔn)補(bǔ)色的組合方式是不利于用戶閱讀的，例如紫色為背景的黃色顯示，綠色為背景的紫紅色顯示，以及純紅與純藍(lán)色的組合等。

相較于注視無(wú)彩色，人們持續(xù)注視鮮艷的彩色更容易疲累和厭煩。一般而言，底色與文字色的色彩跳躍度越低，即越接近無(wú)彩色，越有利于長(zhǎng)時(shí)間閱讀。越高明度差的色彩配伍，越具有高認(rèn)識(shí)度，用戶也就越易于從中獲取信息。低純度、高明度對(duì)比的文本與背景色搭配，是適用于靜態(tài)文本的顯示色彩。在無(wú)彩色的搭配中，白底黑字的顯示方式比黑底自字的顯示方式可讀性更強(qiáng)。

2超文本的色彩。與僅供閱讀的靜態(tài)文本不同，超文本加入了鏈接功能，能夠響應(yīng)點(diǎn)擊跳轉(zhuǎn)頁(yè)面。為了有效提示點(diǎn)擊，超文本在外觀上應(yīng)當(dāng)與靜態(tài)文本有所區(qū)分。區(qū)分方式可以是使用不同的字體、字號(hào)，加下劃線，也可以通過(guò)不同顏色來(lái)加以甄別。

超文本應(yīng)當(dāng)使用比靜態(tài)文本強(qiáng)度高、視覺(jué)度高的色彩。例如靜態(tài)文本為黑色，超文本為有彩色。需要注意的是，超文本仍是文字信息，文本色應(yīng)與底色保持足夠明度差以利識(shí)別。在一條超文本上可以同時(shí)使用幾種色彩，以產(chǎn)生響應(yīng)交互的色彩變化。

(四)網(wǎng)頁(yè)背景顏色和背景圖像的設(shè)置

1網(wǎng)頁(yè)背景顏色的設(shè)置。少數(shù)網(wǎng)頁(yè)會(huì)直接使用主題色作為背景顏色，例如一些首頁(yè)和全包圍型網(wǎng)頁(yè)。但更多設(shè)置有色背景的網(wǎng)頁(yè)會(huì)遵循這樣的視覺(jué)層次關(guān)系：頁(yè)面加載完畢后，主題色為頁(yè)面內(nèi)最醒目的色彩，為視覺(jué)注意的第一層，頁(yè)面內(nèi)容為清晰易辨的中間層，背景色或背景圖像為退居最后，襯托前景，裝飾頁(yè)面的底層或邊飾。

符合常見(jiàn)層次關(guān)系的背景色，多數(shù)與主題色星一致調(diào)性。例如是主題色的同系色，或臨近色中的低純度色彩。在明度對(duì)比上，當(dāng)前景明亮對(duì)，背景色應(yīng)當(dāng)較暗；前景深暗時(shí)，背景則應(yīng)稍亮些。在冷暖因素上，背景色整體較前景色冷時(shí)，前后層次感較強(qiáng)。一些網(wǎng)頁(yè)的前景與背景都使用了彩色。當(dāng)網(wǎng)頁(yè)的前景與背景為鄰近色關(guān)系時(shí)，效果比較柔和。對(duì)比過(guò)于強(qiáng)烈的色彩關(guān)系會(huì)干擾視覺(jué)，在以文本信息為主的頁(yè)面中不建議使用。

2背景圖像的色彩設(shè)置。背景圖像首先造成的是一種整體上的顏色感覺(jué)，其次才是紋理風(fēng)格。頁(yè)面加載完成后，背景圖像應(yīng)退居于次要地位，成為頁(yè)面主體的襯托和反復(fù)出現(xiàn)的形象環(huán)境。為了避免在用戶瀏覽網(wǎng)頁(yè)內(nèi)容時(shí)造成過(guò)量的視覺(jué)干擾，背景圖像整體上的視覺(jué)跳躍度與色彩飽和度、對(duì)比度均應(yīng)明顯低于前層內(nèi)容。一般地，根據(jù)空間混和原理，背景圖像中各色間的明度差越小，花紋越細(xì)密，越有利于襯托前景。

主題色或主題色的同系輔助色加入無(wú)彩色、含灰色、鄰近色圖案所構(gòu)成的背景圖像，與前景色彩的一致性強(qiáng)。與頁(yè)面主題色有補(bǔ)色因素的背景圖像，與前景的對(duì)比鮮明悅目。設(shè)置背景圖像時(shí)需要注意圖案單元的大小和色彩數(shù)量。在網(wǎng)絡(luò)較慢時(shí)，文件體積較大的背景圖像可能顯示遲緩，造成等待延長(zhǎng)。

三、總結(jié)

在網(wǎng)頁(yè)設(shè)計(jì)中，不僅要注重技術(shù)和經(jīng)驗(yàn)的積累，同時(shí)也要注重顏色的搭配。所以，要對(duì)色彩的基礎(chǔ)知識(shí)的良好掌控，才能在網(wǎng)頁(yè)設(shè)計(jì)中才能做到游刃有余。