網(wǎng)頁設(shè)計(jì)配色應(yīng)用——色彩的對(duì)比(4)_網(wǎng)頁配色教程
■ 冷暖對(duì)比
是指不同色彩之間的冷暖差別形成的對(duì)比。色彩分為冷、暖兩大色系,以紅、橙、黃為暖色體系,藍(lán)、綠、紫則代表著冷色系,兩者基本上互為補(bǔ)色關(guān)系。另外,色彩的冷暖對(duì)比還受明度與純度的影響,白光反射高而感覺冷,黑色吸收率高而感覺暖。
→ 冷暖對(duì)比網(wǎng)頁例圖:http:// disney.go.com
冷暖對(duì)比分析:
以上這幾組顏色乍一看感覺鮮艷程度都差不多,但是通過觀察它們的數(shù)值發(fā)現(xiàn)飽和度都有相差,然而明度相近,因此它們給人造成的視覺感受幾乎是相同的。該頁面冷暖顏色較為豐富,橙和藍(lán)是對(duì)比最強(qiáng)烈的補(bǔ)色,其次是傾向不夠明顯的補(bǔ)色黃、紫。明度不同的兩個(gè)綠色起到了冷暖視覺的過渡作用。主色調(diào)的淺藍(lán)色亮度較高,讓頁面不易給人沉悶的感覺。
結(jié)論:
冷暖對(duì)比的應(yīng)用,通常在休閑娛樂網(wǎng)站、食品網(wǎng)站出現(xiàn)比較多。
將這兩個(gè)色系的色彩安排在同一畫面時(shí),其對(duì)比效果極為強(qiáng)烈。通常初學(xué)者較輕易使兩色相互排斥,導(dǎo)致畫面色調(diào)不諧調(diào)。一般我們采用兩種調(diào)和的方法。
純度調(diào)整
降低冷暖兩色純度。用明度黑、白、灰變化來調(diào)整畫面的層次、直接使用黑、白、灰色系進(jìn)入畫面搭配,或者加入補(bǔ)色的諧調(diào),也都能很好的起到協(xié)調(diào)的效果。
→ 純度調(diào)整網(wǎng)頁例圖:http:// www.darkelephant.com 
純度調(diào)整分析:
主色調(diào)的橙色,添入了少許黑色做漸變背景色,降低了純度。輔助色的藍(lán)色是橙色的補(bǔ)色,主要起的是使得整個(gè)頁面過多的暖色降低協(xié)調(diào)于整體的效果,及背景色的棕色都分別提暗降低純度。而左上角的黃色則通過提高了亮度來降低純度。一個(gè)頁面里應(yīng)有少量純度較高的顏色而不至于使整個(gè)頁面過于壓抑,純度亮度很高的點(diǎn)睛色紅色就起到了這個(gè)作用。
結(jié)論:
純度的調(diào)整主要是通過明度黑、白、灰變化來調(diào)整畫面的層次,適當(dāng)?shù)募尤胙a(bǔ)色也是其中的一個(gè)辦法。
面積調(diào)整
主次的面積區(qū)分。根據(jù)設(shè)計(jì)主題的需要,在畫面的面積上以一方為主色,于是就掌控畫面的色調(diào)作用,其他的顏色在使用面積上拉開距離,使畫面的主次關(guān)系更突出,在統(tǒng)一的同時(shí)富有變化。
→ 面積調(diào)整網(wǎng)頁例圖:http:// www.upstairz.com
面積調(diào)整分析:
作為大面積使用的主色調(diào)--飽和度和亮度為最高值的橙色,通過適當(dāng)面積的白色加入?yún)f(xié)調(diào)和平衡了視覺的作用外,主體物的深紅紋樣的圖片點(diǎn)綴著純度、亮度較高的紅色有醒目作用,縮小面積而卻又能突出于視覺中心點(diǎn),疏密構(gòu)圖的對(duì)比效果。
結(jié)論:
大面積的顏色和小面積使用的顏色可以拉開主次關(guān)系,位置的正確安排也是一個(gè)方面
■ 面積對(duì)比
同一種色彩,面積越大,明度、純度越強(qiáng),面積越小,明度、純度越低。面積大的時(shí)候,亮的色顯得更輕,暗的色顯得更重。這種現(xiàn)象稱為色彩的面積效果。面積對(duì)比是指頁面中各種色彩在面積上多與少、大與小的差別,影響到頁面主次關(guān)系。
面積的對(duì)比,可以是中高低明度差的面積變化及中高低純度差的面積變化�!�
→ 面積對(duì)比網(wǎng)頁例圖:http:// www.parkpack.ru
面積對(duì)比分析:
作為大面積使用的主色調(diào)--飽和度和亮度為最高值的橙色,通過適當(dāng)面積的白色加入?yún)f(xié)調(diào)和平衡了視覺的作用外,主體物的深紅紋樣的圖片點(diǎn)綴著純度、亮度較高的紅色有醒目作用,縮小面積而卻又能突出于視覺中心點(diǎn),疏密構(gòu)圖的對(duì)比效果。
結(jié)論:
大面積的顏色和小面積使用的顏色可以拉開主次關(guān)系,位置的正確安排也是一個(gè)方面。
下一節(jié)我們介紹色彩的調(diào)和
- 網(wǎng)站配色指南-互聯(lián)網(wǎng)的色彩心理學(xué)
- 網(wǎng)頁設(shè)計(jì)配色基礎(chǔ)分析:RGB與HSB
- 網(wǎng)頁設(shè)計(jì)色彩搭配寶藍(lán)色的介紹
- 看圖學(xué)配色藝術(shù),學(xué)習(xí)設(shè)計(jì)
- 學(xué)習(xí)HTML的一些關(guān)于顏色方面的參考
- 網(wǎng)頁配色:正文中國傳統(tǒng)色彩名錄
- 韓國在線配色網(wǎng)頁
- 網(wǎng)頁設(shè)計(jì)配色:原色
- 網(wǎng)頁設(shè)計(jì)配色:和色
- 網(wǎng)頁設(shè)計(jì)配色應(yīng)用實(shí)例剖析——黑色系
- 主流web2.0網(wǎng)站的配色參考方案
- 網(wǎng)站設(shè)計(jì)中的對(duì)比配色和相近配色
- 相關(guān)鏈接:
- 教程說明:
網(wǎng)頁配色教程-網(wǎng)頁設(shè)計(jì)配色應(yīng)用——色彩的對(duì)比(4)
。
