我是阿裡雲建站的北柯，這是我【建站指南】第16篇幹貨文章。
近些年來我一直在建站這個小圈子深耕，我負責或者參與過的網站不下百個，對國内國外的一些網站設計技巧了如指掌。下面這篇文章是我總結出的關于網站色彩搭配的精華所在，供大家參考，希望你在建站這條路上少走彎路。
網頁的色彩是樹立網站形象的關鍵要素之一，色彩搭配是令網頁設計初學者感到頭疼的問題之一。網頁的背景、文字、圖示、邊框、連結等應該使用什麼樣的顔色，搭配什麼樣的色彩才能最好地展現出網站的内涵和主題？上篇介紹了網站色彩設計相關的内容，本篇介紹一些網頁色彩搭配的原理。
一、網頁色彩搭配原理
1.色彩的鮮明性
網頁的色彩要鮮明，這樣才容易引人注目。網站的用色必須要有自己獨特的風格，這樣才能顯得個性鮮明，給訪客留下深刻的印象。
圖為阿裡雲建站為廣州黑極蜂文化創意有限公司設計的網站
2.色彩的藝術性
網站設計也是一項藝術行為，是以必須遵循藝術規律。在綜合考慮到網站本身特點的同時，應當按照内容決定形式的原則，大膽地進行藝術創新，設計出既符合網站要求，又具有一定藝術特色的網站。
不同的色彩會産生不同的聯想：藍色讓人想到天空，黑色想到黑夜，紅色想到喜事等，網站選擇色彩要和網頁的内涵相關聯。
3.色彩的獨特性
要有與衆不同的色彩，使得訪客對網站的印象強烈。
4.色彩搭配的合理性
網頁設計雖然屬于平面設計的範疇，但又與其他的平面設計不同。它在遵循藝術規律的同時，還應當考慮人的生理特點。色彩搭配一定要合理，色彩和表達的内容氣氛相适合，能給人一種和諧、愉快的感覺，避免采用純度很高的單一色彩，這樣容易給人造成視覺疲勞。
二、網頁中色彩的搭配
色彩在我們的生活中是有豐富情感和含義的，在特定場合中，同一種色彩可以代表不同含義。色彩總的應用原則應該遵循“總體協調，局部對比”，即首頁的整體色彩效果是和諧的，局部、小範圍的地方可以有一些強烈色彩的對比。
色彩的運用上，可以根據主業内容的需要，分别采用不同的主色調。色彩具有象征性，例如，嫩綠色、翠綠色、金黃色、灰褐色就可以分别象征春、夏、秋、冬。還有象征職業的标志色，如軍警的橄榄綠、醫療衛生的白色等。
圖為阿裡雲建站為東莞市芒果服飾有限公司設計的網站
色彩還具有明顯的心理感覺，如冷、暖的感覺，進、退的效果等。另外，色彩還有民族性，各個民族由于環境、文化、傳統等因素的影響，對色彩的喜好也存在較大差異。充分運用色彩的這些特性，可以使網頁具有深刻的藝術内涵，進而提升網頁的文化品位。
1.色彩的搭配
①相近色
色環中相鄰的3種顔色。相近色的搭配給人的視覺效果很舒适、也很自然，是以相近色在網站設計中極為常用。
圖為阿裡雲建站産品-
雲·企業官網首頁配色
②互補色
色環中相對的兩種色彩。對互補色調整一下補色的亮度，有的時候是一種很好的搭配。
圖為阿裡雲建站為白立潔科技有限公司設計的網站
③暖色
暖色跟黑色調和可以達到很好的效果。暖色一般用于購物類網站、電子商務網站、兒童類網站等，用來展現商品的琳琅滿目，兒童類網站的活潑、溫馨等效果。
④冷色
冷色一般跟白色調和可以達到很好地效果。冷色一般應用于一些高科技、遊戲類網站，主要表達嚴肅、穩重等效果，綠色、藍色、藍紫色等都屬于冷色系列。
圖為阿裡雲建站為美國BOBOT ROBOTICS機器人公司設計的網站
⑤色彩均衡
網站想讓人看上去舒适、協調，除了文字、圖檔等内容的合理排版外，色彩均衡也是相當重要的一部分，比如一個網站不可能單一地運用一種顔色，是以色彩的均衡是設計者必須要考慮的問題。
色彩的均衡包括色彩的位置，每一種色彩所占的比例、面積等。例如，鮮豔明亮的色彩面積應當小一點，讓人感覺舒适、不刺眼，這就是一種均衡的色彩搭配。
2.非彩色的搭配
黑白是最基本和最簡單的搭配，白字黑底、黑底白字都非常清晰明了。灰色是萬能色，可以和任何色彩搭配，也可以幫助兩種對立的色彩和諧過渡。如果實在找不出合适的色彩，那就用灰色試試，效果絕對不會太差。
三、網頁元素的色彩搭配
為了讓網頁設計得更絢麗、更舒适，增強頁面的可讀性，必須合理、恰當地運用與搭配頁面各元素間的色彩。
1.網頁導覽列
網頁導覽列是網站的指路方向标，通路者要在網頁間跳轉、要了解網站的結構、要檢視網站的内容，都必須使用導覽列。可以使用稍微具有跳躍性的色彩吸引浏覽者的視線，使其感覺網站清晰明了、層次分明。
2.網頁連結
一個網站不可能隻有一頁，是以文字和圖檔的連結是網站中不可缺少的部分。尤其是文字連結，因為連結要差別于文字，是以連結的顔色不能跟文字的顔色一樣。要讓通路者快速找到網站連結，設定獨特的連結顔色是一種引導通路者點選連結的好方法。
3.網頁文字
如果網站中使用了背景顔色，就必須要考慮到背景顔色的用色與前景文字的搭配問題。一般網站側重的是文字，是以背景可以選擇純度或者明度較低的色彩，文字用較為突出的亮色，讓人一目了然。
圖為阿裡雲建站為永康市巽昂工貿有限公司設計的網站
4.網頁标志
網頁标志是宣傳網站最重要的部分之一，是以這部分一定要在頁面上突出、醒目。可以将Logo和Banner做得鮮亮一些，也就是說，在色彩方面要與網頁的主題色分離開來。有時為了更突出，也可以使用與主題色相反的顔色。
四、網頁色彩搭配的技巧
色彩的搭配是一門藝術，靈活運用它能讓網頁更具親和力。要想制作出漂亮的網頁，需要靈活地運用色彩加上自己的創意和技巧。以下是一些網頁色彩搭配的常用技巧。
1.使用單色
盡管網站設計要避免采用單一色彩，以免産生單調的感覺，但通過調整色彩的飽和度和透明度，也可以産生變化，使網站避免單調，做到色彩統一有層次感。
圖為阿裡雲建站為拉紮斯網絡科技（上海）有限公司設計的網站
2.使用鄰近色
所謂鄰近色，就是在色帶上相鄰近的顔色，如綠色和藍色、紅色和黃色就互為鄰近色。采用鄰近色設計網頁可以使網頁避免色彩雜亂，易于達到頁面的色彩豐富、和諧統一。
3.使用對比色
對比色可以突出重點，産生強烈的視覺效果。通過合理使用對比色，能夠使網站特色鮮明、重點突出。在設計時，一般以一種顔色為主色調，對比色作為點綴，這樣可以起到畫龍點睛的作用。
4.黑色的使用
黑色是一種特殊的顔色，如果使用恰當、設計合理，往往能産生很強的藝術效果。黑色一般用來作為背景色，與其他純度的色彩搭配使用。
5.背景色的使用
背景的顔色不要太深，否則會顯得過于厚重，這樣會影響整個頁面的顯示效果。一般可采用素淡清雅的色彩，避免使用花紋複雜的圖檔和純度很高的色彩作為背景色。同時，背景色要與文字的色彩對比強烈一些。但也有例外，如黑色的背景襯托亮麗的文本和圖像，會給人一種另類的感覺。
6.色彩的數量
一般初學者在設計網頁時往往會使用多種顔色，使網頁變得很“花”，缺乏統一和協調，缺乏内在的美感，給人一種繁雜的感覺。事實上，網站用色并不是越多越好，一般應控制在四種色彩以内，然後可以通過調整色彩的各種屬性來産生顔色的變化，保持整個網頁的色調統一。
7.要和網站内容比對
了解網站所要傳達的資訊和品牌，進而選擇可以加強這些資訊的顔色。如在設計一個強調穩健的金融機構時，就要選擇冷色系、柔和的顔色，像藍、灰或綠，如果使用暖色系或活潑的顔色，可能會破壞該網站的品牌調性。
8.圍繞網頁主題
色彩要能烘托出主題。根據主題确定網站顔色，同時還要考慮網站的通路對象，文化的差異也會使色彩産生非預期的反應。還有，不同地區與不同年齡層對顔色的反應也會有所不同。年輕人一般喜歡飽和色，但這樣的顔色引不起高年齡層人群的興趣。
此外，白色是網站用得最普遍的一種顔色。很多網站甚至會留出大塊空白作為網站的一個組成部分，這就是留白藝術。很多設計性網站較多地運用留白藝術，給人一個遐想的空間，讓人感覺心情舒适、暢快。恰當的留白對于協調頁面的均衡會起到相當大的作用。
總結，色彩的使用沒有一定的法則，如果一定要恪守某個法則，效果可能适得其反。色彩的運用還與每個人的審美、喜好、知識層次等密切相關。一般應先确定一種能展現主題的主體色，然後根據具體的需要，應用顔色的近似和對比，來完成整個頁面的配色方案。不管怎麼說，整個頁面在視覺上應該呈現的是一個整體、和諧、賞心悅目的畫面。