網頁設計中的顏色

2021-04-02 14:47:41 字數 3132 閱讀 5019

摘要

從心理學角度來講,不同的顏色代表不同的意思。從這個觀點出發,本文討論網頁介面中背景顏色和內容顏色的關係。了解這個關係,有利於:a) 為網頁中不同的內容選擇適合的顏色;b) 瀏覽網頁時,可以方便的找到需要的內容。

關鍵字:color, inte***ce, web design

1.1 研究**

1.2 研究目標

現在我們的生活離不開網路。隨著國際網際網路和內部網的發展,在網頁介面上我們經常看到越來越多豐富多彩的內容。比 如, sun公司的外部**大概有2萬個網頁,內部網上則有2百萬個網頁。大量的資訊的確給使用者提供了很多資料。然而,也帶來了查詢所需內容的麻煩,若遇到結構 混亂的網頁介面,使用者則更是一籌莫展。因此,除了設計好合理的資訊分類和**結構外,最好還能利用不同的背景顏色來區分不同的內容。

此研究目的是要找出網頁設計中最適當的背景色與內容的匹配關係,為網頁設計提供準則。

我們的研究手段是試驗。研究物件是20歲到35歲之間的男性16名,女性17名。其中一些人是來自不同學校的不同年級的學生,還有些人則是上班族。我們認為這個年齡段的人是最主要的上網人群。

然後,我們請參與試驗者來為上述分類配上不同的顏色。他們使用微軟word軟體中的繪畫功能來填充他們認為最好的顏色。之後,我們收集結果進行分析。

色彩學裡有三原色:紅、綠、藍。兩兩混合後產生出另外三種顏色:黃、藍綠、紫。在色譜中是:紅、黃、綠、藍綠、藍、 紫。黑是紅、綠、藍的組合。根據 冷暖色劃分,則可以分成八色:橙是最暖色,紅和黃是暖色,紅紫和黃綠是略暖色,藍綠和綠紫是略冷色,藍色是最冷色。白色反光最強,感覺較冷;黑色吸光最 強,感覺較暖(munseu, 1915)。

在試驗中我們讓試驗者根據下面的表一來選擇背景顏色:

表一:表中的數字是選擇表頂部顏色的人數,這些顏色是網頁左手邊的內容。

下面我們來分析一下。

3.1 主頁

圖一,顏色和主頁

如圖所示,多數參與試驗的人傾向藍色作為公司**的主頁的背景顏色。本次試驗中佔50%。在試驗者眼中,藍色代表了純潔和高尚。網頁背景使用藍色可令訪問者感覺舒適並且較為容易相信網頁所屬公司。藍色的引入是乙個好的開端。

背景使用藍色則白色的文字比較容易辨識,黃色次之。

從上圖中可以看出來,對於公司的介紹性內容,半數人選擇紅色、橙色和紫色。還有25%的人選擇綠色。

紅色、橙色和紫色同屬於乙個色彩序列,都是暖色。紅色和橙色又表示熱情。使用這類的顏色來作介紹公司的網頁的背景,可以使該公司顯得精力充沛、動感十足。白色字型放在紅或橙色背景上最明顯,黃色次之。

多數人選擇紫色的人認為,紫色代表尊嚴和高貴,可令訪問者對該公司產生尊敬感。

綠色代表生命和希望,同時也和年輕和成長相關。和選擇紅色或橙色的人一樣,選擇綠色的人認為綠色可是該公司顯得很有生命力。白色或黃色的文字,放在綠色背景上非常突出,很合適。

3.3 公司新聞

公司新聞這個欄目也提供了關於公司的有關資訊,我們的研究中發現一般的人喜歡藍色。為什麼呢?因為藍色給人寧靜、健康的感覺。這樣網頁的訪問者會通過藍色感覺公司的資訊更可信。

圖三:顏色和公司新聞

3.4 產品

下圖中,我們可以看出來有超過一半的人—66%的人選擇藍色或近似的顏色的冷色。這些人認為這類顏色給人以安全和莊重的感覺,從而對該公司產品有信心。

圖四:顏色與產品

3.5 服務/技術支援

在服務和技術支援類中,我們的試驗結果和上述產品類基本一致。藍色或近似的冷色選擇的比較多。原因也類似,服務和產品一樣重要,公司也需要其顧客對其服務有信心。不管怎麼樣,公司在推銷自己的時候,服務越來越重要了。

圖五:顏色與服務/技術支援

3.6 財務

這一類和公司的財務有關,比如採購、投資、通過網際網路的購買等。對於這類網頁的背景顏色,我們的試驗者傾向於暖色: 紅色或黃色。傳統上,紅色代表吉 利;黃色代表財運。而今在**,紅色卻常用來警告投資者。所以這裡使用紅色很容易吸引投資者目光。此外,33%的人選擇了藍色,他們認為這類內容必須讓人 感覺非常可靠,使用藍色就比較必要了。最後,我們不能忽略14%的人選擇黑色,代表了穩定和堅實。

此類資訊有兩類顏色的喜好:暖色來吸引目光;冷色代表抽象的含義。

圖六:顏色與財務

3.7 人力資源

人力資源/人事/培訓的類別中,各種顏色的使用幾乎都有。紅色、綠色、黃色、灰色均有選擇。各種顏色的喜好都有各自的理由。

藍色:茁壯發展(海洋和藍天);

綠色:活潑、動感;

黃色:充滿希望,孕育美好的未來。

上述顏色均昭示著希望,而不讓人感覺沒有熱情。

若我們使用黃色為背景,則最好使用黑色或紅色的文字。

圖七:顏色與人力資源

3.8 網路社群

網路社群或會員欄目是公司與客戶交流的地方。在此,客戶可以給公司以建議或意見,也可以得到公司活動的資訊,或加入 公司組織的俱樂部等。我們發現 19%的試驗者選擇了紅色,29%選擇了藍色,33%的綠色,19%的藍色。綠色相對較多,綠色在色譜中處在中間位置,比較柔和,對護目較好,這樣客戶可 以感覺到溫暖舒適,並樂於加入社群。

圖八:顏色與網路社群

當具體訪問某個類別內容的時候,人們也較喜歡一些特定的顏色。所以,我們認為網頁內容的類別和其使用的顏色具有一定的關係。通過試驗,我們發現如下規律:

紅色, 橙色,綠色

公司新聞:藍色

產品介紹:藍色, 綠色

服務/技術支援:藍色, 綠色

財務(**、財務、購買或通過網際網路購買):紅色,藍色

人力資源(招聘或培訓):藍色, 綠色, 黃色,灰白

主頁:藍色

網路社群(合作夥伴、會員中心、或企業文化):綠色,藍色

通過研究,我們發現為特定內容的網頁選用適當的顏色很重要,這不僅可以告訴瀏覽著他們目前在瀏覽哪類資訊,還可以讓瀏覽者在瀏覽時感覺舒適。令人舒適的網頁設計可以進一步讓使用者對該公司產生好感,這是很重要的。

網頁設計的12種顏色

前不久,colourlovers.com公布了一項調查結果。他們發現,美國前100大 的logo,主要使用12種顏色。其中,採用藍色的 最多,紅色排在第二種,黃色排在第三種。我把這12種顏色的rgb 列出來,供將來自己做網頁時參考。1.淺綠 8cc540 2.深綠 009f5d 3.暗藍 019fa...

網頁設計中的標準

網頁設計標準尺寸 1 800 600下,網頁寬度保持在778以內,就不會出現水平滾動條,高度則視版面和內容決定。2 1024 768下,網頁寬度保持在1002以內,如果滿框顯示的話,高度是612 615之間.就不會出現水平滾動條和垂直滾動條。3 在ps裡面做網頁可以在800 600狀態下顯示全屏,頁...

網頁顏色的基本認識

1.rgb 顏色網頁顏色主要由 3種基本顏色和組成,它們是紅 red 綠 green 藍 blue 2.色環3.顏色的三要素 色相 純度 明度。4.不同顏色代表的含義 紅色紅色是一種對視覺器官產生強烈刺激的顏色,在視覺上容易引起注意,在心理上容易引起情緒高昂。紅的的具體表現是 火 血 心 蘋果 夕陽...