網(wǎng)頁(yè)色彩搭配中深色背景的應(yīng)用

網(wǎng)頁(yè)色彩搭配中深色背景的應(yīng)用

　　隨著信息化時(shí)代的快速到來(lái)，網(wǎng)頁(yè)設(shè)計(jì)師已經(jīng)成為了一門新興職業(yè)。簡(jiǎn)單機(jī)械的將信息羅列在一起的頁(yè)面不再能滿足人們的審美需求，那些依靠未加修飾的圖片和隨意使用的色彩制作出來(lái)的頁(yè)面，在沒有欣賞價(jià)值的同時(shí)，也逐漸失去了用戶群。所以，越來(lái)越多的網(wǎng)站開始注重頁(yè)面的視覺效果，他們將計(jì)算機(jī)技術(shù)與藝術(shù)設(shè)計(jì)結(jié)合起來(lái)，在保證網(wǎng)站具有實(shí)用性的同時(shí)，也使頁(yè)面看上去更美觀、更舒適。

　　在藝術(shù)創(chuàng)作中，無(wú)論哪一個(gè)門類都離不開色彩，合理的使用顏色能夠讓平淡無(wú)味的畫面瞬間變得精彩。因此，色彩也被看做是設(shè)計(jì)中重要的一個(gè)因素。網(wǎng)頁(yè)的色彩設(shè)計(jì)是影響網(wǎng)站頁(yè)面效果的關(guān)鍵因素之一，它可以影響用戶對(duì)網(wǎng)頁(yè)性質(zhì)的判斷，對(duì)站點(diǎn)信息的理解，為頁(yè)面效果注入了生機(jī)和活力。所以說(shuō)，一個(gè)好的網(wǎng)頁(yè)設(shè)計(jì)離不開對(duì)色彩的研究和使用。

　　在網(wǎng)頁(yè)色彩的設(shè)計(jì)中，從色彩構(gòu)成中“色相”的概念出發(fā)，可大致將網(wǎng)頁(yè)色彩的搭配方法歸納為以下幾種：

　　其一，同色系色彩搭配。即利用同一色相的不同明度、純度的變化來(lái)進(jìn)行配色組合，例如檸檬黃、中黃和土黃的搭配，這些色彩由于色相的統(tǒng)一，所以在頁(yè)面中很容易調(diào)和。

　　其二，鄰近色搭配。即色相環(huán)上相鄰近的顏色，如綠色和藍(lán)色，紅色和黃色等。這種方法與“同色系色彩搭配”相比能產(chǎn)生相對(duì)豐富的畫面效果。

　　其三，互補(bǔ)色搭配。在色相環(huán)中，處于直徑位置的兩色為互補(bǔ)色，如藍(lán)色與橙色，紅色與綠色，紫色與黃色。互補(bǔ)色組合在一起使用時(shí)，會(huì)呈現(xiàn)強(qiáng)烈的相互輝映的視覺效果，具有很強(qiáng)烈的視覺沖擊力。

　　其四，對(duì)比色搭配。如紫色與綠色，藍(lán)色與黃色等。這種方法搭配出來(lái)的顏色由于色彩反差較大，所以需要第三種調(diào)和色來(lái)協(xié)調(diào)畫面。

　　在色彩構(gòu)成中，從“明度”的概念出發(fā)，還可以將網(wǎng)頁(yè)色彩分為高明度，中明度、低明度等類型，在這其中，低明度深色背景風(fēng)格的網(wǎng)頁(yè)產(chǎn)生的視覺效果更為獨(dú)特，也頗受歡迎。在互聯(lián)網(wǎng)中所能看到的深色背景的知名網(wǎng)站比比皆是，比如：nike.com，香奈兒官網(wǎng)，Louis Vuitton網(wǎng)站等。

　　作為網(wǎng)頁(yè)設(shè)計(jì)工作者，有必要了解深色背景設(shè)計(jì)的風(fēng)格特點(diǎn)，知道它所適用的范圍，并不斷探尋它在使用中的技巧和規(guī)律。

　　一、深色背景網(wǎng)頁(yè)的風(fēng)格特點(diǎn)

　　深色背景并非指黑色，它包含了一切明度較低的色彩，可以是深紅色、深藍(lán)色、深灰色或者其他任何一種低明度色彩，它可以有自己的色彩傾向，只是在明度上偏暗而已。

　　這種色調(diào)給人的感覺是沉穩(wěn)的、有力量的、莊重的、神秘的。因?yàn)樗�是一種明度較低的色彩，所以比較容易起到襯托作用，因此能夠與許多種色彩構(gòu)成良好的對(duì)比調(diào)和的關(guān)系，是最有力的搭配色。所以，在很多應(yīng)用深色背景的網(wǎng)站中，我們經(jīng)常能夠看到深底色與一些輔助顏色的搭配。輔助色可以在瞬時(shí)間打破頁(yè)面的沉悶感，引起瀏覽者的注意。

　　深色背景的合理運(yùn)用能散發(fā)出一種高品位高格調(diào)的氣息，具有極強(qiáng)的視覺沖擊力。無(wú)論頁(yè)面上使用的輔助色彩是何種色調(diào)，也不管它們的純度或?qū)Ρ榷龋�只要有深底色這一有力的色彩作為主色調(diào)去調(diào)和，那么頁(yè)面配色上都能夠達(dá)到和諧統(tǒng)一的效果。

　　二、適合使用深色背景的網(wǎng)站類型

　　深色背景的設(shè)計(jì)可以應(yīng)用在許多網(wǎng)站上，但并不是所有的主題都適用，這種風(fēng)格應(yīng)該與網(wǎng)站的性質(zhì)相搭配。由于深色背景明度較低，給人的心理感覺也較理性、沉穩(wěn)，所以他多被用在一些男性網(wǎng)站上，如：YOKA男士網(wǎng)，Allcoolmen.com，Trendscar.com.等專為男性服務(wù)的網(wǎng)站。

　　其次，深底色與高明度色彩的搭配通常可以表現(xiàn)出比較時(shí)尚的視覺效果，結(jié)合一些光感技巧，可令展示的產(chǎn)品更有質(zhì)感。因此，這種搭配也常被用于一些時(shí)尚的、優(yōu)雅的、比較現(xiàn)代的頁(yè)面設(shè)計(jì)之中，如：香奈兒官網(wǎng)，nike.com，blackberry中國(guó)官網(wǎng)、淑女屋服飾官網(wǎng)等。

　　此外，深底色也適用于一些比較有創(chuàng)意性的網(wǎng)站，比如設(shè)計(jì)公司或者一些張揚(yáng)個(gè)性的團(tuán)體（如搖滾樂(lè)隊(duì)）或個(gè)人的網(wǎng)站。

　　但對(duì)于一些包含眾多內(nèi)容與服務(wù)項(xiàng)目的大型門戶網(wǎng)站（如搜狐、雅虎、騰訊門戶網(wǎng)）來(lái)說(shuō)，清新簡(jiǎn)潔是頁(yè)面的要點(diǎn)，所以這種深色的設(shè)計(jì)顯然不是明智的選擇，要盡可能的避免。

　　三、深色背景在網(wǎng)頁(yè)設(shè)計(jì)中的應(yīng)用技巧

　　與淺色背景的網(wǎng)站相比，深色背景的網(wǎng)站更具吸引力，因此也擁有著相當(dāng)一部分的擁護(hù)者，他們喜歡深底色網(wǎng)站帶來(lái)的時(shí)尚感。對(duì)設(shè)計(jì)工作者而言，這意味著在設(shè)計(jì)過(guò)程中，有更多的色彩可供選擇，但同時(shí)，也要有能力解決使用這種深底色配色方法時(shí)所產(chǎn)生的問(wèn)題，要為客戶或用戶群創(chuàng)建出更有效的深底色設(shè)計(jì)，那么，在使用這種色彩搭配時(shí)，應(yīng)該注意哪些方面？

　　（一）注意文字的辨識(shí)度與可讀性

　　文字的辨識(shí)度是指文字在界面上出現(xiàn)時(shí)，用戶能否順利的進(jìn)行正常閱讀，在閱讀的過(guò)程中是否會(huì)感覺到吃力或者眼部不適。

　　在深底色設(shè)計(jì)中，容易造成眼睛疲勞，過(guò)高的對(duì)比度（如黑底白字）會(huì)刺激人的雙眼，長(zhǎng)時(shí)間閱讀會(huì)造成用戶眼睛不適，從而影響閱讀。過(guò)低的對(duì)比度（如深灰色底與中灰色文字）由于背景與文本的對(duì)比不夠強(qiáng)，會(huì)導(dǎo)致文字不夠清晰，讓人無(wú)法正常順暢的瀏覽信息。所以，在使用深底色設(shè)計(jì)時(shí)，文字與底色的對(duì)比度成了重中之重，尋找到背景暗度與文字亮度的平衡點(diǎn)，是解決文字辨識(shí)度問(wèn)題的關(guān)鍵所在。

　　在通常情況下，為了提高文字的辨識(shí)度和可讀性，設(shè)計(jì)師會(huì)盡量避免使用過(guò)高或過(guò)低的對(duì)比度，往往會(huì)用深灰色代替黑色，用淺灰色代替白色等方法來(lái)找到底色與文本之間的一個(gè)平衡點(diǎn)。

　　（二）合理使用留白

　　國(guó)畫中的“計(jì)白當(dāng)黑”的方法在設(shè)計(jì)領(lǐng)域中也得到了廣泛的認(rèn)可和應(yīng)用，此處的“白”并不是指白色，而是指“留白”或“空白”，有效的利用留白，在任何的藝術(shù)創(chuàng)作中都是重要的，尤其在深色背景的設(shè)計(jì)中，顯得更為重要。

　　深色背景給人神秘感的同時(shí)，也會(huì)讓人感覺壓抑、沉悶，在這種情況下，除了利用輔助色打破頁(yè)面的沉悶感之外，留白的使用會(huì)更有效的解決這個(gè)問(wèn)題。

　　（三）選擇合適的輔助色

　　由于深底色具有強(qiáng)烈的視覺沖擊力，所以在為它選擇輔助色的時(shí)候就要盡量使用簡(jiǎn)潔的色彩組合，使用一種或兩種輔助色即可。如果為了產(chǎn)生更豐富的效果，可以選擇同色系的顏色，這樣的搭配方法，無(wú)論輔助色使用多少種不同明度或純度的顏色，由于他們處在一個(gè)色調(diào)之中，所以也不會(huì)產(chǎn)生混亂之感。

　　用過(guò)多的不同色相的色彩來(lái)做深底色的輔助色并不合適，過(guò)多的顏色會(huì)讓頁(yè)面顯得花哨，雜亂無(wú)章，同時(shí)也不夠沉穩(wěn)大氣。如果一定要使用多種色彩作為輔助色，那么務(wù)必要減少其在頁(yè)面中的使用面積，以達(dá)到平衡畫面的效果。

　　（四）適當(dāng)?shù)氖褂霉庥靶Ч?/strong>

　　在一些較為時(shí)尚或現(xiàn)代的頁(yè)面中，常會(huì)使用深底色的設(shè)計(jì)，與之同時(shí)出現(xiàn)的除了一些合理的輔助色之外，也經(jīng)常會(huì)看到光影效果的使用，比如奢侈品牌Louis Vuitton的網(wǎng)站，背景色選用了高貴沉穩(wěn)的深褐色，在頁(yè)面的左下角使用了一點(diǎn)高光效果，這種設(shè)計(jì)方法使深底色頁(yè)面產(chǎn)生了通透感。

　　當(dāng)然，光影的使用不僅僅局限于此，它可以是導(dǎo)航上的一個(gè)泛光，也可以是背景中某個(gè)局部的光暈，或者是一束淡淡的光線。它可以有無(wú)限多的表現(xiàn)形式，但目的只有一個(gè)，就是服務(wù)于頁(yè)面。這種看似無(wú)關(guān)緊要的一個(gè)效果的使用，對(duì)整個(gè)頁(yè)面視覺美感的提升卻有著不可小覷的作用，在打破頁(yè)面沉悶感的同時(shí)，也提高了網(wǎng)站的質(zhì)感。

　　由此可見，網(wǎng)頁(yè)的設(shè)計(jì)離不開色彩，當(dāng)用戶第一次瀏覽網(wǎng)站的時(shí)候，給人們留下第一印象的不是網(wǎng)站的內(nèi)容和布局，而是網(wǎng)站的色彩。色彩會(huì)影響到用戶對(duì)內(nèi)容的判斷，可以說(shuō)，一個(gè)網(wǎng)站設(shè)計(jì)的成功與否，很大程度上取決于設(shè)計(jì)者對(duì)色彩的搭配和使用。

　　深底色背景的設(shè)計(jì)又是網(wǎng)頁(yè)色彩搭配技巧中較為特殊的方式，它既可以讓你的頁(yè)面呈現(xiàn)出美妙的視覺效果，又會(huì)產(chǎn)生一些新的問(wèn)題需要思考和解決，所以，這是一門學(xué)不完的課程。在使用深色背景設(shè)計(jì)時(shí)可以遵循一定的規(guī)律，運(yùn)用色彩知識(shí)科學(xué)合理的設(shè)計(jì)網(wǎng)頁(yè)的色彩。但同時(shí)，也要不拘一格，大膽創(chuàng)新，這樣才能夠使作品具有獨(dú)特的藝術(shù)風(fēng)格和良好的視覺效果。