當前位置:才華齋>技能>色彩>

網站色彩配色方法

色彩 閱讀(1W)

一個人擁有自己的風格,稱為個性。一個網站有獨特的色彩風格,可以吸引瀏覽者的注意,從而細細品味該站的內容。所以,網頁配色是非常重要的。網頁色彩是樹立網站形象的關鍵之一。網頁顏色搭配的是否合理,直接影響到訪問者的情緒。好的色彩搭配,會給訪問者帶來強烈的視覺衝擊力。那麼,具體到網頁的背景、文字、圖示、邊框、超連結等,應該採用什麼樣的顏色,應該搭配什麼顏色,才能最好地表達出網站的內涵呢?

網站色彩配色方法

一、網頁色彩基礎知識

首先,需要弄清楚什麼是三元素,即:什麼是同類色?什麼是臨近色?什麼是對比色?什麼是補色?這些都是色彩的基本概念,也是必須掌握的內容。

眾所周知,Photoshop有一種HSB色彩模式,就是用色彩的三要素進行定義的。色相是Hue,純度是Saturation,明度是Brightness。三元素指的是色相、純度、和明度。色相,指顏色的品相,如紅色、綠色、藍色。純度,指顏色的飽和度、鮮豔度;純度越高,顏色就越鮮豔,否則顏色就越黯淡。明度,指顏色的明亮程度。亮度越高,就越接近白色;亮度越低,就越接近黑色。其中,白色最亮,黑色最暗。

按照色彩在色輪上的位置不同,又可將色彩定義為同類色、鄰近色、對比色、補色。同類色是指兩種顏色在色輪上位置的角度相差不超過15°;鄰近色是指兩種顏色在色輪上位置的角度相差不超過30°;對比色指兩種顏色在色輪上位置的角度相差不超過120°;補色是指兩種顏色在色輪上位置的角度相差為180°。

二、網路色彩的基本型別

每個顏色都代表了一個概念,以及該色彩所表達的情感,如紅色、黃色、藍色、綠色、粉色、紫色等。

1.紅色

常見的紅色有純紅、硃紅、粉紅、深紅、淺紅等。紅色是一種喜慶的顏色,是中國最傳統的色彩。例如,過年時的年畫是紅色的;古時狀元及第的服飾也是紅色。紅色象徵著吉祥,代表著祝福。但是,紅色也代表著危險。例如,醫院的標識很多都是紅色的,紅綠燈的紅燈就表示危險的訊號。

2.黃色和橙色

常見的黃色和橙色有純黃、綠黃、橙黃、灰黃、淡黃等。黃色代表輝煌,代表高貴,是亮度很高的色彩。例如,中國古代的皇宮,使用的就是黃色,代表著皇權的至高無上。在封建社會,只有皇族才可以使用黃色。另外,人們所熟悉的黃金是黃色的,是財富的象徵。另外,橙色代表了溫暖,是一種能夠促進人食慾的色彩,很多餐飲行業都會用橙色作為裝飾色。例如,麥當勞、肯德基的店內裝飾都是以橙色為主。

3.綠色

常見的綠色有純綠、黃綠、青綠、墨綠、淡綠等。綠色代表自然、健康、環保,是眼睛感覺最舒適的色彩。例如,樹葉是綠色的,一些環保公益組織的標識也是綠色的。長時間使用電腦,會使人的眼睛有乾澀的感覺。這時候看一看窗外的綠色,會起到緩解眼睛疲勞的作用。

4.藍色

常見的藍色有純藍、天藍、青藍、深藍、淺藍等。藍色代表乾淨、深遠;同時,藍色也象徵科技。例如,天空是藍色的,海洋是藍色的,冰山是藍色的。很多高科技IT企業也使用藍色作為企業的標誌色,如IBM,被稱為“藍色巨人”。

5.粉色和紫色

常見的粉色和紫色有粉紅、紫紅、純紫、深紫、淡粉等。粉色代表女性的柔美;紫色代表神祕和高貴。例如,日常見到的很多鮮花是粉色的;而女性常穿的晚禮服是紫色的,象徵著女性高貴優雅的氣質。

6.黑白灰

常見的黑白灰色有黑色、深灰、灰色、淺灰、白色等。黑色代表死亡,代表冷酷;白色代表純潔;灰色代表汙染、破敗。例如,男士出席晚會,常穿的禮服是黑色的;出席葬禮的著裝,顏色是黑色的;新娘的婚紗是純白色的;煙囪冒出的濃煙,顏色是灰色的;也有許多時尚轎車是銀灰色的。

三、網頁色彩配色方法

在瞭解色彩的基本型別、常見網頁色彩的基本含義和色彩感情的基礎上,應該如何使用這些顏色呢?如何搭配這些顏色呢?配色方法又是什麼呢?網頁色彩的配色方法,主要有以下三個內容:首先,要根據網站的主題,確定主色調,就像如何寫文章一樣,必須先確定文章的主題,然後才能展開。其次,要根據網站的主色調,確定整個網站的配色方案。這也好比寫文章一樣,不僅要有好的主題,也要有好的情節。最後,就是要確定明度和純度的配色方案。仍然以寫文章打比方,好的主題、好的情節不一定能夠吸引人,更重要的是有好的細節。這樣,才能打動讀者。

1.確定主色調的常用方法

(1)根據企業的行業特點和產品特點確定主色調。例如,如果是一個農業公司,就可以考慮使用綠色,因為綠色代表了自然,代表了環保;如果是一個跟咖啡相關的產品,就可以直接使用咖啡色;而如果是一個與海洋相關的公司,如遠洋航運公司,則可以使用藍色。

(2)根據企業網站面向的主要使用者群體的喜好,確定主色調。例如,一個以嬰幼兒為主題的網站,可以使用綠色,因為綠色代表了初生的生命;一個以青少年為主題的網站,可以使用紅色,因為紅色代表了激情,象徵著青少年的勃勃生機;一個以老年為主題的`網站,可以使用深紅色,象徵著老年人的穩重和沉穩;一個以女性為主題的網站,可以使用粉色,象徵著女性的柔美。

(3)根據企業VI或者Logo確定顏色。例如,中國網通的網站,根據Logo的顏色,使用藍色或者綠色;又如,工商銀行的網站,根據Logo的顏色,可以使用黑色或者紅色作為主色調。

2.常用的配色方法

主色調確定後,常用的配色方法有哪些呢?

(1)純色配色。也就是說,只使用一種顏色,再加上中性色黑、白、灰。

(2)單色系配色。只使用一種色系的顏色。與純色配色不同的是,單色系配色在純度和明度上都是有所變化的。

(3)同類色配色。在色環上相差小於30°的類似顏色的搭配。這種配色方案在視覺上比較和諧。

(4)鄰近色配色。在色環上相差小於60°的臨近顏色的搭配。這種配色方案在視覺上對比一般,不是十分強烈。

(5)對比色配色。在色環上相差小於120°的顏色的搭配。這種配色方案在視覺上對比十分強烈。

(6)補色配色。在色環上相對的兩種顏色。這兩種顏色互為補色。

四、網頁色彩例項分析

以盛大網路遊戲的賀歲網站為例,整個網站頁面以紅色和橙色兩種同類色進行搭配,顯得吉祥喜慶,富有活力。整個頁面比較協調,也有所對比。又如,新浪網的主色調是一種介於淺黃和深黃之間的顏色;同時,形象宣傳、海報、廣告使用的顏色都和網站的顏色一致。一般來說,同類色配色是比較容易搭配的配色方案,常見的同類色搭配有青綠藍、紅橙黃等。另外,可以用黑白色來提高對比度。

諸如此類的案例還有很多,筆者就不一一列舉了。總之,多分析,多觀察,掌握了配色方案,多借鑑成功的配色網站,就一定能設計出引人注目的網站。