網(wǎng)頁(yè)設(shè)計(jì)配色系列之『紅色藍(lán)色』篇

創(chuàng)新互聯(lián)最近整理了紅色、藍(lán)色的網(wǎng)頁(yè)設(shè)計(jì)配色。網(wǎng)頁(yè)設(shè)計(jì)配色系列之『紅色 藍(lán)色』篇，增加了更多案例，而且案例的配色也越來越豐富，特別全面的系列教程，建議收藏。

網(wǎng)頁(yè)設(shè)計(jì)配色系列之『紅色』篇

色彩是光的魔術(shù)。而對(duì)于人類來說，其實(shí)光也是人腦的一個(gè)魔術(shù)。既然有魔術(shù)這樣的詞出現(xiàn)，我們就必須放棄對(duì)于色彩的固化的思考。比如，對(duì)于色彩的命名帶來的限制。

紅色是一種熱烈的色彩，它是所有色彩中最為奪人眼目的一種。紅色所擁有的熱情也是其他色彩所無法比擬的，當(dāng)你想要表現(xiàn)出熱情活力的一面時(shí)，紅色當(dāng)即是選。然而，就像我們之前談到的，既有熱情洋溢的正紅，也有輕柔粉嫩的嬰兒粉紅，這就是基于“紅”這個(gè)意向上的色調(diào)變化所拓寬的情感空間。因此，在選用“紅”作為主題色時(shí)，必須要認(rèn)真的了解設(shè)計(jì)背后的傳達(dá)目的，根據(jù)目的最終來瞄準(zhǔn)精確的紅色調(diào)。

深紅色往往象征著一種成熟的奢華，而用得不恰當(dāng)也會(huì)顯露出某種邪惡，或讓人聯(lián)想到傷口血液這樣的意向。因此在網(wǎng)頁(yè)設(shè)計(jì)中并不多見。而高明度的紅則帶來某種熱情的同時(shí)又不至于暗沉，使用較多的也是這個(gè)區(qū)域的色彩。

紅色的鄰近色系是橙色和紫色，因此，紅色中也有橙紅和紫紅的參與，它們自然也夾雜了橙色和紫色的特點(diǎn)。

下面這個(gè)網(wǎng)頁(yè)中采用了紅色的明度漸變作為背景展示內(nèi)容，紅色本身的感染力一覽無余。紅色作為背景是非常大膽的想法，因此運(yùn)用漸變會(huì)讓背景不會(huì)搶奪走主角的風(fēng)頭，這也是在運(yùn)用背景紅色的一個(gè)解決方案。

將正紅作為背景是十分冒險(xiǎn)的行為，如果你將這樣做，那么就要確保你的網(wǎng)站內(nèi)容并不需要太多，也就是網(wǎng)站自身能發(fā)揮“奪眼球”的功能，而相對(duì)“實(shí)用”性將下降，毋庸置疑，一個(gè)全紅的網(wǎng)站看久了會(huì)讓人產(chǎn)生視疲勞。

而絕大多數(shù)情況下，紅色作為主色使用更為適宜，無論你采用什么顏色作為背景，將紅色用在主要的組件上，例如按鈕、導(dǎo)航等，都能從背景凸顯出來，而不同擔(dān)心主要元素用戶很難留意。

將縮略圖設(shè)計(jì)為紅色，在白色背景上方十分惹人注目，增加了點(diǎn)擊的欲望。

我們知道，紅色在色輪上屬于暖色系，暖色系的色彩都有一種往前擴(kuò)大的感覺。有時(shí)候?yàn)榱讼鳒p紅色的這種激進(jìn)，可以選用偏紫的紅色。華美的紫紅色降低了飽和度以后，變?yōu)榱说姆奂t，讓人感受親切柔和，而作為背景色的存在則顯得非常舒適。

網(wǎng)頁(yè)設(shè)計(jì)這兩年開始越多使用淺粉色作為大面積使用，更多時(shí)候?yàn)榱藸I(yíng)造一種懷舊感，而同時(shí)又表達(dá)出時(shí)尚。粉色的背景往往可以使用高純度高明度的紅色作為主色。

相對(duì)而言，橙紅色則沒有紅色如此搶眼，而又沒有失掉紅色的活潑，更帶著橙色獨(dú)有的親和力。這樣的顏色在與飲食相關(guān)的設(shè)計(jì)中最為常見，可見它是一種開胃色。非餐飲類的網(wǎng)頁(yè)設(shè)計(jì)中用到了橙紅色，也能讓畫面變得更加親切活潑。

食品類的網(wǎng)頁(yè)設(shè)計(jì)中常見用到橙紅色，這種顏色能刺激人的食欲，讓食物看起來更好吃。

淺色粉作為背景，將橙紅色作為強(qiáng)調(diào)色，這一組搭配顯得時(shí)尚優(yōu)雅又新鮮活潑。

后記

紅色作為強(qiáng)調(diào)色而存在，似乎顯得理所應(yīng)當(dāng)。顯然，我們對(duì)紅色的開發(fā)還不盡全然，有些時(shí)候我們避免使用這種過于醒目的顏色是為了讓使用變得更流暢，所以，降低紅色的飽和度使其不過與搶眼，提高紅色的明度讓頁(yè)面變得“清爽”都是在輕設(shè)計(jì)中極為重要的原則。如果真的需要用到厚重的深紅色，也要試著降低其使用的比例，使其發(fā)揮精準(zhǔn)的聚焦作用。

網(wǎng)頁(yè)設(shè)計(jì)配色系列之『藍(lán)色』篇

藍(lán)色作為天空和海洋的顏色，我把它稱之為“宇宙色”，因此它自帶浩瀚和廣大是其他顏色所無法比擬的。然而又因?yàn)樗墙^對(duì)的冷色調(diào)，因此在表達(dá)邏輯、理性、男性、專業(yè)、科技等主題上得以大量運(yùn)用。藍(lán)色的色調(diào)也是相當(dāng)豐富的，從深邃憂郁的深藍(lán)，到柔和清爽的粉藍(lán)……并不是每一種藍(lán)色都是冷感的，與它臨近的紫色和綠色都對(duì)藍(lán)色色調(diào)有一定范圍的影響。

藍(lán)色象征著科技，這一點(diǎn)已為大眾所接納，因此，各種以藍(lán)色作為背景的，對(duì)藍(lán)色的大面積運(yùn)用，在這一主題下尤為常見。以高明度的高飽和度的藍(lán)色作為主色，拋棄了藍(lán)色的憂郁，非常富有活力。由于藍(lán)色容易聯(lián)系到水、天空、海洋等，因此它能大程度的發(fā)揮這類自然元素的視覺特性.

最易于和大面積的藍(lán)色搭配的還是黑白灰，這樣的搭配來得非常安全，但也會(huì)有點(diǎn)呆板，畫面略平淡。為了打破這種單一色彩的平淡，可將背景增加一些富有動(dòng)態(tài)的紋理圖案，頓時(shí)讓畫面變得非常具有科技感。

當(dāng)然，在大面積使用藍(lán)色的時(shí)候，當(dāng)你想要突出某一焦點(diǎn)，最好的方式就是采用它的互補(bǔ)色，形成視覺的沖擊。如下頁(yè)面中，頁(yè)頭部分出現(xiàn)的橙色救生圈即是藍(lán)色的互補(bǔ)色，這一焦點(diǎn)讓人過目難忘。

藍(lán)色是冷色系，因此，為了讓畫面不至于太冷，增加暖色系是最好解決視覺平衡的做法。紅、橙、黃都是不錯(cuò)的選擇。由于藍(lán)色一方面和這些暖色有強(qiáng)烈的對(duì)比，一方面又能使畫面回暖，因此在藍(lán)色為主色的頁(yè)面中增加暖色，可以說是常見的配色手法。

選用怎樣的暖色，其實(shí)完全取決于你所使用的藍(lán)色是怎樣的色調(diào)。并不一定是高明度高純度的藍(lán)色才是最優(yōu)的選擇，盡管目前這一色彩受到科技界的高度青睞。如下這一網(wǎng)頁(yè)中選用了比較黯淡的藍(lán)色最為主色，明度相對(duì)較低，藍(lán)色有著淡淡的懷舊感，與此同時(shí)，橙紅色也作為強(qiáng)調(diào)色，讓畫面顯出活力。

藍(lán)色在自然界中四處可見，大海、天空……每張風(fēng)景照多少都會(huì)包含著藍(lán)色這種色彩，因此在運(yùn)用照片時(shí)，選用比較純粹的藍(lán)色系大海、山川或天空已經(jīng)是一個(gè)不二之選。風(fēng)景照片能表達(dá)的主題也非常廣泛：廣大、遼闊……這些都給足了設(shè)計(jì)師非常優(yōu)質(zhì)的素材，而將風(fēng)景照作為大圖背景，也是近幾年流行的界面樣式。所不同的是，這些風(fēng)景照片中的藍(lán)色色調(diào)的不同帶來不同的視覺感受，與此相匹配的色彩也有所不同。

就是由于藍(lán)色的“宇宙”屬性，讓它絲毫不會(huì)困在“憂郁”這個(gè)詞匯里，而增加了綠色的藍(lán)色，顯得更加有親和力。偏向紫色的高飽和度低明度的藍(lán)色，有一種奢華優(yōu)雅的魅力，任何色彩在降低其明度后自有一種沉穩(wěn)的感覺。

當(dāng)深藍(lán)作為主色時(shí)，明亮的綠色作為搭配，相互之間是鄰近色，而又因?yàn)槠涿鞫鹊膶?duì)比，相互輝映出藍(lán)天綠水之美。

當(dāng)藍(lán)色沉寂下來，我們并不會(huì)因此而覺得壓抑，只要增加其飽和度，這種藍(lán)色就會(huì)顯得非常有質(zhì)感，體現(xiàn)出某種專業(yè)的感覺。在公司的網(wǎng)站中，這種體現(xiàn)專業(yè)感的藍(lán)色顯得中性毫不浮夸，提升了視覺的信賴感。

后記

盡管藍(lán)色并不一定屬于男性，但是深藍(lán)色的確比其他顏色來得更為理性和克制。但根據(jù)配色的不同，賦予畫面的色彩比例的差異，所演繹的色彩感覺也會(huì)不同。藍(lán)色幾乎是一種萬能色，它的冷并不是絕對(duì)的，就像在深海里，當(dāng)你把頭望向太陽(yáng)的時(shí)候，藍(lán)色又有著一種溫暖的錯(cuò)覺。也許這就是一種顏色說不盡的秘密。

本文名稱：網(wǎng)頁(yè)設(shè)計(jì)配色系列之『紅色藍(lán)色』篇
分享網(wǎng)址：http://www.muchs.cn/news24/162674.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供動(dòng)態(tài)網(wǎng)站、全網(wǎng)營(yíng)銷推廣、網(wǎng)站改版、網(wǎng)站維護(hù)、面包屑導(dǎo)航、App開發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)