【示例】藍(lán)色與鄰近色綠色搭配的網(wǎng)頁(yè)設(shè)計(jì)示例截圖如圖所示。
【分析】從HBS模式的S飽和度數(shù)值100%上看,不少用戶會(huì)很疑惑,誤以為較為柔和的顏色飽和度或許會(huì)低,刺眼的顏色通常飽和度較高,其實(shí)不然,每個(gè)顏色有每個(gè)顏色的不同屬性特性。高純度的色彩,明度的降低是協(xié)調(diào)視覺(jué)的一個(gè)因素,容易給人造成低純度的錯(cuò)覺(jué)。
不同塊面的鄰近色交錯(cuò)排列,增強(qiáng)本頁(yè)面視覺(jué)動(dòng)感。輔色調(diào)淺藍(lán)色是背景色白色和主色調(diào)藍(lán)色的中間色,它形成了頁(yè)面配色的中間色階,色彩層次感增強(qiáng)以外,還使整個(gè)頁(yè)面的顏色更為和諧。另一輔色調(diào)青色,是藍(lán)色和綠色的結(jié)合體,包括在標(biāo)志文字、文字標(biāo)題上的運(yùn)用,無(wú)疑活躍了整個(gè)頁(yè)面的配色環(huán)境。
兩個(gè)點(diǎn)睛色都略調(diào)高了明度,另一意義上是該頁(yè)面配色的中間色階。兩點(diǎn)睛色都是在主色調(diào)藍(lán)色、輔色調(diào)青色的基礎(chǔ)上衍生出來(lái)的顏色,這里“點(diǎn)睛”的作用不大,都屬于和諧色系。
【點(diǎn)評(píng)】很多站點(diǎn)都在使用藍(lán)色與青綠色的搭配效果。藍(lán)色、青綠色、白色的搭配可以使頁(yè)面看起來(lái)非常干凈清澈,在我們的現(xiàn)實(shí)生活中運(yùn)用的范圍很廣,可以說(shuō)是隨處可見(jiàn)的。
主顏色選擇明亮的藍(lán)色,配以白色的背景和灰亮的輔助色,加上中間色階的運(yùn)用,可以使頁(yè)面有干凈整潔,給人莊重、充實(shí)的印象。這是一組非常愉悅和諧的鄰近色系配色。中間色適度面積的運(yùn)用及背景白色讓這組顏色特征發(fā)揮到了極致。
藍(lán)色+紅色
【示例】藍(lán)色與紅色強(qiáng)對(duì)比網(wǎng)頁(yè)設(shè)計(jì)示例截圖如圖所示。
【分析】藍(lán)色是冷色系的最典型的代表了,而紅色是暖色系里最典型的代表,兩冷暖色系對(duì)比下讓全頁(yè)的色彩對(duì)比異常強(qiáng)烈且興奮,很容易感染帶動(dòng)瀏覽者的激昂情緒。紅色把文字圖片框起來(lái),在藍(lán)色背景對(duì)比下,很好地突出主題,又好似模仿投影熒屏的感覺(jué),讓人迅速地聚焦于視頻中心,達(dá)到網(wǎng)站背后的最終目的。輔色調(diào)是紅色,從數(shù)值上看接近于正紅色,紅色對(duì)視覺(jué)傳遞的信息是很快的,屬于高昂響亮的顏色。點(diǎn)睛色分別是黃色、黃綠色。
大家知道,黃色是明度最高的顏色,也較響亮、刺目,在這里的運(yùn)用能強(qiáng)烈地突現(xiàn)標(biāo)題。從大的方面來(lái)看,點(diǎn)睛色黃綠色與輔助色紅色是對(duì)比色,雖然面積不太大,只小范圍的對(duì)比,但是已經(jīng)足以達(dá)到了迅速傳遞信息的效果,讓人印象深刻,促成再訪點(diǎn)擊。
【點(diǎn)評(píng)】冷暖色系的對(duì)比碰撞,充滿激情,能傳遞熾熱情感、強(qiáng)烈刺激主題的目的。該頁(yè)面運(yùn)用了冷暖、紅綠兩種比較鮮明的對(duì)比色,配色積極大膽,視覺(jué)沖擊力很強(qiáng)。
藍(lán)色+暖色
【示例】藍(lán)色同類色(藍(lán)色+暖色)對(duì)比網(wǎng)頁(yè)示例截圖如圖所示。
亮度的正黃色在這個(gè)頁(yè)面的使用。難度三,黑色的運(yùn)用。運(yùn)用排除法細(xì)分得到:主色調(diào)、輔色調(diào)的藍(lán)色飽和度一樣都是最高值,色相H上稍微有些微妙區(qū)別,亮度上有些變化。點(diǎn)睛色藍(lán)色飽和度和明度都較低,介于兩種藍(lán)色之間。三者面積如果用得不好頁(yè)面容易呈混沌的灰色狀態(tài)。拿出輔色調(diào)藍(lán)色,再回到整個(gè)頁(yè)面的配色來(lái)看,頁(yè)面色彩偏重,亮度不夠,缺少中間色階,冷暖主次傾向不夠明顯,這時(shí)把輔色調(diào)藍(lán)色添加進(jìn)去正好彌補(bǔ)了這種缺憾。
HSB模式顯示H是60度,S飽和度與B明度都是100%,正是正黃色。正黃色只適合做小面積的點(diǎn)睛色使用,大面積使用頁(yè)面配色較難協(xié)調(diào),當(dāng)然正黃色作為主色調(diào)能好配色些。在這樣的頁(yè)面色彩組合里,黑色是很難運(yùn)用進(jìn)去的,面積使用多了,頁(yè)面有可能會(huì)破壞所營(yíng)造的氛圍、產(chǎn)生不協(xié)調(diào)的感覺(jué)。只在輔助性地勾勒于邊框是很好的使用辦法。圖片里的產(chǎn)品顏色,有降低純度的棕黃色、土黃色、米黃色等同類黃色系,對(duì)該頁(yè)面設(shè)計(jì)色彩組合調(diào)配具有一定的協(xié)調(diào)能力。
【點(diǎn)評(píng)】通常矢量頁(yè)面的配色相對(duì)于圖片配色來(lái)說(shuō),難度較大,色彩的組織搭配,是根據(jù)設(shè)計(jì)師們自己以往的豐富配色經(jīng)驗(yàn),反復(fù)調(diào)配、反復(fù)加減而得。
該頁(yè)面設(shè)計(jì)師選取了頁(yè)面的產(chǎn)品圖片中的兩三種顏色,例如點(diǎn)睛色里的紅色、藍(lán)色和黃色,再大膽地發(fā)揮出主色調(diào)藍(lán)色、較淺的輔色調(diào)藍(lán)色和點(diǎn)睛色正黃色,點(diǎn)睛色黃色運(yùn)用于最能突出產(chǎn)品特色的文字上,這些和諧的元素生動(dòng)趣味,讓整個(gè)頁(yè)面充滿了故事情節(jié)。