大約10歲的時候,我去迪斯尼米高梅影城游玩。突然,我瞥見了一幅巨大的墻繪,那是用深淺不一、繽紛多彩的顏料繪制而成的。借用這些顏料,藝術(shù)家讓生活變得生氣勃勃。我該是在那一刻便意識到了我的命運(yùn)從此注定:
我是名設(shè)計(jì)色彩“極客”。
我喜歡將自己沉浸在色彩之中,因?yàn)槟亲屛遗d奮不已。色彩能讓你體味到情感,這實(shí)在是妙不可言;當(dāng)人們注視著湛藍(lán)的天空時,你能覷見他們臉上洋溢的那份快樂,或者,當(dāng)某人在情人節(jié)收到一個紅色信封時,你會感覺到他渾身散發(fā)的那股柔情。經(jīng)由聯(lián)想或文化影響,色彩有了含義。
我做設(shè)計(jì)的時候,會花些時間思考為何我要用這種特定的顏色。我考慮與之關(guān)聯(lián)的文化影響,考慮它是否有何含意超出了我們社會的接受程度。之所以要考慮這些,是因?yàn)樽鳛閣eb設(shè)計(jì)者,我明白我的選擇將會被成千上萬乃至數(shù)百萬的人看到。許多網(wǎng)站在頁面語言的國際化上下了不少功夫,但他們是否真對顏色有所斟酌呢?顏色傳遞含義,而我們的假設(shè)常常是錯誤的。
以婚慶網(wǎng)站為例。在西方文化里,新娘常穿著白色禮服,因而將那種鮮艷的純白色納入網(wǎng)站設(shè)計(jì)就很常見。然而,在中國,選擇紅色會更為合適,因?yàn)榘咨前У康念伾T谥袊幕?,紅色意味著好運(yùn)、福氣和愛情。加上幾抹黃色,你可以暗示高貴和財(cái)富。
既然顏色的含義存在各種文化差異,你也許很想知道顏色選擇的“羅塞塔石碑”(譯注:比喻解開神秘之謎的線索)是什么。一般來說,藍(lán)色和紫色是設(shè)計(jì)中用起來最放心的顏色。藍(lán)色通常用于傳遞積極的信息——樂觀、快樂與信心。不過,雖然這一規(guī)則適用于絕大多數(shù)國家,但像印度和日本這樣的國家還是賦予了藍(lán)色截然不同的含義。在印度,藍(lán)色是哀悼的顏色,而在日本,藍(lán)色表示邪惡。
另外一種認(rèn)為安全的顏色是紫色。一般而言,紫色與高貴和財(cái)富相關(guān),這是由古代淵源流傳下來的,當(dāng)時紫色是社會地位的一種象征。歷史告訴我們,這是因?yàn)樽仙玖系米院B?,它在陽光下不會褪色,相反,它會變得更明亮,在日曬雨淋之下尤為鮮艷。然而,在泰國,人們卻有著別樣的觀念,他們將紫色用作哀悼的顏色。
令我大感驚訝的是,這么多國家使用不同的顏色來表達(dá)對所愛之人過世后的悲慟之情。在美國和英國,傳統(tǒng)上用黑色,但是我們在此會看到全世界存在如許多的差異。我準(zhǔn)備了一份表格,就這些差別給出了一個方便參考的分類:
了解你的受眾
既然有這么多曖昧的含義,你可能在想,保險(xiǎn)的話索性就別用顏色吧,但情況并非如此。你應(yīng)當(dāng)接受差異,利用它們來推廣你的信息。了解你的目標(biāo)受眾,并照此定制網(wǎng)站。如果你有多類受眾,可以試著通過定制門戶或借助若干目標(biāo)化CSS將你的網(wǎng)站本地化。
在使用混合色彩時,也要有自己的考慮。以股票市場為例。在美國、英國和日本,正面指示用綠色或藍(lán)色,而負(fù)面指示用紅色。而在臺灣和韓國,情況則恰好相反。這無關(guān)設(shè)計(jì)的選擇,而是文化的解讀。在這兩地,紅色代表繁榮與幸運(yùn),都是正面的東西。關(guān)鍵在于,清楚這些微妙卻十分重要的細(xì)節(jié),盡量避免讓你的訪客困惑不解,避免傳遞錯誤信息的可能。
明智的話,你還要記住,12個人中就有1人是色盲。因此,像照片和插圖一樣,顏色應(yīng)當(dāng)用來支撐信息的表達(dá),而不該成為信息本身。有項(xiàng)測試不錯:如果把顏色去掉,看是否還能表達(dá)相同的信息。
設(shè)計(jì)師的工具箱里有許多工具,這些應(yīng)當(dāng)小心謹(jǐn)慎地使用。我見過以亮紅色做背景的網(wǎng)站,你在房子那頭都能看得見,這樣的網(wǎng)站會很刺眼。對于醫(yī)療保健類網(wǎng)站而言,選擇這類背景是很差勁的。過度飽和的色彩往往會讓人神經(jīng)緊繃,而在醫(yī)院你最不愿意看到的就是瀕臨絕境。這當(dāng)然是個極端的例子,但可以很好地說明這一問題。
下次你碰到醫(yī)院職工,請看看他們穿戴的是什么。你會發(fā)現(xiàn),他們的制服往往是較柔和的淡色彩,例如淡紫色、綠色或藍(lán)色。這并非偶然:它們的意圖是要傳遞平靜、安心和潔凈的感覺。溫和淡雅的顏色能達(dá)到這一目的。在設(shè)計(jì)醫(yī)療保健類網(wǎng)站時,請使用能讓受眾安靜的顏色,而不是讓他們興奮的顏色。
簡單的顏色變化便能決定網(wǎng)站的觀感。以倫敦大學(xué)學(xué)院醫(yī)院的網(wǎng)站為例。我取來原始設(shè)計(jì),并用不同顏色風(fēng)格做了四個新頁面:
每一種設(shè)計(jì)都有不同的觀感。黑色隱含著專業(yè)/合法之意,但也讓人聯(lián)想到死亡。紅色看上去沒那么糟糕,但太接近于血的顏色,讓人聯(lián)想到人身傷害,而不是醫(yī)療康復(fù)。最后兩例分別為綠色和藍(lán)色。我認(rèn)為兩者都是有效的,但我寧愿選擇藍(lán)色。原因在于,綠色太亮了些,與網(wǎng)站的真正目的——讓你平靜和安心有所背離。
明亮起來
醫(yī)院的例子與針對小孩子的網(wǎng)站則形成了鮮明對照。孩子能從明亮、飽和的色彩受益。這些顏色能刺激他們的頭腦,吸引他們的目光。通過使用豐富的色彩,你能讓他們始終興趣盎然,并激勵他們?nèi)ヌ剿髟O(shè)計(jì)的奧妙。大量使用暖色如紅色和黃色,同時結(jié)合一些較冷的藍(lán)色和綠色,尤其能取得好的效果。如果你為兒童網(wǎng)站設(shè)計(jì)選擇配色方案,可以從他們的玩具汲取靈感,你會觀察到,玩具制造商選擇了鮮艷活潑的色彩,他們特意給玩具繪上了飽滿、明亮而簡單的顏色。
我最后給出的例子是食品網(wǎng)站。在為此行業(yè)做設(shè)計(jì)時,你應(yīng)當(dāng)使用能刺激食欲的顏色。由于食品的顏色多種多樣,好的配色方案常常難以選定??偟恼f來,諸如紅色、橙色、黃色和綠色這樣的顏色確實(shí)能夠激發(fā)食欲,同時又提供一種溫馨如家的感覺。因而漢堡王、La Tasca、塞恩斯伯里和韋特羅斯在他們的商標(biāo)或網(wǎng)站上都用到這些顏色也就不偶然了。下面呈現(xiàn)了他們的配色方案,它們盡可能地誘發(fā)你的饑餓感。藍(lán)色則恰好相反,它會抑制你的食欲。
但愿這些會有助于你今后的配色方案選擇,你已經(jīng)學(xué)到了一些色彩理論的歷史以及它們相伴的關(guān)聯(lián)含義。務(wù)必聰明而細(xì)心地發(fā)揮你設(shè)計(jì)師的能力。
案例分析:Twitter
你頭一次接觸Twitter網(wǎng)站時,會注意到它的設(shè)計(jì)主要為藍(lán)色。我們知道藍(lán)色是一種用于web的安全色彩,因此Twitter在其網(wǎng)站上用到它就不足為奇了,特別是它還支持英語、法語、德語、意大利語、日語、韓語和西班牙語等多種語言。支持這么多語言意味著你的受眾是多種文化的聚合體。
我們知道每12人中有1人為色盲,那么如果我們通過他們的眼睛來看這個網(wǎng)站,又會出現(xiàn)什么情況呢?
如果對比度和顏色組合太過相似,你的一部分受眾就會無法看到內(nèi)容。有許多方法可以模仿色盲效果。我喜歡用的程序是Color Oracle,這是一個適合Windows、Mac和Linux的色盲模擬程序,由伯恩哈德?杰尼(Bernhard Jenny)和納撒尼爾?沃恩?科爾索(Nathaniel Vaughn Kelso)開發(fā)。
作為web設(shè)計(jì)師,我們聽過漸進(jìn)增強(qiáng),但是有沒有聽過柔性降級(graceful degradation)?柔性降級指的是,網(wǎng)站采用現(xiàn)有最新最棒的功能設(shè)計(jì)和開發(fā)后,再用老的瀏覽器檢查以確保新特性不呈現(xiàn)時,網(wǎng)站功能仍然有效。這一思想也適于色彩運(yùn)用。先用你所需的所有顏色設(shè)計(jì)好網(wǎng)站,然后使用Color Oracle或Photoshop檢查色盲支持效果。
顏色并非你工具箱里的唯一工具。選取能夠凸顯內(nèi)容的顏色,但仍然要讓用戶能閱讀內(nèi)容。使用Color Oracle測試顏色組合,如有必要,則作出改變。記住一點(diǎn),你希望自己的網(wǎng)站能讓最廣泛的受眾看到,如此他們才能欣賞你的設(shè)計(jì)。
下面是標(biāo)準(zhǔn)的Twitter網(wǎng)站。該圖顯示了無色盲的人看到的Twitter主頁的模樣。
綠色盲:5%的男性和0.35%的女性患有這種色盲。它讓這些人無法感知紅綠兩色。對他們而言,Twitter是如下這個模樣。
紅色盲:這種色覺缺陷會讓紅色看上去十分黯淡。它較不常見,與性別關(guān)系不大,1%的男性患有此病,而且這是遺傳性的。對于那些患有紅色盲的人來說,Twitter是如下這個模樣。
藍(lán)色盲:這是一種最罕見的色盲,不到0.3%的男性和女性患有這種色盲。它會限制你識別藍(lán)-黃色譜的能力。對他們而言,Twitter是如下這個模樣。
聯(lián)系客服