海淘科技最近整理了紅色、藍色的網(wǎng)頁設(shè)計配色。網(wǎng)頁設(shè)計配色系列之『紅色 藍色』篇,增加了更多案例,而且案例的配色也越來越豐富,特別全面的系列教程,建議收藏。
色彩是光的魔術(shù)。而對于人類來說,其實光也是人腦的一個魔術(shù)。既然有魔術(shù)這樣的詞出現(xiàn),我們就必須放棄對于色彩的固化的思考。比如,對于色彩的命名帶來的限制。
紅色是一種熱烈的色彩,它是所有色彩中最為奪人眼目的一種。紅色所擁有的熱情也是其他色彩所無法比擬的,當你想要表現(xiàn)出熱情活力的一面時,紅色當即是首選。然而,就像我們之前談到的,既有熱情洋溢的正紅,也有輕柔粉嫩的嬰兒粉紅,這就是基于“紅”這個意向上的色調(diào)變化所拓寬的情感空間。因此,在選用“紅”作為主題色時,必須要認真的了解設(shè)計背后的傳達目的,根據(jù)目的最終來瞄準精確的紅色調(diào)。
深紅色往往象征著一種成熟的奢華,而用得不恰當也會顯露出某種邪惡,或讓人聯(lián)想到傷口血液這樣的意向。因此在網(wǎng)頁設(shè)計中并不多見。而高明度的紅則帶來某種熱情的同時又不至于暗沉,使用較多的也是這個區(qū)域的色彩。
紅色的鄰近色系是橙色和紫色,因此,紅色中也有橙紅和紫紅的參與,它們自然也夾雜了橙色和紫色的特點。
下面這個網(wǎng)頁中采用了紅色的明度漸變作為背景展示內(nèi)容,紅色本身的感染力一覽無余。紅色作為背景是非常大膽的想法,因此運用漸變會讓背景不會搶奪走主角的風頭,這也是在運用背景紅色的一個解決方案。
將正紅作為背景是十分冒險的行為,如果你將這樣做,那么就要確保你的網(wǎng)站內(nèi)容并不需要太多,也就是網(wǎng)站自身能發(fā)揮“奪眼球”的功能,而相對“實用”性將下降,毋庸置疑,一個全紅的網(wǎng)站看久了會讓人產(chǎn)生視疲勞。
而絕大多數(shù)情況下,紅色作為主色使用更為適宜,無論你采用什么顏色作為背景,將紅色用在主要的組件上,例如按鈕、導(dǎo)航等,都能從背景凸顯出來,而不同擔心主要元素用戶很難留意。
將縮略圖設(shè)計為紅色,在白色背景上方十分惹人注目,增加了點擊的欲望。
我們知道,紅色在色輪上屬于暖色系,暖色系的色彩都有一種往前擴大的感覺。有時候為了削減紅色的這種激進,可以選用偏紫的紅色。華美的紫紅色降低了飽和度以后,變?yōu)榱说姆奂t,讓人感受親切柔和,而作為背景色的存在則顯得非常舒適。
網(wǎng)頁設(shè)計這兩年開始越多使用淺粉色作為大面積使用,更多時候為了營造一種懷舊感,而同時又表達出時尚。粉色的背景往往可以使用高純度高明度的紅色作為主色。
相對而言,橙紅色則沒有紅色如此搶眼,而又沒有失掉紅色的活潑,更帶著橙色獨有的親和力。這樣的顏色在與飲食相關(guān)的設(shè)計中最為常見,可見它是一種開胃色。非餐飲類的網(wǎng)頁設(shè)計中用到了橙紅色,也能讓畫面變得更加親切活潑。
食品類的網(wǎng)頁設(shè)計中常見用到橙紅色,這種顏色能刺激人的食欲,讓食物看起來更好吃。
淺色粉作為背景,將橙紅色作為強調(diào)色,這一組搭配顯得時尚優(yōu)雅又新鮮活潑。
紅色作為強調(diào)色而存在,似乎顯得理所應(yīng)當。顯然,我們對紅色的開發(fā)還不盡全然,有些時候我們避免使用這種過于醒目的顏色是為了讓使用變得更流暢,所以,降低紅色的飽和度使其不過與搶眼,提高紅色的明度讓頁面變得“清爽”都是在輕設(shè)計中極為重要的原則。如果真的需要用到厚重的深紅色,也要試著降低其使用的比例,使其發(fā)揮精準的聚焦作用。
藍色作為天空和海洋的顏色,我把它稱之為“宇宙色”,因此它自帶浩瀚和廣大是其他顏色所無法比擬的。然而又因為它是絕對的冷色調(diào),因此在表達邏輯、理性、男性、專業(yè)、科技等主題上得以大量運用。藍色的色調(diào)也是相當豐富的,從深邃憂郁的深藍,到柔和清爽的粉藍……并不是每一種藍色都是冷感的,與它臨近的紫色和綠色都對藍色色調(diào)有一定范圍的影響。
藍色象征著科技,這一點已為大眾所接納,因此,各種以藍色作為背景的,對藍色的大面積運用,在這一主題下尤為常見。以高明度的高飽和度的藍色作為主色,拋棄了藍色的憂郁,非常富有活力。由于藍色容易聯(lián)系到水、天空、海洋等,因此它能最大程度的發(fā)揮這類自然元素的視覺特性.
最易于和大面積的藍色搭配的還是黑白灰,這樣的搭配來得非常安全,但也會有點呆板,畫面略平淡。為了打破這種單一色彩的平淡,可將背景增加一些富有動態(tài)的紋理圖案,頓時讓畫面變得非常具有科技感。
當然,在大面積使用藍色的時候,當你想要突出某一焦點,最好的方式就是采用它的互補色,形成視覺的沖擊。如下頁面中,頁頭部分出現(xiàn)的橙色救生圈即是藍色的互補色,這一焦點讓人過目難忘。
藍色是冷色系,因此,為了讓畫面不至于太冷,增加暖色系是最好解決視覺平衡的做法。紅、橙、黃都是不錯的選擇。由于藍色一方面和這些暖色有強烈的對比,一方面又能使畫面回暖,因此在藍色為主色的頁面中增加暖色,可以說是常見的配色手法。
選用怎樣的暖色,其實完全取決于你所使用的藍色是怎樣的色調(diào)。并不一定是高明度高純度的藍色才是最優(yōu)的選擇,盡管目前這一色彩受到科技界的高度青睞。如下這一網(wǎng)頁中選用了比較黯淡的藍色最為主色,明度相對較低,藍色有著淡淡的懷舊感,與此同時,橙紅色也作為強調(diào)色,讓畫面顯出活力。
藍色在自然界中四處可見,大海、天空……每張風景照多少都會包含著藍色這種色彩,因此在運用照片時,選用比較純粹的藍色系大海、山川或天空已經(jīng)是一個不二之選。風景照片能表達的主題也非常廣泛:廣大、遼闊……這些都給足了設(shè)計師非常優(yōu)質(zhì)的素材,而將風景照作為大圖背景,也是近幾年流行的界面樣式。所不同的是,這些風景照片中的藍色色調(diào)的不同帶來不同的視覺感受,與此相匹配的色彩也有所不同。
就是由于藍色的“宇宙”屬性,讓它絲毫不會困在“憂郁”這個詞匯里,而增加了綠色的藍色,顯得更加有親和力。偏向紫色的高飽和度低明度的藍色,有一種奢華優(yōu)雅的魅力,任何色彩在降低其明度后自有一種沉穩(wěn)的感覺。
當深藍作為主色時,明亮的綠色作為搭配,相互之間是鄰近色,而又因為其明度的對比,相互輝映出藍天綠水之美。
當藍色沉寂下來,我們并不會因此而覺得壓抑,只要增加其飽和度,這種藍色就會顯得非常有質(zhì)感,體現(xiàn)出某種專業(yè)的感覺。在公司的網(wǎng)站中,這種體現(xiàn)專業(yè)感的藍色顯得中性毫不浮夸,提升了視覺的信賴感。
盡管藍色并不一定屬于男性,但是深藍色的確比其他顏色來得更為理性和克制。但根據(jù)配色的不同,賦予畫面的色彩比例的差異,所演繹的色彩感覺也會不同。藍色幾乎是一種萬能色,它的冷并不是絕對的,就像在深海里,當你把頭望向太陽的時候,藍色又有著一種溫暖的錯覺。也許這就是一種顏色說不盡的秘密。
文章下載,點擊:網(wǎng)頁設(shè)計配色系列之『紅色 藍色』篇。海淘科技網(wǎng)站不僅提供,網(wǎng)頁設(shè)計配色,而且提供了一個新的設(shè)計趨勢:MBE風格設(shè)計。