根據網站Kissmetrics網路資料分析結果表明,當我們觀察顏色的時候, 我們的眼睛會將訊息傳送到我們大腦中被稱作下丘腦的這個區域。然後這將進一步的訊號傳輸到腦垂體，最後到甲狀腺腺體。然而這個訊號激素的釋放會導致我們情緒和情感的波動，並且最終導致我們的行為結果。
科學告訴我們，顏色可以引起我們消極的負面感覺。Kissmetrics還表明，對於一個站點來說，訪問者只需花費90秒就可以做出判斷或者意見。進一步來說,“62％—90％的互動是由產品自己的顏色決定的。”
正如《Web UI Design for the Human Eye》這本免費的書中所描述，顏色在給使用者創造強烈的第一印象上扮演了一個不可否認的角色。
顏色的含義是什麼
對於每個人來說，每種顏色都意味著些什麼，儘管這些意義取決於我們個人的喜好和文化背景。看看下面的色卡，可以作為一個顏色含義的快速參考。
圖片來源：UXpin
設計中的色彩心理學不是一門精準的科學，並且研究表明，色彩心理受個人認知影響。社會因素中如社會性別也對顏色如何被感知有影響。進一步研究表明，不僅是顏色自身含義的影響，也是關於在使用中如何讓使用者恰當的感知到用在品牌上的顏色含義。
[img=網頁,設計,色彩,600,434]http://www.199it.com/wp-content/uploads/2015/07/32c5742b0da53209abbb44b05fb56567.jpg[/img]
圖片來源： Kissmetrics
所以，如果你是給女性設計的，那麼紫色是一個不錯的選擇，因為一般來說它是普遍女性喜歡的顏色，但是男性是不喜歡的（當然通常情況下是這樣）。在下圖中，對巴黎歐萊雅來說是一個很好的效果 。正如你所看到的那樣，頁首和頁尾都是黑色的，它表明了地位感和優雅感，讓你總體感覺到該產品並不便宜，而是高階產品。
[img=網頁,設計,色彩,600,357]http://www.199it.com/wp-content/uploads/2015/07/8b2302ddd099ca7ee96981909601d10f.jpg[/img]
圖片來源： Kissmetrics
此外，文字用白色的，表示著現代和平靜感，然而選定的紫色代表著奢華的，優雅和女人味——所有這些都清晰的適合於一個網站，例如就這個網站。
（如果想要了解更多關於簡約設計，並使用空餘時間作一個設計工具，可以看看這些免費的電子書《The Elegance of Minimalism 》和《 The Zen of White Spacliae in Web Design》
在下圖中，在婦女健康雜誌網站上面的橫幅是粉紅色的，但其他地方避免使用顏色，反而是用影像和粗的導航。這個有趣的設計選擇對網站起到了反作用。
首先，當一個網站的目標是針對婦女的時候，粉紅色是一個非常老套的顏色， 並且粉色吸引的是愛吃甜食的人群，因此對於網頁訊息要傳達的是女性的健康這一目的就沒有了。
[img=網頁,設計,色彩,600,352]http://www.199it.com/wp-content/uploads/2015/07/34dbec1b9df1c435a9a9ef32aa9bf906.jpg[/img]
圖片來源：女性健康雜誌
當我們進入到網頁的次層級中，那麼標題的顏色理所應當使用在每一個頁面上。當你快速瀏覽減肥標籤下的頁面。如下圖。
[img=網頁,設計,色彩,600,343]http://www.199it.com/wp-content/uploads/2015/07/6b16aff33aa5e30b1caeed4a72e2a759.jpg[/img]
如你所見，這個頁面更是粉紅色，這一點可能會給觀眾帶來適得其反的感受。不管怎樣，我們剛剛在滑塊上看到的那張圖，如果你還保留著這張圖那麼請改掉它。
確定顏色主題
你建立一個網站，這個網站只有一種顏色這是不可能的，除非你打算用純單色。所以你應該考慮整體的配色方案和使用的每個色彩，以及它們的統一性。另外還要考慮顏色對使用者的影響，以及如何讓你正在使用的主色和輔助色相匹配。
考慮到這一點,你應該會關心怎樣混搭顏色能匹配並且能夠幫你解決網站顏色問題。那麼你可以瞭解下面三個顏色混合的基本方法。
1三角色彩計劃
這是一個基本的，並且穩定平衡的方法。原理是使用了色彩的活力和互補特性。使用這個12項色環，你可以選擇任何三種顏色，這三種顏色的位置關係是彼此是120度的距離，依次作為背景，內容和導航的顏色。
[img=網頁,設計,色彩,600,283]http://www.199it.com/wp-content/uploads/2015/07/9173b52156f98670cb0406abce084145.jpg[/img]
圖片來自: Ray Trygstad.維基百科
2複合色（互補色）
第二種方法有一點難並且你可能為了證明它是恰當合適的顏色不得不去做些實驗，如果實驗做得好，它會是非常有效的。這個概念用了四種顏色，即兩組對比色（色環上相鄰兩個顏色的180度補色）
[img=網頁,設計,色彩,600,359]http://www.199it.com/wp-content/uploads/2015/07/5baa6bb82e3389172f46594bd50ed639.jpg[/img]
圖片來自: Ray Trygstad.維基百科
3近似色
這個方法僅側重於互補色，當決定你想要的計劃要去傳達給使用者的時候，你可以考慮這個方法。它強調了選擇顏色的活力，當這些色彩被誇大後就可能太多了。
[img=網頁,設計,色彩,600,347]http://www.199it.com/wp-content/uploads/2015/07/4bf91c12e10e6c9bfdb161082028e766.jpg[/img]
圖片來自: Ray Trygstad.維基百科
因此考慮色彩心理學時，重要的是你應該把所有色彩作為一個整體去考慮，它們在一起怎麼工作，而不是隻選一個顏色，還有希望顏色要與其它的內容如背景，文字等這些按鈕起到作用。
看看下面的這張圖片，並且考慮下它向使用者傳達了什麼內容。
[img=網頁,設計,色彩,600,341]http://www.199it.com/wp-content/uploads/2015/07/8727da8494d1f31b5e7999a7fdbeecee.jpg[/img]
圖片來自Codementor
1背景顏色——黑色的背景展現了網站的優質，精細，正式和統一的企業形象。顯然，當考慮網站提供輔導的時候，你應該會想傳達卓越，精益求精這些東西。網站的形式上表明，當和學習相關的這些企業社團表明使用者可能不是作為一種愛號學習程式碼，而是作為他們未來職業生涯中的一種技能來學習的。
2按鈕的顏色——該網站使用了紅色的按鈕作為交易按鈕。和黑色的背景形成了鮮明的對比，鼓勵更多使用者去註冊。對於不太重要的按鈕則使用白色描邊，與整體方案一致。
完整內容點此檢視
科學告訴我們，顏色可以引起我們消極的負面感覺。Kissmetrics還表明，對於一個站點來說，訪問者只需花費90秒就可以做出判斷或者意見。進一步來說,“62％—90％的互動是由產品自己的顏色決定的。”
正如《Web UI Design for the Human Eye》這本免費的書中所描述，顏色在給使用者創造強烈的第一印象上扮演了一個不可否認的角色。
顏色的含義是什麼
對於每個人來說，每種顏色都意味著些什麼，儘管這些意義取決於我們個人的喜好和文化背景。看看下面的色卡，可以作為一個顏色含義的快速參考。
圖片來源：UXpin
設計中的色彩心理學不是一門精準的科學，並且研究表明，色彩心理受個人認知影響。社會因素中如社會性別也對顏色如何被感知有影響。進一步研究表明，不僅是顏色自身含義的影響，也是關於在使用中如何讓使用者恰當的感知到用在品牌上的顏色含義。
[img=網頁,設計,色彩,600,434]http://www.199it.com/wp-content/uploads/2015/07/32c5742b0da53209abbb44b05fb56567.jpg[/img]
圖片來源： Kissmetrics
所以，如果你是給女性設計的，那麼紫色是一個不錯的選擇，因為一般來說它是普遍女性喜歡的顏色，但是男性是不喜歡的（當然通常情況下是這樣）。在下圖中，對巴黎歐萊雅來說是一個很好的效果 。正如你所看到的那樣，頁首和頁尾都是黑色的，它表明了地位感和優雅感，讓你總體感覺到該產品並不便宜，而是高階產品。
[img=網頁,設計,色彩,600,357]http://www.199it.com/wp-content/uploads/2015/07/8b2302ddd099ca7ee96981909601d10f.jpg[/img]
圖片來源： Kissmetrics
此外，文字用白色的，表示著現代和平靜感，然而選定的紫色代表著奢華的，優雅和女人味——所有這些都清晰的適合於一個網站，例如就這個網站。
（如果想要了解更多關於簡約設計，並使用空餘時間作一個設計工具，可以看看這些免費的電子書《The Elegance of Minimalism 》和《 The Zen of White Spacliae in Web Design》
在下圖中，在婦女健康雜誌網站上面的橫幅是粉紅色的，但其他地方避免使用顏色，反而是用影像和粗的導航。這個有趣的設計選擇對網站起到了反作用。
首先，當一個網站的目標是針對婦女的時候，粉紅色是一個非常老套的顏色， 並且粉色吸引的是愛吃甜食的人群，因此對於網頁訊息要傳達的是女性的健康這一目的就沒有了。
[img=網頁,設計,色彩,600,352]http://www.199it.com/wp-content/uploads/2015/07/34dbec1b9df1c435a9a9ef32aa9bf906.jpg[/img]
圖片來源：女性健康雜誌
當我們進入到網頁的次層級中，那麼標題的顏色理所應當使用在每一個頁面上。當你快速瀏覽減肥標籤下的頁面。如下圖。
[img=網頁,設計,色彩,600,343]http://www.199it.com/wp-content/uploads/2015/07/6b16aff33aa5e30b1caeed4a72e2a759.jpg[/img]
如你所見，這個頁面更是粉紅色，這一點可能會給觀眾帶來適得其反的感受。不管怎樣，我們剛剛在滑塊上看到的那張圖，如果你還保留著這張圖那麼請改掉它。
確定顏色主題
你建立一個網站，這個網站只有一種顏色這是不可能的，除非你打算用純單色。所以你應該考慮整體的配色方案和使用的每個色彩，以及它們的統一性。另外還要考慮顏色對使用者的影響，以及如何讓你正在使用的主色和輔助色相匹配。
考慮到這一點,你應該會關心怎樣混搭顏色能匹配並且能夠幫你解決網站顏色問題。那麼你可以瞭解下面三個顏色混合的基本方法。
1三角色彩計劃
這是一個基本的，並且穩定平衡的方法。原理是使用了色彩的活力和互補特性。使用這個12項色環，你可以選擇任何三種顏色，這三種顏色的位置關係是彼此是120度的距離，依次作為背景，內容和導航的顏色。
[img=網頁,設計,色彩,600,283]http://www.199it.com/wp-content/uploads/2015/07/9173b52156f98670cb0406abce084145.jpg[/img]
圖片來自: Ray Trygstad.維基百科
2複合色（互補色）
第二種方法有一點難並且你可能為了證明它是恰當合適的顏色不得不去做些實驗，如果實驗做得好，它會是非常有效的。這個概念用了四種顏色，即兩組對比色（色環上相鄰兩個顏色的180度補色）
[img=網頁,設計,色彩,600,359]http://www.199it.com/wp-content/uploads/2015/07/5baa6bb82e3389172f46594bd50ed639.jpg[/img]
圖片來自: Ray Trygstad.維基百科
3近似色
這個方法僅側重於互補色，當決定你想要的計劃要去傳達給使用者的時候，你可以考慮這個方法。它強調了選擇顏色的活力，當這些色彩被誇大後就可能太多了。
[img=網頁,設計,色彩,600,347]http://www.199it.com/wp-content/uploads/2015/07/4bf91c12e10e6c9bfdb161082028e766.jpg[/img]
圖片來自: Ray Trygstad.維基百科
因此考慮色彩心理學時，重要的是你應該把所有色彩作為一個整體去考慮，它們在一起怎麼工作，而不是隻選一個顏色，還有希望顏色要與其它的內容如背景，文字等這些按鈕起到作用。
看看下面的這張圖片，並且考慮下它向使用者傳達了什麼內容。
[img=網頁,設計,色彩,600,341]http://www.199it.com/wp-content/uploads/2015/07/8727da8494d1f31b5e7999a7fdbeecee.jpg[/img]
圖片來自Codementor
1背景顏色——黑色的背景展現了網站的優質，精細，正式和統一的企業形象。顯然，當考慮網站提供輔導的時候，你應該會想傳達卓越，精益求精這些東西。網站的形式上表明，當和學習相關的這些企業社團表明使用者可能不是作為一種愛號學習程式碼，而是作為他們未來職業生涯中的一種技能來學習的。
2按鈕的顏色——該網站使用了紅色的按鈕作為交易按鈕。和黑色的背景形成了鮮明的對比，鼓勵更多使用者去註冊。對於不太重要的按鈕則使用白色描邊，與整體方案一致。
完整內容點此檢視