【網(wǎng)頁(yè)設計】選擇你自己的配色方案

目前為止，你應該已經(jīng)很熟悉顏色是什么、每種顏色代表什么，對于不同配色方案也有很好的理解。但是不管怎樣，你知道這些也沒(méi)什么作用，假如你不知從何下手或如何運用色彩對你項目的影響

顏色是種看起來(lái)相當簡(jiǎn)單，卻非常難處理好的東西。而且，由于它是任何設計中極度視覺(jué)化、焦點(diǎn)化的部分（它確實(shí)是），當它沒(méi)處理好時(shí)會(huì )如此引人注意。如果你的設計中這么重要的部分給人感覺(jué)不好，或者沒(méi)有很好的表現你的公司、服務(wù)或品牌，那么它就能讓停留訪(fǎng)問(wèn)的用戶(hù)消失不見(jiàn)

正因為如此，選擇配色方案時(shí)，你需要非常清楚顏色在你設計中可以造成的影響——好的與壞的摒棄這些默認樣式（例如互補色），使用你自己的配色方案，絕對是件好事，但是當你著(zhù)手開(kāi)始創(chuàng )建自己的配色方案時(shí)，可能你好還是沿襲主流的配色方案。這樣一來(lái)，走錯路創(chuàng )造出糟糕的配色方案就不容易了，雖然也難以杜絕

選擇適當的配色方案
首先，我們來(lái)看看如何為你的項目選擇一個(gè)適當的配色方案

這里你需要全局考慮，什么配色方案適合你的品牌、公司或者行業(yè)。

這個(gè)非常有趣，不僅讓我們一睹世界頂尖品牌與企業(yè)的用色傾向，還讓我們洞悉具體行業(yè)中，哪些顏色效果更好，或使用更廣泛

從信息圖表中可以看出，所有能為你所用的主色都適用于各種不同行業(yè)，這些可能適用的顏色都能解讀出常用的含義，之前有文章討論過(guò)我所喜愛(ài)的方式，是為項目創(chuàng )建思維導圖來(lái)探索我能想到的各種不同色調和創(chuàng )意，并且上網(wǎng)尋找這類(lèi)符合品牌戰略的信息。然后，把這些思維導圖的創(chuàng )意轉換為顏色的含義來(lái)確定哪個(gè)符合，這可以幫助你找到哪種配色適合這個(gè)項目或品牌

我該用多少種顏色
有時(shí)候，這個(gè)問(wèn)題真的只是個(gè)人喜好問(wèn)題。不管怎樣，這個(gè)問(wèn)題在Column Five Media的信息圖表中不值一提，因為百強品牌中，只有5%選擇在配色方案中使用兩種以上的顏色

注：近年來(lái)，印刷品的預算比在線(xiàn)曝光更重要，品牌印刷品中使用的顏色數量確實(shí)值得慎重考慮

即便如此，用多少種顏色隨你感覺(jué)就好，在一些情況下，你可以用顏色來(lái)在網(wǎng)頁(yè)的不同區塊中制造差異化。在這種情況下，你可能會(huì )有4、5種不同顏色加入到配色方案中，使網(wǎng)頁(yè)每部分協(xié)調

盡管終選擇權在你，我還是會(huì )建議你在主要配色方案中使用至少兩到三種顏色，這其中不包含文字或背景的明暗中性色。比起用單色配上漸變和陰影，使用兩到三種顏色的配色方案，能夠給你機會(huì )嘗試在各個(gè)區塊間創(chuàng )造更豐富的對比

從照片中選擇配色方案
你是否觀(guān)察過(guò)一張照片，并思考它的顏色表現多么奇妙和驚人？有時(shí)候，這些漂亮顏色可以被轉換成可用的配色方案，并為你所用。從照片中提取一套非常棒的配色方案，只需要稍加訓練和充足的耐心，如果你和我一樣是個(gè)完美主義者，那么你會(huì )花相當一段時(shí)間微調顏色，直到它們剛剛好為止

選擇你的照片
選擇一張好照片上手的關(guān)鍵，是多樣化而且好能讓你震撼。無(wú)論你的圖片比較復古或單色系（即整張圖片都貫穿著(zhù)相近的色調和色彩），或者更加鮮活色彩豐富，你總能在其中某處找到有用的配色方案

一旦你有了一張或幾張照片，假如你立馬就想試著(zhù)創(chuàng )造幾種配色方案，那么用你喜歡的圖像處理軟件打開(kāi)它，然后開(kāi)始瘋狂吧。我在Photoshop中有個(gè)自己愛(ài)用的模板（包含幾個(gè)小矩形）作為切入點(diǎn)，來(lái)放置我所選擇顏色

從照片中選取配色方案時(shí)，我試著(zhù)只堅持一種（比如單色或互補色），然后在照片中嘗試選取相配的顏色。所以舉個(gè)例子，我會(huì )觀(guān)察照片并試著(zhù)發(fā)現什么顏色對我而言突出，這不是指它們要明亮鮮艷，它們可能很柔和或只占照片的一小部分，但我會(huì )試著(zhù)選出成就這張照片的那些少數色彩

在這張照片中，由于這些相近的紫色調，我們能夠很容易選出一套單色系配色方案

這張照片非常飽滿(mǎn)，因此我們可以花些時(shí)間創(chuàng )造一個(gè)更加個(gè)性化的配色方案，它受制于一些規則，搭配起來(lái)卻也同樣合適


一旦我開(kāi)始深入觀(guān)察照片，我就對我想要的風(fēng)格有更深的了解，我會(huì )繼續胡亂嘗試（就用吸管工具）來(lái)看看什么顏色搭配好。比如只選擇一種顏色作為主體，再選兩種其他顏色來(lái)作為陪襯

然后，開(kāi)始將這些顏色放入模版，將它們來(lái)回移動(dòng)，直到你對顏色的位置與層級滿(mǎn)意為止。我通常也會(huì )試著(zhù)在我所選的主色旁邊各放置一個(gè)暗色（接近或幾乎純黑）和亮色（接近白色）。這可以幫助頁(yè)面達到色彩與結構上的平衡，也可以在配色方案中沒(méi)有適合的文字顏色時(shí)提供一種可能

老實(shí)說(shuō)，這里的主要目的就是隨手試試，有時(shí)候你得到的顏色并不合適，也有時(shí)候你在照片中根本找不到一個(gè)得體的配色方案，但是要確保你嘗試過(guò)各種顏色，直到你為自己的設計找到了一套感覺(jué)更加統一協(xié)調的配色方案

iPhone App Adobe Kuler

如果從照片中創(chuàng )建自己的配色方案令你糾結不已，Adobe近也發(fā)布一款iPhone app Adobe Kuler，帶來(lái)了一種非常便捷的從照片中創(chuàng )建配色方案的方法。你可以切換到相機模式從現有照片中選擇一張，或者直接在所在地拍點(diǎn)什么

Adobe Kuler app的妙處，是它提供了一種極為創(chuàng )新的顏色選擇方式。如果你用Kuler app的“現場(chǎng)”視圖直接拍照，你就會(huì )看見(jiàn)照片上四處移動(dòng)的小圓圈。眼前所發(fā)生的，是這個(gè)app在不斷尋找和選出照片中它認為有價(jià)值的配色，就在它停下的位置，然后幫你將它們組合成一個(gè)小配色板

如果你對于從照片中選取自己的配色方案沒(méi)有信心，那么使用Kuler app是個(gè)好辦法，可以幫助你理解什么造就了照片中的優(yōu)秀配色。隨意拍下大量照片（單調、樸素色調和豐富、明亮鮮艷色調都有），然后用Kuler app認真分析為什么這些配色方案起作用，為什么這個(gè)app選擇了它們

然后，你可以適時(shí)開(kāi)始著(zhù)手從照片中創(chuàng )建自己的配色方案了，并對于自己的選擇更加自信