consulting

76-ui.jpg
網頁設計中色彩的運用真是太重要了!充分瞭解色彩的原理
會員評比: / 15
最差最好 
知識庫文章 - 網站設計製作知識文章

色彩的運用在網頁中的作用真是太重要了,有些網頁看上去十分典雅、有品位,令人賞心悅目,但是頁面結構卻很簡單、圖像也不複雜,這主要是色彩運用得當,因此我特地將本來屬於圖像製作內的色彩作為一個獨立攔目來介紹。

1、色彩基本概念
自然界中的顏色可以分為非彩色和彩色兩大類。非彩色指黑色、白色和各種深淺不一的灰色,而其他所有顏色均屬於彩色。任何一種彩色具有三個屬性:
(1)色相(Hue):也叫色澤,是顏色的基本特徵,反映顏色的基本面貌。
(2)飽和度(Saturation):也叫純度,指顏色的純潔程度。
(3)明度(Brightness或Lightness或Luminousity):也叫亮度,體現顏色的深淺。
非彩色只有明度特徵,沒有色相和飽和度的區別。

2、色彩的三原色
電腦螢幕的色彩是由RGB(紅、綠、藍)三種色光所合成的,而我們可通過調整這三個基色就可以調校出其他的顏色,在許多圖像處理軟體裏,都有提供色彩調配功能,你可輸入三基色的數值來調配顏色,也可直接根據軟體提供的調色板來選擇顏色。

3、電腦影像的色彩
電腦影像的色彩是經由位元元(BIT)的計算和組合而來,單純的黑白圖像是最簡單的色彩結構,在電腦上用到1位元元的資料,雖說只有黑色和白色,但仍能透過疏密的矩陣排列,將黑與白組合成近似視覺上的灰色調階。
灰階(Grayscale)的影像共有256個階調,看起來類似傳統的黑白照片;除黑、白二色之外,尚有254種深淺的灰色,電腦必須以8位元元的資料,顯示這256種階調。
全彩(Fullcolor)是指RGB三色光所能顯示的所有顏色,每一色光以8位元表示,各有256種階調,三色光交互增減,就能顯示24BIT的1677萬色(256*256*256=16,777,216),這個數值就是電腦所能表示的最高色彩,也就是通稱的RGBTureColor。

8位元色是指具有256種階調,或256種色彩的影像,而我們在常常見到GIF格式的圖像檔就是帶有256種色彩的圖像檔。若要把24位元元的全彩圖片轉成256色的8位元,通常必須經過索引的步驟(Indexed),也就是在原本24位元的1677萬色中,先建立顏色分佈表(histogram),然後再找出最常用的256種顏色,定義出新的調色盤,最後再以新色盤的256色取代原圖。
讓我們看看每一位元色包含多少種顏色:
1位 2種顏色
2位 4種顏色
4位 16種顏色
8位 256種顏色
16位 65536種顏色
24位 1677萬種顏色
32位 1677萬種顏色和256級灰度值
36位 687億種顏色和4096級灰度值

通常所稱的標準VGA顯示模式是8位元顯示模式,即在該模式下能顯示256種顏色;而高彩色(Hi Color)顯示是16位元顯示模式,能顯示65536種顏色,也稱64K色;還有一種真彩色(True Color)顯示模式是24位元顯示模式,能顯示1677萬種顏色,也稱16M色,這是現在一般PC機所能達到的最高顏色顯示模式,在該模式下看到的真彩色圖像的色彩已和高清晰度照片沒什麼差別了。

在圖形製作片中我們已提到過色彩在頁面中的重要性,在頁面中儘量使用看上去比較淡雅、簡潔的色彩;比如背景儘量少用灰暗、深沉的色彩(除非特殊需要),並且根頁面的主題來選擇主色調,可能有一些不搞美術的朋友不知道色彩代表的含義,請參閱下表:
紅色:代表熱情、奔放、喜悅、慶典
黑色:代表嚴肅、夜晚、沉著
黃色:代表高貴、富有
白色:代表純潔、簡單
藍色:代表天空、清爽
綠色:代表植物、生命、生機
灰色:代表陰暗、消極
紫色:代表浪漫、愛情
棕色:代表土地
上面舉出的是幾種主要色彩的含義,希望對你有所幫助。

現在我們對色彩有了基本的瞭解,那麼我們如何在一個網頁中合理搭配色彩呢?如果你對美術比較瞭解,那就好辦了。反之你可能要耗費較大的工夫在上面。
首先在確定主頁的題材後,要瞭解哪些顏色適合哪些站點。比如一個影視的站點,基本上適用任何色彩,但小B認為用黑色或其他教深的色彩為主比較好,因為人們看電視、電影一般在黑暗的環境下觀看的,網頁上使用深色較符合人們的習慣;反之一個介紹醫院、醫學的站點就要使用淺色為主色,忖托其醫學站點的氛圍。
記住白色的頁面是萬能的風格這裏特別要注重的一點:頁面文字的顏色切記與鏈結的顏色區分開來。

(此篇文章為網路轉載,如有冒犯,請來信告知,當即刻移除!)