網頁色彩與配色

到的色彩皆是由色光混合所組成，屬於「加法混合」(圖 2-4-1)，紅(orange red)、綠 (green)、藍(violet blue)為基礎的表色法，主要應在底片、電視、電腦影像之傳達（楊

圖2-4-1 RGB 加法混色

生活中的電視或是其他視訊媒體都是以 RGB 色彩模式為基礎的色彩模式，甚至 RGB 色彩模式電腦的影像應用軟體上必備的基本模式（鄭柏左，民 93）。由這三種最 基本顏色的光再去混合，就可以產生很多種不同的顏色，這三原色的光隨著能量的不 同，可以有各式各樣的混合，甚至可產生1600 萬種以上的顏色（楊朝銘，民 92）（24 位元色彩深度）。

網頁安全色是安全的調色盤(圖 2-4-2)，使得色彩不會隨著電腦的作業系統、電腦 的等級及瀏覽器的不同而有所改變，也不會產生色偏(color shift)的 216 種顏色，是網 頁設計上作為色彩選擇的基本要素。

圖 2-4-2

網頁安全色 （圖片來源：楊朝明（譯）（民92）。Web 好色-網頁色彩學。（原作者：Image Research Institute Inc. ）。台北，博碩文化股份有限公司。）

安全色是由紅、綠、藍的數位訊號以0, 51, 102, 153, 204, 255 等數值依照 6×6×6 所 組成的數位色彩，共有210 種有色彩和 6 種無色彩共同組合，其中 RGB 被分為六個階 段，分別為 00、33、66、99、CC、FF，而三原色的組合則產生 216 色，在網頁使用的 表色法中，常能看到「#FFCC33」 等的標色方式，其實是依序 RGB 的含量所排列，而

#FFCC33 中的 FF 為 R 色光 的含量，CC 為 G 色光的含量，33 為 B 色光含量(表 2-4-1)（楊朝明民 92）。

表 2-4-1

216 安全色 RGB 含量表

(少) ← 含量 → (多)

R 00 33 66 99 CC FF

G 00 33 66 99 CC FF

B 00 33 66 99 CC FF

門學問。楊朝銘（民 92）認為，在網頁配色的規則，首先設定網頁的主要色彩(Main Color)，然後再選出適合的次要色(Sub Color)來組合。鄭國裕、林盤聳（民 76）進一步 指出，色相、明度、彩度為構成色彩的三個基本要素，故在配色時應從這三個方向下 手。

在色相配色方面，一般以色相為主的配色，大多都會以色相環（圖2-4-3）照色彩 在色相環上的位置所形成的角度搭配色相環上的調和區域（圖2-4-4）來配色，其色相 配色方式及其效果呈現則如表 2-4-2 所示。

圖2-4-3

色相環（圖片來源：鄭國裕、林盤聳（民76）。色彩計劃（頁 71）。台北，藝風堂）

圖2-4-4

色相環上的調和區域（圖片來源：鄭國裕、林盤聳（民76）。色彩計劃（頁 71）。台北，

藝風堂）

表 2-4-2

圖2-4-5

高低調子 （圖片來源：鄭國裕、林盤聳，民 76。色彩計劃（頁 76）。台北，藝風堂）

表2-4-3

表2-4-4

彩度配色方式及其效果呈現一覽表

配色方式 呈現效果

類似彩度配色 指六階之內的彩度變化配色，差異不大，高彩度的類似彩度配 色有鮮艷、華麗的效果，低彩度的類似彩度配色，則呈現柔和

、穩重、樸素、典雅的特質，若再加入色相及明度的變化，可 使畫面顯得更加活潑、生動。

對比彩度配色 距離六階以上的彩度變化配色效果，會產生鮮明、突出的特色

，若再加上色相及明度的變化，則會增加華麗、鮮艷、輝煌、

耀眼之感。

資料來源：鄭國裕、林盤聳，民76。「色彩計劃」（頁 76）。台北，藝風堂。

上述有關色相配色、明度配色、以及彩度配色的基本原則，提供設計者在進行網 頁視覺設計時，一個明確的色彩和配色上的依據。然而，瀏覽者在接受網頁色彩的刺 激時，對於色彩意象與聯想則是另一個涉及認知心理層次的議題。