網頁中如何運用色彩

摘要：在網頁的設計中，有些網頁十分典雅，令人賞心悅目。網頁的頁面結構很簡單、圖像也不復雜，但是，就是這樣簡單的網頁卻能吸引人。其主要原因是色彩運用得當，在簡單的網頁布局中能夠起到畫龍點睛的作用。那你是否明白這些簡單的色彩都有哪些含義和奧秘嗎？這就涉及到很多色彩原理的知識，該文章將對色彩的基本原理和含義加以詳細闡述。

關鍵詞：色彩；含義；網頁

中圖分類號：G434文獻標識碼：A文章編號：1009-3044(2008)32-1262-02

How to Use the Tolour in the Webpage

LI Fang

(The Staff Room of Computer Application， Wanbo Institute of Sci. Tech.， HeFei 230031， China)

Abstract: In the process of designing webpages ，some webpages seem elegant and agreeable. The structure of the webpages is quite simple and the picture is not complicated.Butthese simple webpages are quite attractive 。The main reason is that color is usedappropriately，which plays an important role in the overall management of the simple webpage.Can you understand the implication and profound mystery of these simple colors? This refers to a lot of knowledge about the basic principles of color.So this paper maily discusses the basic principles and implication of color.

Key words: color; implication; webpage

1 色彩的基本概念

自然界中的顏色可以分為彩色和非彩色兩大類。非彩色指黑色、白色和各種不同程度的灰色，而其他所有顏色均屬于彩色。任何一種彩色都具有下面三個屬性：

1）色相：色相也叫色澤，是顏色的基本特征，是從物體反射或透過物體傳播的顏色。在0到360度的標準色輪上，按位置度量色相。在通常的使用中，色相由顏色名稱標識，比如紅色、橙色或綠色。

2）飽和度：飽和度有時稱為彩度，是指顏色的強度或純度。飽和度表示色相中灰色分量所占的比例，它使用從0%（灰色）至100%（完全飽和）的百分比來度量。在標準色輪上，飽和度從中心到邊緣遞增。飽和度主要指顏色的純潔程度。

3）明度：明度也叫亮度，亮度是顏色的相對明暗程度，通常用從0%（黑色）至100%（白色）的百分比來度量。明度主要體現顏色的深淺。

注：非彩色只有明度特征，沒有色相和飽和度的區別。

2 色彩的三原色

電腦屏幕的色彩是由RGB（紅色、綠色、藍色）三種基色調和而成的，我們所看到的其它顏色，都是通過調配這三個基色而產生的。這三個基色稱作色彩的三原色。在許多圖像處理軟件中，都有提供色彩調配功能，你可以任意輸入三基色的數值來調配顏色（三種基色的輸入數值都是在0~255之間），也可直接根據軟件提供的調色板來選擇顏色。比如在Photoshop的拾色器中就可以隨意輸入RGB值來調校顏色。

3 色彩的含義

在設計網頁的頁面時，要盡量使用看上去比較淡雅、簡潔的色彩。比如背景盡量少用灰暗、深沉的色彩，因為灰暗、深沉的顏色給人的感覺是比較嚴肅、壓抑與消極，除非在一些特殊的情況下才能選擇這種色彩。下面讓我們來看看色彩所代表的一些含義：紅色一般代表著熱情、奔放、喜悅、慶典 ；黑色代表著嚴肅、夜晚、沉著； 黃色代表著高貴、富有 ；白色代表著純潔、簡單 ；藍色代表著天空、清爽 ；綠色代表著大自然、生命、生機 ；灰色代表著陰暗與消極 ；紫色代表著浪漫和愛情； 棕色代表著土地等等。不同的顏色均代表不同的含義，所以我們在選擇色彩時還要根據頁面的主題來選擇主色調。這樣，我們的網頁才能更加令人賞心悅目而富有品味。

4 色彩的運用

世界包容著各種色彩，我們生活在一個五彩繽紛的環境中，而所有的色彩一直都刺激著我們的視覺器官。一個作品的好壞，往往是通過作品中的色彩來給人第一印象的。色彩的運用和我們生活中的烹飪及其的相似，采用不同的調味料而有了不同的味道，成功選配則味道鮮美，否則菜肴會令人難以下咽。

色彩的運用非常重要，如果應用不當則會產生事半功倍的效果。下面我們就來簡單看下色彩的運用。比如說紅色，紅色最能容易引起人的注意，紅色除了具有明視的效果之外，常被用來傳達具有活力、溫暖、前進等涵義的企業形象與精神，另外紅色也常用來作為警告、危險、禁止、防火等標示用色。我們經常會在一些場合或物品上看到紅色標示，通常不必仔細觀看內容，就能了解其具有警告危險之意。再來看紫色，紫色由于具有獨特的女性化氣息，在一些商業設計中，紫色也受到一定的限制，除了和女性有關的商品或企業形象之外，在其它類的設計中通常不采用為主色調。白色則是永遠流行的主要色，可以和任何顏色作搭配。在設計中，白色通常需和其他色彩搭配使用，純白色會帶給別人寒冷，嚴峻的感覺，所以在使用白色時，都會摻一些其他的色彩，如象牙白，米白，乳白等等。只有了解了色彩的真正含義，我們才能在網頁中充分把色彩的魅力凸顯出來。

5 色彩的選配

為了使網頁的整體畫面呈現穩定協調的感覺，通常我們對作品配色時都需要有顏色對比，這樣才能體現出網頁的美感。但是很多情況下大家都不明白怎么樣對比才是可行的，才能讓頁面更加奪目。方法很簡單，只要我們在設計中盡量避免使用些對比性差，顯得灰、臟的顏色和對比度不和諧以及讓人很不舒服的顏色基本就可以了。所有的顏色不但具有不同的特性，而且各種色彩之間也會產生一定的相關性和相對性。評價一種顏色是明亮還是暗淡，是寒冷還是溫暖，一定要和其他色彩相比才能進行判斷，單獨使用一種顏色是無法評價其顏色好看與否的。比如橙色：橙色具有輕快、溫馨、時尚的效果，是種能代表著快樂、喜悅和能量的色彩。在整個色譜里，橙色是最耀眼的色彩，通常給人以華貴而溫暖，興奮而熱烈的感覺，也是令人振奮的顏色。而橙色的飽和度和亮度同時達到最高值時，如果運用在網頁中，整個頁面的視覺刺激是非常強烈的。所以在搭配顏色中，特別要注意。在對以橙色為底色的頁面設計中，通常我們可以選擇白色、灰白色來為橙色配色，這樣會使頁面更加生動，同時也起到了點睛的作用，從而達到突出主題的效果。如果你選擇黑色和藍色那效果就大不相同了。色彩的對比效果可以做到很強烈，也可以做到很柔和，但要注意，突出的色彩使用太多會造成注意力的分散，只能破壞構圖的統一，并不能起到點睛的作用。總之，對于一個好的作品而言，背景色的深淺問題也是要考慮的。

另外，如果把一種華麗的顏色和樸素的顏色放在一起，也會發生不同的對比效果。尤其是那些特性不明顯的色彩，也可以通過對比的方法，把它們表現出來。如果色彩搭配的好，鮮艷的色彩不僅會掩蓋另一個灰暗的顏色，而且還可以提高它的色彩效果。比如灰色：把它放在暖色旁邊，它就有些偏冷，那如果把它放在冷色旁邊，看上去就有些偏暖的感覺。色彩還有一個特性，可以通過在面積上進行對比來看出。比如，大面積界限分明的色調會使頁面具有力量和生氣，在網頁中利用小范圍的點綴色來點睛的話，也可以提升網頁的品味。如果色彩在面積上應用不當的話，則會影響到頁面的主次關系。

除此之外我們還要考慮主頁底色（背景色）的深、淺問題。底色深的背景，那么相對網頁中文字來說，其顏色就要淺，要以深色的背景襯托淺色的內容；反之，底色如果淡的話，文字的顏色就要深些，以淺色的背景襯托深色的內容。若網頁中我們采用黑色作為底色的，其文字就不可以選用較深的色彩，由于色彩的明度比較接近，大家在瀏覽及閱讀網頁時，眼睛就會感覺很吃力，從而影響了閱讀效果。當然，色彩的明度也不能變化太大，否則屏幕上的亮度反差太強，同樣也會使瀏覽者的眼睛受不了。

6 總結

總之，色彩在網頁制作中的作用是非常重要的，色彩運用的好壞直接影響網頁的質量。我們在設計網頁的色彩過程中，要尤其注意色彩的選擇和搭配，拋開網頁內容不談，好的色彩感覺是人們對這個網頁好印象的開始，這點尤其的重要。

參考文獻：

[1] 龔祥國.Photoshop圖像處理實用教程[M].北京：科學出版社，2004.

[2] 顧群業.網頁配色密碼[M].北京：清華大學出版社，2006.

[3] 叢琳.網頁配色構圖細節設計[M].北京：人民郵電出版社，2008.

[4] 朱介英.色彩學：色彩設計與配色[M].北京：中國青年出版社，2004.