導航:首頁 > 萬維百科 > 藍色在網頁設計中得應用

藍色在網頁設計中得應用

發布時間:2020-11-08 18:57:48

1、色彩設計在web界面如何應用

一、 視覺引導功能

視覺引導功能遵循的是一條流暢的路徑,網頁色彩能順利地引導用戶在頁面上移動體驗。

在WEB界面設計中,色彩擔負起和線條、文字一樣的視覺引導和強調的作用。設計師可以充分利用色彩導向作用力量去美化頁面,對重要的信息進行色彩的整合和強化,引導瀏覽者的注意力,有利於推廣新產品。對需要強調的內容適當運用色彩加以突出,使瀏覽者加深記憶,提高網站的信息傳遞效率。在產品展示類型的網頁中,色彩的強調功能尤為明顯。我們在瀏覽一些頁面中不難發現世界頂級護膚品牌HR赫蓮娜的展示頁面,它成功地利用色彩將瀏覽者的注意力引導到產品之上,給人留下深刻的印象。又如在某些商品展示類的網站,色彩的導向傳遞功能運用尤為明顯:亮色系比如以黃色為背景一般所代表的意思是促銷產品熱賣產品,而藍色、褐色或深綠色等冷色調的搭配則多用來表現商品的價值。

二、企業形象識別功能

企業標准色是企業形象識別要素之一,網站設計者將企業網路界面色彩與企業標准色相呼應起到了加深企業形象的作用。格羅佩斯(Walter Gropius)在他的《藝術家與技術家在何處相會》一文中提到「如果物體的形象很適合於它的工作,它的本質就能被人看的清楚明確。」從這里可以很深刻的了解到企業形象在信息傳遞和接納過程當中所起到的非常重要的作用因素。色彩也是形成企業形象的關鍵要素,企業標准色是企業形象的色彩表示系統,人們一看到此色彩就會聯想到該企業。把CI設計這一理念應用到網站整體形象規劃與設計開發上來,以企業CI設計中的標准色作為WEB界面的主色調展開設計,使WEB界面成為企業形象的延伸和宣傳,無疑是把WEB界面設計推向正規化、品牌化發展的道路。它可以使網站與企業具有共通的視覺特徵,便於宣傳和識別,通常達到事半功倍、相得益彰的效果。

百事可樂在全世界擁有較高的知名度,使人過目不忘的藍色和標准字體已成為它的標志。我們可以瀏覽一下百事可樂系列站點,每個網站的主體風格不盡相同,美國總站穩重些,英國站比較活潑,即使站點風格有些差異但都保持了一致的文化特點,都採用了大快藍色的底色,給人以熱情、活力、喜悅的感覺,應用在網路界面設計中,讓受眾群聯想到飲用百事可樂所帶來的快樂心情,無形中就加深了百事可樂品牌在消費者的心目中的形象。

三、 視覺區域劃分功能

WEB界面的首要功能是信息傳遞,色彩正是創造有序的視覺信息流程的重要因素。利用不同色彩設計進行視覺區域劃分是網路界面設計中的常用手法,也是色彩在WEB界面設計中的重要功能。網路界面中的信息不僅數量多,而且種類繁雜,往往在一個頁面中可以看到各種各樣的信息問題,利用色彩分布,可以將不同類型的信息分類排列,並配合相應內容,有針對性地設計色彩;利用各種色綵帶給人的不同心理效果,很好的區分出主次順序,從而形成有序的視覺流程。

色彩的視覺區域劃分功能實用性強,變化性強,靈活易用,適用面廣泛,在信息繁雜豐富的門戶類網站中應用較多,而且效果較為明顯。利用色彩和輔助線把網路界面分成幾個區域,這些區域可以是規則也可以是不規則的,以適應多種信息內容編排的需要。「FDI世界園」是一家招商投資網站,它的網路界面設計十分簡潔,多趣味性。由多種色塊矩形區域拼合成了網路界面的整體框架,用按鈕形式來顯示導航功能選擇,很清晰地把網站的內容分類展示給瀏覽者,配合上網站通用的icon,整個網站十分舒暢,同時減輕的用戶的視覺負擔。

四、審美功能

WEB界面不僅具有實用的物質功能,而且具有審美的精神功能,發揮審美功能的界面形象與發揮實用功能的界面實體是同一的,它們具有同質同構的聯系,網路界面是以一定的使用目的或物質功能為存在前提的,其審美功能必須以其使用目的為導向,即審美功能不能背離其使用目的。由於人的視覺對於色彩有著特殊的敏感性,因此色彩所產生的美感魅力往往更為直接。

色彩既是視覺信息傳達的方式(實用功能),又是藝術設計的語言(審美功能),當網路界面的色彩所反映的情趣與人們的審美情緒發生共鳴時,也就是說色彩配合的形式結構與人們審美心理的形式結構相對應時,人們就會感覺到色彩和諧的愉悅。色彩設計對WEB界面設計作品的藝術品位起著舉足輕重的作用,不僅在視覺上,而且在心理作用和象徵作用中都可以得到充分的體現。因此,網路界面設計要以色彩的科學知識為基礎,進而從美學的角度去探討色彩設計的表現形式,增強WEB界面設計作品的藝術性,以創造出更富審美情趣的作品。在國內68design網頁設計的站點,其中國內優秀設計作品中一家叫冰藝工作室的網站還是比較吸引人的眼球,讓人不由自覺的想去點擊它。它每個網路界面所選擇的色彩和圖形都能使瀏覽者自然地將其與產品風格聯系在一起,界面中間色彩和四周部分黑、白、灰無彩色的色調搭配形成了動靜相宜、多樣統一的韻律美,給網路界面注入了活潑而新鮮的活力,從而達成令人賞心悅目的界面形式,和諧中富於變化,具有獨特的創造性和審美價值。

五、品牌語言傳遞功能

品牌宣傳效果不僅應該在視覺上,而且應該在心理上和象徵上得到體會和理解。不同色相具有不同的語意特徵。人們經過長期的社會生產實踐和生活體驗,對色彩形成了不同的情感和心理感受,人們將這種長期積累的色彩印象賦予各種語意特點並將其應用到生產、生活中。

在眾多的網站類型中,不同的網站類型都有自身的色彩語意相關性。如兒童用品的網站設計多使用色彩亮麗、醒目的純色;藍色常用在表現同科技產業等相關新興產業的WEB界面設計上。因此,設計者在界面色彩語言表達中應充分考慮不同色彩的語意特點,並將其和WEB界面主題內容結合起來。

六、主題鮮明功能

網路是信息的海洋,瀏覽者在網路中漫遊無疑是尋找他們所需要的信息資源,網路界面傳遞的信息內容與傳遞方式應該是相互統一的,這是設計作品成功的必要條件之一。網路界面如何使瀏覽者迅速、快捷、准確的掌握主題,整合信息資源,這就需要設計師利用色彩的對比調和手段,產生視覺落差,來表現信息的重點,從而提高瀏覽者獲取信息的效率。設計師可利用不同色彩自身的表現力、情感效應以及審美心理感覺等,使網路界面的內容與形式有機地結合起來,以色彩的內在力量來美化頁面,或含蓄優雅,或動感強烈,或時尚新穎,或單純醒目,烘托主題、突出主題。在網路界面設計的許多成功作品中我們都可以看出這一點。三星galaxys3公司的商業網站,進入該網站的第一需要就是找到所需的產品,WEB界面設計者就利用了產品圖片顯示顏色和灰色塊強烈對比所產生的視覺落差,突出了右上角黑色文字主題內容和產品薄輕便的優勢,以色彩的內在力量引起瀏覽者的重點關注,引導瀏覽者以最便捷的方式使用該網路界面,同時,灰色色塊背景好似深沉的藍色里的交音階,高貴、氣質不凡,鋪色用心,恰到好處,使網站風格突出,大大增強了網站的藝術性和吸引力,從而提高了網站的知名度。

2、如何將藍色運用到建築行業的網站設計中

這是因為過去工程用圖紙的復印方式所決定的,當大量復印時好象是用什麼氨水薰的,這樣印價便宜.
先把圖紙描在透明紙上,在把這個透明的底圖紙放在曬圖機上,用光線照,機子裡面放氨水,然後產生什麼化學反應,紙上就有了圖形.
所以說,以後人們又把正式的工程圖紙稱為藍圖,呵呵,不會是因為它就是藍色的吧.

3、藍色在美工設計中有什麼作用?

藍色給人一種清新、舒暢的感覺,是一種最具理智、沉穩的顏色。在大自然中,比如冬天天空的顏色為藍色,會使人感到寒冷;在裝潢設計中,比如淺藍色背景牆添了幾分清爽,避免了空間過於單調。藍色是冷色調當中最為典型的代表色,也是網店美工設計中最常用的色彩,它往往可以襯托出其他具有擴張力的色彩,讓整個網頁看起來更加豐富,如圖所示。整個網頁以藍色為主色調,讓人聯想到大海、藍天,突出了產品的特性。不同的藍色調使得整個網頁更具有層次性,不再呆板單調。

薩奇旗艦店首頁

4、如何在網頁設計中使用正確的色彩以表達情感

笑天涯說:為什麼Facebook的主題色是藍色的?為什麼淘寶的主題色是橙色的?如何在網頁設計時,正確地使用色彩?欲知個中緣由和方法,且看本文分解! 作者是位顧問,曾幫多家做出適當轉型,讓其營利上升,來看看他有些什麼秘訣。 色彩影響人類心情與思考這件事情是真的,當眼睛看到某種顏色時,會將此訊息傳回大腦的下視丘,經由一系列的神經傳達,甲狀腺分泌賀爾蒙,進而造成情緒、情感或是實際反應。 經由線上 uickSprout 的研究顯示,顏色可以影響 90% 的產品評價;數位行銷專家 Neil Patel 指出,85% 購產品的原因是出自於顏色,而色彩對於網路上各式各樣的設計當然也具有一定影響。 跟相親一樣,第一印象很重要;只要抓住色彩使用的箇中奧妙,就等於抓住讀者的心。 什麼是色彩心理學? 在我們開始談色彩攻略之前,先來談談色彩心理學,字面上來講就是研究色彩如何影響心理的學問,有些人因為還沒有大量文獻研究背書,而對色彩心理學抱持懷疑立場,而我接下來要探討色彩對於人的觀感影響也不是每一項都經由科學證實,但是色彩對於認知行為的影響實在非常巨大,因此仍有探討的必要性存在。 在一篇文獻探討中,Satyendra Singh 認為顧客在 90 秒內就會決定一項產品的觀感,其中色彩就占 62%-90% 的決定性因素,色彩心理學的重要性因此不證自明,產品要成功,選色很重要,領導者、經理人、建築師、主廚、設計師等等都應該正視顏色帶來的影響。 色彩用對地方才能穿透人心 跳到正題,既然顏色這么重要,那要用在哪裡才能真正發揮功效?本文將討論各種網頁上的顏色設計運用,最主要將著重在的主色調上,包含網頁主圖、標題、隔線、背景色、連結紐以及彈出視窗都在討論范圍內。 例如下圖,NinjaJump 在 logo、碼、分類連結、副標題連結、側邊連結都使用綠、黃、紅三色,我們要討論的重點也可以運用到選項欄位、側邊欄位與色彩策略等等。 色彩學真的非常精妙,不僅要用對地方,連天時地利人為因素都要加進去考量,才能展現威力。如果要在網頁上跳跳床,你絕對不會想到要用黑色,看看NinjaJump?。 身為一個跳跳床的,我們可以預期的是明亮有活力的配色,紅色、綠色、再加上一點亮澄澄的黃色對孩童與父母而言都是不錯的選擇。若今天的消費主要客是女性,可能這招就不管用,L&rsuo;Oreal 的就僅使用簡單的黑與白色,加上些許紫色增添層次感。 關於為何 L&rsuo;Oreal 使用黑白兩色是正確的,我留到稍後解釋,首先再一次提醒運用色彩要注意:用對地方、用對時間、針對客、針對目的,我們先來看看以下幾點。 女性不喜歡灰、橘與棕色;她們喜歡藍、紫與綠色。 Patel 利用性別來分類男女對於顏色有何不同的喜好,在一項顏色與性別的研究中,35% 的女性表示她們最喜歡藍色;再來是紫色占 23%、綠色占 14%。33% 的女性表示橘色是她們最不喜歡的顏色,再來是棕色 33% 與灰色 17%。 其他研究也顯示女性較不偏好大地色系,只要看看瞄準女性做為主要客的線上購物就可證實。 化妝品牌 Milani Cosmetics 專供女性場,其首頁上沒有任何一點橘、棕、灰色。 Won&rsuo;s Day 則是把所有女性最愛的顏色 (藍、紫、綠) 都放上網頁設計了。 還是有人以為女生最愛粉紅色,請容我在這先翻個白眼,事實上只有少數女性會將粉紅色選為最喜愛的顏色,雖然粉紅色與女性柔若有相關聯,但使用藍、紫、綠色,反而能夠有效增進女性購物者的造訪率。 男性不喜歡紫、橘、棕色;他們喜歡藍、綠與黑色 如果男性才是的主要針對客,最好別用紫、橘、棕色。藍、綠與黑色在傳統上較常與男性氣息連結在一起,棕色竟然不在此列倒是讓人有點訝異。 藍色可以增進使用者的信任 藍色事實上是最被普遍使用的顏色,而且很多人喜歡,所以藍色是最溫暖的顏色(喂!)。 只要看看有關藍色的文獻探討,就可以發現藍色被認為是信任、和平、秩序、忠誠的象徵;也會讓人有冷靜下來的作用;甚至還可以將藍色直接代表寧靜。 在顏色對於心理影響的調查中,藍色傳達信任感與寧靜的作用是被證實過的,所以看看 Facebook 就知道,將藍色運用在主頁面上用以傳達核心價值:透明與信任。 如果 Facebook 的例子還不夠明顯,我們再來看看 Paypal,作為一個線上支付平台,同樣也選擇藍色增進使用者的信任。如果他們用的是紅色或橘色,大概讓人以為是在跳樓大拍的機率還會高一點。

5、網頁設計中,淡藍色系網站如何配色?

首先說一下藍色系列網站既是最難搭配的也是最好搭配的,
之所以好搭配是因為藍色作為主色調的網站可以運用單色進行設計,配合黑色或者白色完全可以取得很好的效果。
之所以說難搭配是因為兩點
第一,藍色本身很難運用,很容易用「火」,顏色太純,過於刺眼。也很容易用「灰」,顏色太臟,過於灰暗。
第二,藍色的網站尋找合適的搭配顏色很難,並不是沒有。只要合理的選擇可以在互補色系中尋找比較好的顏色,切記一點就是「五色令人目盲」,顏色種類一定要控制在三種之內,要不就會顯得「亂」。

6、藍色為什麼會成為ui設計中最常用的色彩

1、絕大多的用戶喜歡這個顏色
有調研指出,絕大多數的人都喜歡藍色,藍色被認為是全球范圍內最安全的設計用色。

2、藍色與自然相關
清朗的天空和純凈的水,在多數時候都呈現出漂亮的藍色,它們代表著好天氣和健康的水源,這種對自然的親近深藏在人類的基因當中,外化表現為對藍色的喜好。

藍是海洋和天空的色彩,是自然的色彩。
3、藍色還是UI設計師的通用色彩
從UI設計師的角度上來看,這是一種泛用且實用的色彩。常見的色彩當中,紅色、橙色、綠色對於用戶都有這強烈的情感影響,其中黃色常用作警告,紅色能夠喚醒用戶的激情,也能夠昭示危險,而綠色常常關乎健康、安全,相比於它們,藍色的泛用性明顯更強。

4、藍色所傳遞的情感相對更加抽象
它還能傳遞出「創新」和「科技」的感覺。所以,當公司採用藍色LOGO的時候,常常會讓人想到技術和創新。
5、藍色會讓人有安全感
因此許多旅遊相關的APP和網站會樂於採用藍色的UI設計。它隱隱傳達出可靠、信任的感覺,對於旅行類的應用和網站,無疑是不錯的選擇。

6、藍色讓產品看起來更加值得信賴
更准確地說,它會讓用戶更傾向於覺得「這是我要的產品」,當這種感覺和品牌本身的運作和特質結合起來的時候,就能夠形成讓人信任的品牌性格了。

藍色令人沉靜,能讓人感覺平衡和智慧。許多金融類服務企業也因此選擇藍色作為品牌色。
7、藍色對於色盲也足夠友好
佔比最大的紅綠色盲群體都能夠清晰地分辨出藍色。

色盲用戶眼中的色彩效果

藍色是Facebook 的主要色調,因為扎克伯格就是色盲,正如他所說:「於我而言藍色是我最容易分辨的色彩,所有的藍色我都能掌控。」

7、網頁設計中的色彩有何應用原則

看看優秀的網站能夠給我們帶來很多啟示。下面我們就先看看這些主色調的象徵意義和這些色調中做的比較優秀的網站。

灰色:象徵冷靜、中立;(蘋果、維基百科、紐約時報……)

綠色:象徵健康、生命;(BP石油、食品超市whole foods、星巴克……)

藍色:象徵可靠、力量;(戴爾、大眾汽車、IBM……)

紫色:象徵智慧、想像;(雅虎、T-Mobile、科幻主題電視台Syfy……)

紅色:象徵血氣、年輕;(可口可樂、樂高、肯德基……)

橙色:象徵歡樂、信任;(芬達、亞馬遜、火狐……)

黃色:象徵溫暖、透明;(百思買、法拉利、麥當勞……)

網頁設計色彩搭配原則

網頁美工設計中,最常用的幾個顏色為藍色、綠色、橙色,以及暗紅色。

藍為主調。藍色多與白、橙搭配,。白底,藍標題欄,橙色按鈕或ICON做點綴;藍天白雲,沉靜整潔的感覺。

綠為主調。綠色多與白、蘭兩色搭配。白底,綠標題欄,蘭色或橙色按鈕或ICON做點綴,綠白相間,雅緻而有生氣。

橙為主調。橙色多與白、紅搭配。白底,橙標題欄,暗紅或桔紅色按鈕或ICON做點綴,橙色活潑熱情,標準的商業色調,因此多用於商業網站的網頁美工設計。

暗紅為主調。暗紅色顯得寧重、嚴肅、高貴,需要配黑和灰來壓制刺激的紅色。黑或灰底,暗紅標題欄,文字內容背景為淺灰色。

網頁設計師需要注意的幾點

盡管三原色的相互搭配創造出了無數顏色,可不是所有的顏色都適用於網頁設計,不同的顏色在搭配上也有著其中的學問,網頁設計就相當於平面設計,網頁設計師可以將平面設計中的審美觀點套用到這上面來,所以平面設計上的審美的觀點在網頁設計上非常實用。

在網頁設計師中對於色彩的使用特別忌諱臟、純、跳、花、粉這幾種情形。

忌臟是指背景與文字內容對比不強烈,灰暗的背景令人沮喪!

忌純是指艷麗的純色對人的刺激太強烈抗議,缺乏內涵。

忌跳是指再好看的顏色,也不能脫離整體。

忌花是指要有一種主色貫穿其中,主色並不是面積最大的顏色,而是最重要,最能揭示和反映主題的顏色,就象領導者一樣,雖然在人數上居少數,但起決定作用。

忌粉是指顏色淺固然顯的干凈,但如果對比過弱,顯得蒼白無力了,就象病夫一樣無可救葯。

另外,藍色忌純,綠色忌黃,紅色忌艷。

當然,作為網頁設計師,我們最需要時刻提醒自己的是不要為了設計而設計。

一切的設計都要以用戶的需求為導向。一個優秀的網站,會給用戶非常直觀簡介明了的體驗和簡明的導航。

與藍色在網頁設計中得應用相關的知識