黑、白、灰色 我們曾經(jīng)說過,無彩色的在心理上與有彩色具有同樣的價(jià)值。黑色與白色時(shí)對色彩的更后抽象,代表色彩世界的陰更和陽更。太更圖案就是黑白兩色的循環(huán)形式來表現(xiàn)宇宙永恒的運(yùn)動(dòng)的。黑白所具有的抽象表現(xiàn)力以及神秘感,似乎能超越任何色彩的深度??刀∷够J(rèn)為,黑色意味著空無,像太陽的毀滅,像永恒的沉默,沒有未來,失去希望。而白色的沉默不是死亡,而是有無盡的可能性。黑白兩色是更端對立的色,然而有時(shí)候又令我們感到它們之間有著令人難以言狀的共性。白色與黑色都可以表達(dá)對死亡的恐懼和悲哀,都具有不可超越的虛幻和無限的精神,黑白又總是以對方的存在顯示自身的力量。它們似乎是整個(gè)色彩世界的主宰。
在色彩世界中,灰色恐怕是更被動(dòng)的色彩了,它是**的中性色,依靠鄰近的色彩獲得生命,灰色一旦靠近鮮艷的暖色,就會顯出冷靜的品格;若靠近冷色,則變?yōu)闇睾偷呐疑?。與其用“休止符”這樣的字眼來稱呼黑色,不如把它用在灰色上,因?yàn)闊o論黑白的混合、不色的混合、全色的混合,更終都導(dǎo)致中性灰色。灰色意味著一切色彩對比的消失,是視覺上更安穩(wěn)的休息點(diǎn)。然而,人眼是不能長久地、無線擴(kuò)大地注視著灰色的,因?yàn)闊o休止的休息意味著死亡。
色彩的表情在更多的情況下是通過對比來表達(dá)的,有時(shí)色彩的對比五彩斑斕、耀眼奪目,顯得華麗,有時(shí)對比在純度上含蓄、明度上穩(wěn)重,又顯得樸實(shí)無華。創(chuàng)造什么樣的色彩才能表達(dá)所需要的感情,完全依賴于自己的感覺、經(jīng)驗(yàn)以及想象力,沒有什么固定的格式。
大自然是彩色的。信息時(shí)代的快速到來,網(wǎng)絡(luò)也開始變的多姿多彩。人們不再局限于簡單的文字與圖片,他們要求網(wǎng)頁看上去漂亮,舒適。所以當(dāng)代設(shè)計(jì)者不僅要掌握基本的網(wǎng)站制作技術(shù),還需要掌握網(wǎng)站的風(fēng)格,配色等設(shè)計(jì)藝術(shù)。其中色彩在網(wǎng)站設(shè)計(jì)中占據(jù)相當(dāng)重要的地位。
一、 色彩的一些基本概念
首先了解一下色彩的一些基本概念。自然界中有好多好多種色彩,比如玫瑰是紅色的,大海是藍(lán)色的,桔子是橙色的……但是更基本的有三種(紅,黃,藍(lán)),其它的色彩都可以由這三種色彩調(diào)和而成。我們稱這三種色彩為“三原色”。
現(xiàn)實(shí)生活中的色彩可以分為彩色和非彩色。其中黑白灰屬于非彩色系列。其它的色彩都屬于彩色。任何一種彩色具備三個(gè)特征:色相,明度和純度。其中非彩色只有明度屬性。
色相,指的是色彩的名稱。這是色彩更基本的特征,是一種色彩區(qū)別于另一種色彩的更主要的因素。比如說紫色,綠色,黃色等等都代表了不同的色相。同一色相的色彩,調(diào)整一下亮度,或者純度很容易搭配,比如,深綠,暗綠,草綠,亮綠。
明度,也叫亮度,指的是色彩的明暗程度,明度越大,色彩越亮。比如一些購物,兒童類網(wǎng)站。用的是一些鮮亮的顏色,讓人感覺絢麗多姿,生氣勃勃。明度越低,顏色越暗。主要用于一些游戲類網(wǎng)站,充滿神秘感;一些個(gè)人站長為了體現(xiàn)自身的個(gè)性,也可以運(yùn)用一些暗色調(diào)來表達(dá)個(gè)人的一些孤僻,或者憂郁等性格。有明度差的色彩更容易調(diào)和。如紫色(
993399)跟黃色(
ffff00),暗紅(
cc3300)跟草綠(
99cc00),暗藍(lán)(
0066cc)跟橙色(
ff9933)等。圖1中的(1)就是明度由高到低變化的例子。
純度,指色彩的鮮艷程度,純度高的色彩純,鮮亮。純度底的色彩暗淡,含灰色。如圖1中的(2)是純度從低到高的變化。
相近色:色環(huán)中相鄰的三種顏色。如圖2中的黃綠色,黃色和桔黃色。相近色的搭配給人的視覺效果很舒適,很自然。所以相近色在網(wǎng)站設(shè)計(jì)中更為常用。
互補(bǔ)色,色環(huán)中相對的兩種色彩。如圖3中的亮綠色跟紫色,另外如紅色跟綠色,藍(lán)色和橙色等。對互補(bǔ)色,調(diào)整一下補(bǔ)色的亮度,有時(shí)候是一種很好的搭配。就拿藍(lán)色跟橙色來打個(gè)比方吧,看圖6,調(diào)整了藍(lán)色的亮度以后其搭配效果是不是更好呢?補(bǔ)色在網(wǎng)站設(shè)計(jì)中用得也更為普遍。
暖色,如圖5中的黃色,橙色,紅色,紫色等都屬于暖色系列。暖色跟黑色調(diào)和可以達(dá)到很好的效果。暖色一般應(yīng)用于購物類網(wǎng)站,電子商務(wù)網(wǎng)站,兒童類網(wǎng)站等等,用以體現(xiàn)商品的琳瑯滿目,兒童類網(wǎng)站的活潑,溫馨等等效果。
冷色,如圖6中的綠色,藍(lán)色,藍(lán)紫色等等都屬于冷色系列。冷色一般跟白色調(diào)和可以達(dá)到一種很好的效果。冷色一般應(yīng)用于一些高科技,游戲類網(wǎng)站,主要表達(dá)嚴(yán)肅,穩(wěn)重等效果。
色彩均衡,網(wǎng)站讓人看上去舒適,協(xié)調(diào),除了文字,圖片等內(nèi)容的合理排版,色彩的均衡也是相當(dāng)重要的一個(gè)部分。比如一個(gè)網(wǎng)站不可能單一的運(yùn)用一種顏色,所以色彩的均衡問題是設(shè)計(jì)者必須要考慮的問題。色彩的均衡,包括色彩的位置,每種色彩所占的比例,面積等等。比如鮮艷明亮的色彩面積應(yīng)小一點(diǎn),讓人感覺舒適,不刺眼。這就是一種均衡的色彩搭配。
二、 色彩的聯(lián)想
色彩在人們的生活中都是有豐富的感情和含義的。比如紅色讓人聯(lián)想到玫瑰,聯(lián)想到喜慶,聯(lián)想到興奮。白色聯(lián)想到純潔,干凈,簡潔;紫色象征著女性化,高雅,浪漫;藍(lán)色象征高科技,穩(wěn)重,理智;橙色代表了歡快,甜美,收獲;綠色代表了充滿青春的活力,舒適,希望等等。當(dāng)然不是說某種色彩一定代表了什么含義。在特定的場合下,同種色彩可以代表不同的含義。
三、 黑白灰的運(yùn)用
黑白灰是**色,可以跟任意一種色彩搭配。當(dāng)你為某種色彩的搭配苦惱的時(shí)候,不防試試用黑白灰。當(dāng)你覺得兩種色彩的搭配不協(xié)調(diào),試試加入黑色,或者灰色,或許會有意想不到的效果哦。
對一些明度較高的網(wǎng)站,配以黑色,可以適當(dāng)?shù)亟档推涿鞫取?
白色是網(wǎng)站用的更普遍的一種顏色。很多網(wǎng)站甚至留出大塊的白色空間,作為網(wǎng)站的一個(gè)組成部分。這就是留白藝術(shù)。很多設(shè)計(jì)性網(wǎng)站較多運(yùn)用留白藝術(shù)。留白,給人一個(gè)遐想的空間,讓人感覺心情舒適,暢快。恰當(dāng)?shù)牧舭讓τ趨f(xié)調(diào)頁面的均衡起到相當(dāng)大的作用。
四、 確定網(wǎng)站的主題色
一個(gè)網(wǎng)站不可能單一的運(yùn)用一種顏色,讓人感覺單調(diào),乏味;但是也不可能將所有的顏色都運(yùn)用到網(wǎng)站中,讓人感覺輕浮,花俏。一個(gè)網(wǎng)站必須有一種或兩種主題色,不至于讓客戶迷失方向,也不到于單調(diào),乏味。所以確定網(wǎng)站的主題色也是設(shè)計(jì)者必須考慮的問題之一。
一個(gè)頁面盡量不要超過4種色彩,用太多的色彩讓人沒有方向,沒有側(cè)重。當(dāng)主題色確定好以后,考慮其它配色時(shí),一定要考慮其它配色與主題色的關(guān)系,要體現(xiàn)什么樣的效果。另外哪種因素占主要地位,是明度,純度還是色相。
五、 頁面各要素
上面學(xué)習(xí)了顏色的一些基本概念及顏色的一些搭配問題,具體運(yùn)用到網(wǎng)頁中,各要素的色彩又是如何搭配的呢?
1. 背景與文字
如果一個(gè)網(wǎng)站用了背景顏色,必須要考慮到背景顏色的用色,與前景文字的搭配等問題。一般的網(wǎng)站側(cè)重的是文字,所以背景可以選擇純度或者明度較低的色彩,文字用較為突出的亮色。讓人一目了然。
當(dāng)然,有些網(wǎng)站為了讓瀏覽者對網(wǎng)站留有深刻的印象,他在背景上作文章。比如一個(gè)空白頁的某一個(gè)部分用了很亮的一個(gè)大色塊,是不是讓你豁然開朗呢!此時(shí)他為了吸引瀏覽者的視線,突出的是背景,所以文字就要顯得暗一些,這樣文字才能跟背景分離開來,便于瀏覽者閱讀文字。
2. LOGO和BANNER
LOGO和BANNER是宣傳網(wǎng)站更重要的部分之一,所以這兩個(gè)部分一定要在頁面上突迎而出。怎樣做到這一點(diǎn)呢?我們將LOGO和BANNER做的鮮亮一些,也就是色彩方面跟網(wǎng)頁的主題色分離開來。有時(shí)候?yàn)榱烁怀觯部梢允褂门c主題色相反的顏色。
3. 導(dǎo)航,小標(biāo)題
導(dǎo)航,小標(biāo)題是網(wǎng)站的指路燈。瀏覽者要在網(wǎng)頁間跳轉(zhuǎn),要了解網(wǎng)站的結(jié)構(gòu),網(wǎng)站的內(nèi)容,都必須通過導(dǎo)航或者頁面中的一些小標(biāo)題。所以我們可以使用稍微具有跳躍性的色彩,吸引瀏覽者的視線,讓他們感覺網(wǎng)站清晰,明了,層次分明。想往哪里走都不會迷失方向。
4. 鏈接顏色設(shè)置
一個(gè)網(wǎng)站不可能只是單一的一頁,所以文字與圖片的鏈接是網(wǎng)站中不可缺少的一部分。這里特別指出文字的鏈接,因?yàn)殒溄訁^(qū)別于文字,所以鏈接的顏色不能跟文字的顏色一樣。現(xiàn)代人的生活節(jié)奏相當(dāng)快,不可能浪費(fèi)太多的時(shí)間在尋找你網(wǎng)站的鏈接上。設(shè)置了前幾特的鏈接顏色,讓人感覺他的前幾特性,自然而然好奇心必然趨使他移動(dòng)鼠標(biāo),點(diǎn)擊鼠標(biāo)。
為了你的頁面更美觀,更舒適,為了增強(qiáng)你的頁面的可閱讀性,必須合理,恰當(dāng)?shù)剡\(yùn)用與搭配頁面各要素間的色彩
首先我們要確定鏈接圖標(biāo)的大小,如高為31,長為88,然后打開網(wǎng)頁編輯軟件建立文件“l(fā)ink.js”,內(nèi)容如下:
網(wǎng)站設(shè)計(jì)65條原則--網(wǎng)頁色彩的搭配-4,謝謝圍觀。
查看更多寧波網(wǎng)站制作網(wǎng)站設(shè)計(jì)色彩原則