曾經(jīng)費(fèi)盡心思想替網(wǎng)站設(shè)計(jì)一套令人眼睛為之一亮的色彩組合嗎?或 者你一直不解為何銀行、公司行號(hào)或金融機(jī)構(gòu)的網(wǎng)站總是使用藍(lán)色系 ?那么你來對(duì)地方了。雖然大部分的網(wǎng)站開發(fā)人員都很清楚網(wǎng)絡(luò)所使 用的色盤和計(jì)算色彩的 16 進(jìn)位系統(tǒng),但對(duì)色彩學(xué)和有效色彩組 合背后所隱含的原理依然懵懵懂懂。
幾世紀(jì)以來,顏色 本身就是一個(gè)難解的謎題。舉例子來說,蘇格拉底就曾經(jīng)假設(shè)說「火 」之源起,乃是因眼睛結(jié)合了對(duì)象本身的「白」(whitenes s)所產(chǎn)生的顏色。之后,牛頓更探索光與色彩之間的關(guān)系;其后歷 經(jīng)許多科學(xué)研究,終于在20世紀(jì)確認(rèn)了光波與色彩感應(yīng)之間的絕對(duì) 關(guān)系。
如今,色彩調(diào)和與色彩調(diào)性方面的研究信 息,直接影響了藝術(shù)家、設(shè)計(jì)師和廣告AE人員。本篇關(guān)于色彩理論 的指南,旨在探索如何于網(wǎng)站上有效使用色彩,同時(shí)也提供了許多色 彩調(diào)和技巧,讓您善用色彩來駕馭網(wǎng)站設(shè)計(jì)。
色彩學(xué)
我們能看到顏色是靠三個(gè)元素相互作用而成:光源、 物體的反射特性、以及人體視網(wǎng)膜和腦部視覺皮質(zhì)區(qū)對(duì)光波的處理方 式。不管我們使用哪種媒材來作業(yè) -- 繪畫、印刷或網(wǎng)絡(luò) -- 我們都得依賴上述過程才能有效使用顏色。 色彩的排列 -- 彩虹
十七世紀(jì)末期,牛頓證明了色彩并非存在于物體本身, 而是光作用的結(jié)果,且只要將可視光譜上的長短光波結(jié)合起來即可形 成白光。這些可視光的波長可對(duì)應(yīng)到七個(gè)不同的顏色:紅、橙、黃、 綠、藍(lán)、靛、紫。
牛頓在實(shí)驗(yàn)中所分離出來的可 視光譜其實(shí)才占了所有電磁光譜的一小部分,整個(gè)光譜范圍從分為「 短頻、長波區(qū)」(例如收音機(jī)調(diào)頻)到「高頻、短波區(qū)」(例如 X 光)?梢暪庾V的區(qū)域是介于紅外線與紫外線之間,波長約為 4 00nm (紫色) 到 700nm (紅色) 之間。雖然牛頓 證明這些光波結(jié)合在一起即形成白光,但其實(shí)只需要紅、綠、藍(lán)三光 波就可以產(chǎn)生白光。
光的吸收與反射
當(dāng) 光波投射在物體身上后,該物質(zhì)會(huì)傳送、吸收或反射不同部分的光波 。根據(jù)不同物體的特性以及它本身的原子構(gòu)造,它可能反射了綠光但 吸收了其它的波長。這時(shí)候人們的視網(wǎng)膜和腦部視覺皮質(zhì)區(qū)會(huì)處理此 一反射光,然后形成我們所看到的顏色。
藝術(shù)家 和設(shè)計(jì)師將顏色復(fù)制到畫布或紙張上的時(shí)候,他們便是仿真此一過程 ,利用顏料吸收了某個(gè)部分的光波、反射出其它光波。例如要產(chǎn)生綠 色,我們可使用會(huì)吸收紅、藍(lán)光波的顏料即可。此一過程是所有繪畫 與印刷媒體的色彩模式基礎(chǔ)。
一切靠眼睛
當(dāng)然,不論是反射自物體或是發(fā)射自光源本身,我們處理光波的能 力都是靠視網(wǎng)膜和腦部的視覺皮質(zhì)區(qū)。視網(wǎng)膜內(nèi)有三個(gè)接收器(或者 說是錐細(xì)胞)可響應(yīng)某些光波的頻率。紅色錐細(xì)胞能感應(yīng)低頻率的波 長,綠色錐細(xì)胞反應(yīng)的是中頻率的波長,藍(lán)色錐細(xì)胞反應(yīng)的是高頻率 的波長。這些錐細(xì)胞的運(yùn)作并非二元性的,而是類似頻道一樣,可將 刺激分別傳達(dá)至腦部的視覺皮質(zhì)區(qū),經(jīng)過處理后才產(chǎn)生出我們所看到 的顏色。
為了產(chǎn)出特定顏色,藝術(shù)家/設(shè)計(jì)師們 必須靠著增減光波的方式,讓人體內(nèi)的視覺接收器只反應(yīng)到某些光波 。至于應(yīng)該用加法或減法原理,則要看你使用何種材質(zhì)來表現(xiàn)你的作 品了。色彩模式與色彩管理 設(shè)計(jì)師處理顏色的方法通常有兩種:一 、加色法,混合不同顏色的光波以形成白光;二、減色法,使用顏料 來減少光波。傳統(tǒng)的藝術(shù)家所使用的色盤和 CMYK 系統(tǒng)都是減 色法模式。在網(wǎng)站上,我們所面對(duì)的是光的投射,而不是從物體上反 射回來的光,所以使用的是加色法模式,我們稱它為RGB。
加色法
在大自然中,我們所看到的光波是經(jīng)過 物體反射進(jìn)入我們的視網(wǎng)膜,但產(chǎn)生色彩的方式不僅只這一種。例如 ,舞臺(tái)燈光是利用白光穿過有色濾鏡來產(chǎn)生不同的色光。計(jì)算機(jī)屏幕 也是使用投射光波的方式,但不同的是它藉由讓電子光槍發(fā)光投射到 含磷的屏幕來產(chǎn)生色光。這些電子光槍可以發(fā)出三種顏色:紅、綠、 藍(lán)。藉由這三種色光,計(jì)算機(jī)屏幕可制作出完整的光譜。這就是大家 所熟知的 RGB 色系。
在 RGB 系統(tǒng)中 ,設(shè)計(jì)師也可以透過混合三原色的方式做出一個(gè)光譜;旌先蝺蓚(gè)原 色,就會(huì)產(chǎn)生三個(gè)次原色:青、洋紅、黃。如前面所說的,將光的三 原色加在一起就可以做出白光。所以,如果一個(gè) RGB 的值為 255,255,255 則表示為白色。如果完全拿掉這三原色的 光 (RGB: 0,0,0) 則產(chǎn)生黑色。
減色法
RGB 模式的相反模式就是 CMYK 模式,也 就是使用減少光波的方式來產(chǎn)生顏色。由于物體顏色來自于反射的光 波,此一系統(tǒng)乃使用三原色來吸收物體的紅、綠或藍(lán)光。例如,如果 你減少了紅光,那么多余的綠色波和藍(lán)色波就會(huì)產(chǎn)生青色。用來除去 紅光、反射綠、藍(lán)光的顏料就會(huì)顯示青色。相同的,平面印刷設(shè)計(jì)師 會(huì)使用洋紅來吸收掉一部份的綠光,以及使用黃光來吸收掉一部份的 藍(lán)光。 這樣一來,我們很明顯的可以知道 CYMK 模式中所使 用的三原色就是 RGB 模式中的次顏色,反之亦同。再者,如果 將紅、綠、藍(lán)光混合在一起形成白光,那么就表示將青、洋紅、黃三 色的顏料混合在一起就會(huì)產(chǎn)生黑色,因?yàn)槿墓獠ǘ紝⒈活伭纤?吸收了。然而受限于顏料和印刷系統(tǒng)的因素,混合青、洋紅、黃并無 法完全吸收掉所有的光波。因此實(shí)際上還必須加上一個(gè)黑色才能完成 ,所以就產(chǎn)生了 CMYK 里面的 K 元素了。
< P>色彩管理
由于有這兩套不同的復(fù)制顏色方式,設(shè)計(jì)師若 必須同時(shí)創(chuàng)作數(shù)字與印刷影像可就傷腦筋了。除了對(duì)應(yīng)加色法和減色 法之間的困難外,RGB 和 CMYK可使用的色彩范圍差異也相 當(dāng)大。因此對(duì)跨媒體設(shè)計(jì)師而言,擁有一套可根據(jù)輸出設(shè)備做色系轉(zhuǎn) 換的色彩管理系統(tǒng)可減輕不少頭痛問題。色彩管理系統(tǒng)可包含在操作 系統(tǒng),某些應(yīng)用軟件之中。
色彩調(diào)和
視覺設(shè)計(jì)最大的挑戰(zhàn)之一便是找出有效的調(diào)和色彩,讓色系既不過于 單調(diào),也不過于夸大。想了解色彩平衡之間的關(guān)系,可從了解色環(huán)開 始著手。色環(huán)呈現(xiàn)出某一色彩模式中所有可能的色相 每個(gè)色彩模式 都包含了一組三原色,然后經(jīng)由這一組三原色的相互混合而產(chǎn)生不同 的顏色。在傳統(tǒng)色彩學(xué)中,三原色指的是藍(lán)、紅、黃;而在 RGB 色彩模式中,色光的三原色是指紅、綠、藍(lán)。任何兩個(gè)色光的組合 會(huì)產(chǎn)生一組次顏色。三次色則是混合了原色與次色,或者是混合兩種 次原色所產(chǎn)生。我們用色環(huán)來呈現(xiàn)顏色的邏輯性。你可以從下面的圖 中看出, RGB 的色環(huán)和傳統(tǒng)藝術(shù)家們所使用的色環(huán)是很不一樣 的。
同色調(diào)和:單一顏色,只是深淺、色調(diào)和明 暗度不同。 近似色調(diào)和:使用鄰近的顏色或在色環(huán)上很接近的顏色 做調(diào)和。
互補(bǔ)色調(diào)和:使用色環(huán)上兩個(gè)相對(duì)的顏 色做調(diào)和。這樣的顏色組合通?梢蕴峁┳畲蟪潭鹊膶(duì)比感覺,但若 過份使用使會(huì)流于夸大。
對(duì)比色調(diào)和:使用一種 顏色,再加上其互補(bǔ)色旁邊的兩個(gè)顏色做調(diào)和。對(duì)比色調(diào)和能提供比 互補(bǔ)色調(diào)和較柔和的對(duì)比。
三角調(diào)和:使用色 環(huán)上三個(gè)等距離顏色。
雙互補(bǔ)調(diào)和:使用兩組 (共四色) 互補(bǔ)顏色。
在探索色彩調(diào)和的時(shí)候 ,通常最好從純色下手,然后再嘗試不同程度的渲染、色調(diào)和明暗度 。接著你可使用網(wǎng)站仿真圖先行測試某顏色組合的視覺特效。記得, 對(duì)比的重要性不只是在于為了吸引人而設(shè)計(jì);它也可能幫助或妨礙網(wǎng) 站的閱讀性。
色彩所傳達(dá)的意義
當(dāng) 我們?cè)跈z視色彩的科學(xué)本質(zhì)和色彩調(diào)和的美學(xué)考量時(shí),我們發(fā)現(xiàn)感官 在色彩運(yùn)用上扮演了很重要的角色。除了感官反應(yīng)與辨識(shí)調(diào)和色彩外 ,人類內(nèi)在對(duì)色彩的反應(yīng)還有更深層的一面。色彩能引發(fā)強(qiáng)烈的生理 /心理共鳴,不管是正面或負(fù)面。當(dāng)你在選定顏色組合時(shí),請(qǐng)確定你 所選擇的顏色能引起適當(dāng)?shù)幕仨憽?
色彩的生理 反應(yīng)
雖然并沒有直接證據(jù)顯示色彩能引發(fā)特定反應(yīng),但是 研究顯示,某些顏色確實(shí)能夠引起一些生理上的反應(yīng)。例如,紅色就 是一種非常刺激的顏色,往往會(huì)令人心跳加快、呼吸急促。所以,紅 色非常適合用在需要引起注意和強(qiáng)調(diào)的時(shí)候,但若用在背景顏色的時(shí) 候可能顯得過于強(qiáng)烈。相同地,黃色也能引起注意,但因?yàn)槠浞瓷湫?太強(qiáng),容易造成眼睛的疲勞和不舒服。另外一方面,藍(lán)色對(duì)神經(jīng)系統(tǒng) 具有放松的效果,且根據(jù)一些研究顯示,以藍(lán)色當(dāng)背景還能增加生產(chǎn) 力。但是,如果你的產(chǎn)品與食物有關(guān),千萬不要用藍(lán)色作為背景顏色 ,因?yàn)樗{(lán)色可是會(huì)抑制人們的胃口喔。
色彩的 象征
色彩所象征的意義有時(shí)候跟大自然中的事物有關(guān)。例 如,天空與太陽的顏色所產(chǎn)生的聯(lián)想舉世接然。然而,大部分的色彩 意義都跟民族文化有關(guān),例如,政治、宗教、神話或社會(huì)結(jié)構(gòu)等 - - 這些因素可能會(huì)隨著時(shí)間與地域的不同而產(chǎn)生差異。若你設(shè)計(jì)的 網(wǎng)站是針對(duì)國外地區(qū),那你可千萬得小心,同一顏色在不同文化可能 會(huì)有南轅北轍的效果。另外,大部分的顏色都同時(shí)具有正面和負(fù)面的 聯(lián)想。你可以運(yùn)用色彩的質(zhì)量和飽和度的不同,或者是用混合兩個(gè)顏 色的方式來強(qiáng)調(diào)某個(gè)特別的涵義。
一般在西方 的文化中,色彩所傳達(dá)的涵義為:
紅色:熱情 、浪漫、火焰、暴力、侵略。紅色在很多文化中代表的是停止的訊號(hào) ,用于警告或禁止一些動(dòng)作。
紫色:創(chuàng)造、謎 、忠誠、神秘、稀有。紫色在某些文化中與死亡有關(guān)。
藍(lán)色:忠誠、安全、保守、寧靜、冷漠、悲傷。
綠色:自然、穩(wěn)定、成長、忌妒。在北美文化中,綠色代 表的是「行」,與環(huán)保意識(shí)有關(guān),也經(jīng)常被連結(jié)到有關(guān)財(cái)政方面的事 物。
黃色:明亮、光輝、疾病、懦弱。
黑色:能力、精致、現(xiàn)代感、死亡、病態(tài)、邪惡。
白色:純潔、天真、潔凈、真理、和平、冷淡、 貧乏。白色在中華文化中也代表著死亡的顏色。
選擇最恰 當(dāng)?shù)纳式M合
替網(wǎng)站選對(duì)顏色可不是一件容易的事;很多 公司還特別聘請(qǐng)專業(yè)咨詢?nèi)藛T,使其色彩組合能搭配、強(qiáng)化整體的品 牌形象。但是,如果你自己就已經(jīng)具有色彩調(diào)和感,并且了解某些顏 色可能會(huì)引起什么樣的反應(yīng),你只需照著你的方法進(jìn)行,開發(fā)出有效 的色彩組合。在你開始找尋對(duì)應(yīng)的顏色之前,你必須先很清楚你網(wǎng)站 所要傳達(dá)的訊息和目標(biāo)。一但你了解要傳達(dá)的訊息后,就可開始進(jìn)行 調(diào)色工作了。在過程中,你免不了要不斷地試驗(yàn)混合顏色,這是一個(gè) 極具創(chuàng)意的過程。別害怕使用大膽的顏色組合,但在將你的產(chǎn)品公諸 于世之前,記得要經(jīng)過充分的測試喔!
色彩的 使用技巧與指針
1. 了解你的網(wǎng)站所要傳達(dá)的訊息和品 牌。選擇可以加強(qiáng)這些訊息的顏色。例如,如果在設(shè)計(jì)一個(gè)強(qiáng)調(diào)穩(wěn)健 的金融機(jī)構(gòu),那么就要選擇冷色系、柔和的顏色,像是藍(lán)、灰或綠。 在這樣的狀況下,如果使用暖色系或活潑的顏色,可能會(huì)破壞了該網(wǎng) 站品牌。
2. 了解你的讀者群。文化差異可 能會(huì)使色彩產(chǎn)生非預(yù)期的反應(yīng)。同時(shí),不同地區(qū)與不同年齡層對(duì)顏色 的反應(yīng)亦會(huì)有所不同。年輕族群一般比較喜歡飽和色,但這樣的顏色 卻引不起高年齡層的興趣。
3. 不要使用過 多的顏色。除了黑色和白色以外,約選擇四到五個(gè)顏色就夠了。太多 的顏色會(huì)導(dǎo)致混淆,也會(huì)拉走讀者的注意力。
4. 在閱讀的部分使用對(duì)比色。顏色太接近無法產(chǎn)生足夠的對(duì)比效 果,也會(huì)妨礙觀眾閱讀。白底黑字的閱讀效果最好。
5. 用灰階來測試對(duì)比。當(dāng)你在處理黑色、白色和灰色以外 的顏色的時(shí)候,有時(shí)候會(huì)很難決定每個(gè)顏色的相對(duì)值。為了要確認(rèn)你 的色盤能提供足夠的對(duì)比,你可以建立一個(gè)仿真網(wǎng)站,并將它轉(zhuǎn)換成 灰階即可。
6. 選擇顏色要注意時(shí)效性。同 一個(gè)色彩很容易就充斥著整個(gè)市場,且消費(fèi)者很快的就對(duì)流行色彩感 到麻木。但就另外一個(gè)角度來看,你可以使用幾十年前的流行色彩, 引起人們的懷舊之情。
7. 選擇色盤時(shí)請(qǐng)考 慮功能性的顏色。別忘了將關(guān)鍵信息部分建立功能性的顏色,例如標(biāo) 題和超級(jí)鏈接等。
8. 注意網(wǎng)站色差問題。 每一個(gè)網(wǎng)站開發(fā)人員都知道,即使是網(wǎng)絡(luò)通用顏色在跨平臺(tái)顯示的時(shí) 候都會(huì)有些不同。記得要校正你的 gamma 值,并在不同的作 業(yè)平臺(tái)上測試你的色盤。