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