網頁色彩搭配的藝術 報告學生：張建海 指導教授：吳有龍 老師.

Presentation on theme: "網頁色彩搭配的藝術 報告學生：張建海 指導教授：吳有龍 老師."— Presentation transcript:

1 網頁色彩搭配的藝術 報告學生：張建海 指導教授：吳有龍 老師

2 網頁的色彩搭配往往是網頁設計者感到頭疼的問題，尤其是那些缺乏美術基礎的設計者。到底用什麼色彩搭配好看呢？
要想做出一幅漂亮的網頁可不是一件輕易的事，除了熟練運用各種網頁設計工具和程式語言之外，美術的知識也不能不懂，下面讓我們來探討一點有關網頁設計中色彩搭配的知識。

3 色彩的含義 色彩本身是無任何含義的，有的只是人賦予它的。但色彩確實可以在不知不覺間影響人的心理，左右人的情緒，所以就有人給各種色彩都加上特定的含義。

4 紅色 紅色的色感暖和，性格剛烈而外向，是一種對人刺激性很強的色。紅色輕易引起人的注重，也輕易使人興奮、激動、緊張、沖動、還是一種輕易造成人視覺疲憊的顏色。 強有力、喜慶的色彩，很輕易使人有興奮感覺，是一種雄壯的精神體現。

5 1、在紅色中加入少量的黃，會使其熱力強大，趨
于躁動、不安。 2、在紅色中加入少量的藍，會使其熱性減弱，趨 于文雅、柔和。 3、在紅色中加入少量的黑，會使其性格變的沉穩 ，趨于厚重、樸實。 4、在紅中加入少量的白，會使其性格變的溫柔， 趨于含蓄、羞澀、嬌嫩。

6 黃色 黃色的性格冷漠、高傲、敏感、具有擴張和不安寧的視覺印象。黃色是各種色彩中，最為嬌氣的一種色。只要在純黃色中混入少量的其它色，其色相感和色性格均會發生較大程度的變化。 亮度最高的色，給人感覺就是很有暖和感，燦爛輝煌。

7 1、在黃色中加入少量的藍，會使其轉化為一種鮮
嫩的綠色。其高傲的性格也隨之消失，趨于一 種平和、潮潤的感覺。 2、在黃色中加入少量的紅，則具有明顯的橙色感 覺，其性格也會從冷漠、高傲轉化為一種有分 寸感的熱情、暖和。 3、在黃色中加入少量的黑，其色感和色性變化最 大，成為一種具有明顯橄欖綠的復色印象。其 色性也變的成熟、隨和。 4、在黃色中加入少量的白，其色感變的柔和，其 性格中的冷漠、高傲被淡化，趨于含蓄，易于 接近。

8 藍色 藍色的色感冷嘲熱諷，性格樸實而內向，是一種有助于人頭腦冷嘲熱諷靜的色。藍色的樸實
、內向性格，常為那些性格活躍、具有較強擴張力的色彩，提供一個深遠、廣埔、平靜的空間，成為襯托活躍色彩的友善而謙虛的朋友。藍色還是一種在淡化后仍然似能保持較強個性的色。假如在藍色中分別加入少量的紅、黃、黑、橙、白等色，均不會對藍色的性格構成較明顯的影響力。 永恒、博大，大家可以看看天空！給人感覺平靜、理智。

9 綠色 綠色是具有黃色和藍色兩種成份的色。在綠色中，將黃色的擴張感和藍色的收縮感相中庸，將黃色的暖和感與藍色的嚴寒感相抵消。這樣使得綠色的性格最為平和、安穩。是一種柔順、舒適、潢足、美麗的色。 漂亮、優雅，給人感覺大度、寬容。

10 1、在綠色中黃的成份較多時，其性格就趨 于活潑、友善，具有幼稚性。 2、在綠色中加入少量的黑，其性格就趨于 莊重、老練、成熟。 3、在綠色中加入少量的白，其性格就趨于 潔凈、清爽、鮮嫩。

11 紫色 紫色的明度在有彩色的色料中是最低的。紫色的低明度給人一種沉悶、神秘的感覺。

12 1、在紫色中紅的成份較多時，其知覺具有 壓抑感、威脅感。 2、在紫色中加入少量的黑，其感覺就趨于 沉悶、傷感、恐怖。 3、在紫色中加入白，可使紫色沉悶的性格 消失，變得優雅、嬌氣，并布滿女性的 魅力。

13 白色 白色的色感光明，性格樸實、純潔、快樂 。白色具有圣潔的不容侵犯性。假如在白色中加入其它任何色，都會影響其純潔性 ，使其性格變的含蓄。
有時給人無盡的希望感覺，但有時也給人一種懼怕和悲哀的感受。

14 1、在白色中混入少量的紅，就成為淡淡的粉色，鮮
嫩而布滿誘惑。 2、在白色中混入少量的黃，則成為一種乳黃色，給 人一種香膩的印象。 3、在白色中混入少量的藍，給人感覺清冷、潔凈。 4、在白色中混入少量的橙，有一種乾燥的氣氛。 5、在白色中混入少量的綠，給人一種稚嫩、柔和的 感覺。 6、在白色中混入少量的紫，可誘導人聯想到淡淡的 芳香。

15 色彩的對比 不同色彩之間的對比會有不同的效果。當兩種顏色同時在一起時，這兩種顏色各自走向自己的極端。例如：紅色與綠色對比，紅的更紅，綠的更綠；黑色與白色對比，黑的更黑，白的更白。由于人的視覺不同，對比的效果通常也會有不同。當大家長時間看一種純色，例如紅色，然后再看看四周的人，你會發現四周的人臉色會成綠色，正是因為紅色與四周顏色的對比，形成了對我們視覺的刺激。色彩的對比會受很多因素影響，例如色彩的面積、時間、亮度等等。

16 色彩的對比有很多方面，色相的對比就是其中的一種。當我們用湖藍與深藍對比時，你會發覺深藍帶點紫味，而湖藍則有點綠味。各種純色的對比會產生鮮明的色彩效果，很輕易給人帶來視覺與心理的滿足。

17 紅色與黃色對比：紅色會使人想起玫瑰的味道，而黃色則會使人想起檸檬的味道。
綠色與紫色對比：很有鮮明特色，令人感覺到活潑、自然。 而紅、黃、藍三種顏色是最極端的色彩，它們之間對比，哪一種顏色也無法影響對方。 色彩間的對比也有純度對比，舉個例子，黃色是奪目的色，但是加入灰色會失去其奪目的光彩，通常可以用混入黑、白、灰色來對比純色，這樣可以減低其純度。純度的對比會使色彩的效果更明確肯定。

18 色彩的大小和外形 有很多因素可以影響色彩的對比效果，色彩的大小就是其中最重要的一項，假如兩種色彩同樣大小，那麼這兩種顏色之間的對比十分強烈，但是當其中的一種大小變得不一樣時，小的一種色就會成為大的色的補充。色彩的大小會令色彩的對比有一種生動效果，嘗試在一大片綠色中加入一小點紅色，你會注重到紅色在綠色的襯托底下很搶眼，這就是色彩的大小對對比效果的影響，在大面積的色彩陪襯下，小面積的純色會突出非凡的效果，但是假如用較淡的色彩，則會讓你感覺不到這種色彩的存在。譬如在黃色中加入淡灰色，你根本就不會注重到淡灰色。

19 在不同的外形上面，同一種色彩也會有不同的效果，試試在一個正方形和一條線上用紅色，你會發現，正方形更能表現紅色穩重、喜慶的感覺。不同的外形會使同一種色彩產生不同的效果，個人認為，圓形最好用藍色，這樣給人遼闊博大的感覺。三角形用黃色，三角形的尖銳感與黃色的刺目感配合起來。梭形建議用鮮藍色，平行四邊形用綠色……

20 色彩的位置 色彩所處的位置不同也會造成色彩對比的不同。試把兩個同樣大小的色彩放在不同的位置，譬如前后，則你會覺得后面的顏色要比前面的顏色暗些。正是由于所處的位置的不同，導致眼睛的視覺的不同。我喜歡在畫圖中使用漸層工具，無它，則會覺得多種色彩在一起會有一種不同的效果，有如音樂中的Do、Re、Mi、Fa……變化，同樣的色相但純度不同的色彩組合在一起會有令人吃驚的效果，不要以為漸層很簡單，它內含著色彩運用的一項重要的運用。

21 色彩的漸層變化裡，暗色中含高亮度的對比，會給人清楚、激烈的感覺。很強烈的刺激如深黃到鮮黃色，暗色中間含高亮度的對比，會給人沉著、穩重深沉的感覺。如深紅中間是鮮紅。中性色與低高度的對比，給人模糊、朦朧、深奧的感覺，如草綠中間是淺灰。純色與高亮度的對比，給人跳躍舞動的感覺，如黃色與白色的對比 。純色與低亮度的對比，給人輕柔、歡快的感覺，如淺藍色與白色。純色與暗色的對比，給人強硬、不可改變的感覺。

22 大型的NBA網站。通常我們經常看到的此類網站以白色為背景，但是這個網站卻用灰黑色為底色。這樣的配色可以顯示獨特的個性，又不失大型網站的風采。

23 娛樂類的綜合性網站UGO，他的配色方案是背景色為黑色為底中嵌套藍色主體。雖以黑藍為主色調，但是配以生動的圖片，給人的感覺是生氣盎然，布滿了互動色彩和青春氣息。

24 採用黃色調為主，很體現公司的個性。顏色搭配。主色調為黃色為底，輔助色調為綠色，字體為棕色，中間再配以抽象的圖片，顯得個性十足但又不單調。

25 雖然是簡單的設計，但顏色的使用使網頁視覺感受上並不呆板，反而讓人感覺到一股濃濃的生活和家庭氣氛，使人置身於漂亮和愛中。

26 這個例子的菜單就使用了七種顏色，但是我們看到的網頁並不雜亂，相反的，感覺作者很有創意。

27 網頁設計的顏色搭配需要在實踐中不斷的摸索和不斷的創新，認真學習別人的先進方法和經驗，可以快速的提高我們的設計水平。可以說。網頁顏色搭配得當，成功也就走了一半。

28 參考資料： http://www.cncfan.com/html/?75_1587.html 網頁色彩搭配的設計藝術
網頁色彩搭配的技巧 網頁配色教程

29 簡報完畢 敬請指教