網頁設計配色

網頁設計配色

顏色的使用在網頁製作中起著非常關鍵的作用,有很多網站以其成功的色彩搭配令人過目不忘。

但是對於剛開始學習製作網頁的人來說,往往不容易駕馭好網頁的顏色搭配。除了學習各種色彩理論和方法之外,多學習一些著名網站的用色方法,對於我們製作美麗的網頁可以起到事半功倍的作用。總結了一些著名網站的顏色搭配方法,這些方法可以讓我們的學習少走彎路,快速提高我們的網頁製作水平。

基本介紹

  • 中文名:網頁設計配色
  • 外文名:Webpage design color
  • 作用:增強網頁效果
  • 使用:網頁製作
象徵意義,使用風格,用色十例,

象徵意義

我們所有網頁上顏色,在HTML下看到的是以顏色英文單詞或者十六進制的表示方法(如#000000表示為黑色)。不同的顏色有著不同的含義,給人各種豐富的感覺和聯想。
紅色:熱情、奔放、喜悅、莊嚴
黃色:高貴、富有、燦爛、活潑
黑色:嚴肅、夜晚、沉著
白色:純潔、簡單、潔淨
藍色:天空、清爽、科技
綠色:植物、生命、生機
灰色:莊重、沉穩
紫色:浪漫、富貴
棕色:大地、厚朴

使用風格

不同的網站有著自己不同的風格,也有著自己不同的顏色。網站使用顏色大概分為幾種類型:
1、 公司色
在現代企業中,公司的CI形象顯得尤其重要,每一個公司的CI設計必然要有標準的顏色。比如新浪網的主色調是一種介於淺黃和深黃之間的顏色,同時形象宣傳、海報、廣告使用的顏色都和網站的顏色一致。
2、 風格色
許多網站使用顏色秉承的是公司的風格。比如海爾使用的顏色是一種中性的綠色,即充滿朝氣有不失自己的創新精神。女性網站使用粉紅色的較多,大公司使用藍色的較多……這些都是在突出自己的風格。
3、 習慣色
這些網站的顏色使用很大一部分是憑自己的個人愛好,以個人網站較多使用,比如自己喜歡紅色、紫色、黑色等,在做網站的時候就傾向於這種顏色。每一個人都有自己喜歡的顏色,因此這種類型稱為習慣色。

用色十例

以下將分別介紹十個配色較好的網站,大家可以學習和借鑑一下,培養對色彩的敏感以及獨到的審美能力。
1)大型的NBA網站。通常我們經常看到的此類網站以白色為背景,但是這個網站卻用灰黑色RGB為(48,48,48/#333333)(以下顏色都用RGB表示),文章標題用色為RGB為(203,201,153/#CCCC99),選單使用的RGB為(112,119,112/#707770)。這樣的配色可以顯示獨特的個性,又不失大型網站的風采。
2)娛樂類的綜合性網站UGO,他的配色方案是背景色為黑色RGB為(0,0,0)中嵌套RGB(0,0,82),字型白色RGB(255,255,255),選單為RGB(77,114,159)。這樣的雖以黑藍為主色調,但是配以漂亮的圖片,給人的感覺是生機盎然,充滿了互動色彩和青春氣息。
3)微軟公司網站,微軟不僅軟體做的好,連網頁製作也是世界領先。他的每一個網頁都是製作的樣板。從網頁我們就可以看出微軟公司的風格、作風,以及實力。背景顏色使用藍色RGB為(0,151,254),選單為黑色RGB(0,0,11),選單為灰色RGB(200,200,200),字型為黑色RGB(0,0,0)。
4)相對簡單網站,但是她的用色也別具匠心,如今我們來看一看,整體上使用的是白色RGB(255,255,255),輔助色為RGB(79,88,95),選單色為RGB(48,64,64)和RGB(0,81,111)字型使用的是RGB(83,86,91)。雖然簡單,但顏色搭配非常的科學合理。
5)黃色調為主網站,很體現公司的個性,我們就來看一看她的顏色搭配。主色調為黃色RGB為(255,199,48/#FFC730),輔助色調為RGB(49,102,46)字型為棕色RGB(153,103,0),中間再配以抽象的圖片,顯得個性十足但又不單調。
6)橘紅色網頁。下面的這個網站就是一個非常著名的例子。他的主色調為RGB(255,151,0)輔助色調為RGB(255,103,4),選單RGB為(252,200,0)。字型使用黑色RGB為(0,0,0)。此種配色顯得主人較為前衛,色彩熱烈,給人的震懾力較強。
7)鮮紅色也是一種震撼感很強的顏色,如果搭配不當,也可能使網站沒有風格和特點。下面的這個網站就是使用紅色比較好的網站。我們來看看他的顏色搭配。他使用的主色調是RGB(200,9,0),配以抽象的圖形,文字使用的是RGB(213,229,167)顯得美觀而不失獨特,大氣而不逼人。
8)不經常用到的顏色色調,如果使用到你的網頁中,肯定會給人耳目一新的感覺。他的主色調為RGB(144,151,97)輔助色調為RGB(173,168,112)邊飾為黑色RGB(0,0,0)字型為黑色RGB(0,0,0)。這樣的搭配顯得風格獨特,顏色和諧而莊重。
9)設計更加的簡單化,但是顏色的使用使網頁並不呆板,反而讓人感覺到一股濃濃的生活和家庭氣氛,使人置身於美麗和愛中。他的主體是由兩種顏色構成,分別是RGB(239,200,161)和RGB(201,254,200)。如此簡單,但是卻栩栩如生,躍然網上。
10)下面舉出這個例子是想證明一個道理——只要你有足夠的想像力,你就能夠設計出漂亮的網頁。當今在網上非常流行一句話就是網頁的搭配不要超過四種主要顏色,否則就有雜亂之感。下面的這個網站遠遠的超過了三種顏色,但是她並不失美麗。因此重要的還是色彩的駕馭能力。下面這個例子的選單就使用了7種顏色,但是我們看到的網頁並不雜亂,相反感覺作者很有創意。
網頁設計的顏色搭配需要在實踐中不斷的摸索和不斷的創新,認真學習別人的先進方法和經驗,可以快速的提高我們的製作水平。
可以說。網頁顏色搭配得當,成功也就走了一半。

相關詞條

熱門詞條

聯絡我們