網頁美工設計中色彩搭配探析

張朦朦

摘要：色彩作為視覺藝術的重要運用，在網頁設計中能起到奪人眼球的目的，設計合理將會收到意想不到的效果。本文通過對色彩的特征和應用原理的敘述，探析色彩在網頁美工設計中的應用和具體途徑。

關鍵詞：網頁美工 設計 色彩搭配

中圖分類號：J0-05 文獻標識碼：A 文章編號：1008-3359（2017）13-0167-03

信息技術的迅速推廣和電子終端產品的普及，都為網絡信息的發展帶來了可能，從人們的日常起居和工作交友，網絡可以說是無孔不入，對人們的生活實現了全覆蓋，成了人們生活中必不可少的一部分。在這種大背景下，網站的魅力就變得不容忽視了，雖然網絡受眾較多，但網頁美工設計卻并不都盡如人意，有些網頁的制作技術雖然已經很純熟，內容設計上也接近完美，但在投放和使用中仍然沒有達到最初設想的效果，這種現象的出現究其原因是網頁設計中色彩搭配不夠合理，在色彩的搭配的藝術性和獨特性上體現不明顯。同時，各個網頁設計之間區別不大，創新不足，還有一種就是在設計上雖然有創新，但同時也給受眾群體一種不信任感，色彩是人們能夠接受和欣賞的最基礎、最普遍的美感，色彩的搭配如果運用的好，可以增強網頁設計的的美感，給受眾帶來強烈的視覺沖擊，同時在宣傳自我設計理念時還能夠引發與受眾的共鳴，進而增強其藝術吸引力。因此，設計師們在網頁美工設計時要注重對色彩的搭配，在合理搭配方面下功夫，使色彩在網頁美工中發揮應用的作用。

一、色彩的特點

色彩是自然界的饋贈，給人們的生活增添了樂趣，不同的色彩給人的感覺也不同，有的讓人開心有的讓人感覺壓抑。但是色彩本身并沒有感情，是它產生的顏色引起的情感體驗，其中最重要的就是對色彩當中各種色相、明度、純度的各種不同搭配而產生的不同的效果。

（一）色相指的就是對各種顏色的稱呼，如玫紅、葡萄籽、金屬黑、鉆石藍等，色相是對色彩的分類，這些體現色彩之間最大區別。同時，色相是光射入人眼后產生的，因此，根據光線的波長又有了不同的區分。

（二）純度是指色彩當中的純凈程度和色彩的飽和度，也就是顏色當中所還有的不同色的成分的比例。這種純度受影響的因素很多，比如色彩所附著的物體的材質、結構、光照及人們的眼睛都是影響因素，一定程度上可以說色彩成分的比例越大，純度就越高，反之就是越小。

（三）明度是指色彩的明亮的程度，看起來是色彩相同的在明度上可能也是存在深淺的區別，比如黃色的飽和度最高，看起來最亮，而藍色和紫色則會稍微暗一點。明度的變化也會影響色彩的純度，比如在紅色中加入黑色，紅色會變成暗紅，這時的純度就降低了，相反則會增高。

二、網頁美工設計中運用色彩的原則

每一個網頁的美工設計都不是毫無目的的，設計師在設計網頁時既要有基本的技術專業功底，同時還應該遵循運用色彩的藝術原則，要整體去把握網頁的協調性，根據網站的受眾人群及主題去進行設計和搭配，進而達到既有別于其他網頁又突出自我特點的效果。具體來講有三個原則要遵循。

（一）突出自己網頁的設計特色。網絡信息的普及和運用，給網站帶來了巨大的發展空間的同時，也帶了前所未有的挑戰。各類網站層出不窮，同類網站競爭激烈，如果不能在同類群體中脫穎而出，就很難存活下去，因此，網頁美工設計作為視覺藝術，要通過色彩搭配的設計和運用來形成自己的風格，突出自己的特點，吸引受眾的目光。這種既要協調又要突出的要求，要求設計師在設計過程中，在遵循色彩搭配的基本規律的前提下，大膽創新，整體上保持協調，在局部進行改造，用強烈的對比色來突出特色，凸顯與眾不同。

（二）要注意與網頁主題的搭配。色彩作為一種視覺藝術呈現在人們面前，其色彩的不同則想要傳遞給人的信息也不同，人們所獲得的情感體驗也會不同，因此，在色彩的運用上，追求創新的同時還要注意與網頁的設計主題相契合，只有這樣才能向受眾傳達網站的理念。比如若想展示網站的優雅和嚴肅，在色彩上就要以冷色調為主；再如渲染節日氣氛時就要用紅色等較為明亮的顏色，營造熱鬧、熱情的氛圍；在宣傳環保和健康的網頁中就應該多用綠色作為主色調，給人健康、舒服的感覺。

（三）色彩的搭配要考慮持續性。網頁的色彩的搭配完畢，在一定時期內其主題是不需要更改和更換的，但當前網站競爭壓力大，想要留住瀏覽者的角度，保持新鮮感是方法之一。因此，為了提高自身的魅力值，應該對網頁的色彩各方面的搭配上進行一些小范圍的調整和更換，來增強網頁的吸引力。如在企業的網頁設計中在色彩運用上要考慮圍繞企業的標準色來進行設計，進而幫助企業做好網絡的宣傳和推廣，同時，在一些節日或者活動時也應該進行相應的添加，但不能影響主體的色才主基調。

三、網頁美工設計中色彩搭配的應用

（一）對主體色的把握。在網頁設計中，除了白色外，被大范圍使用的顏色便是主體色，主體色的應用直接影響主題的體現。因此，在網頁美工設計過程中，設計師要熟悉掌握網頁的主題和受眾群體的特征，再來確定頁面的主體色，根據色彩的主次搭配，讓整個網頁既突出主題有不至于單調，看起來和諧美觀。首先在冷色調的應用上，要充分考慮其波長，因為其波長較短，能見度低，讓人在視覺上的感受過于嚴肅、壓抑，如藍色、青色和與其相接近的其他色彩。在網頁美工設計中，設計師往往會用這種冷色調來營造寧靜、肅穆的氛圍，同時還能夠借助冷色調來起到增大網頁的空間的效果。如在司法系統的網頁設計中，在主體色調中選擇藍色，用藍色來展示法律工作的莊嚴，營造一種莊嚴肅穆的氛圍，既體現其自身的形象，同時也起到了很好的宣傳效果；另一方面，冷色調還能夠讓人感覺的涼爽和舒適，因此，在炎熱的夏天進行宣傳時，可以選擇冷色調來對網頁的色調進行更換和調整，來激發人們的購買欲，增強視覺上的舒適感。暖色調波長較長，可見度高，給人一種活力、熱情和活潑的感覺，因此，設計者往往在網頁設計中愿意使用這些暖色調來烘托氣氛，讓人們在瀏覽網頁的過程中能夠被感染，心情愉悅。如我國最大的電商門戶網站淘寶，在春節和“雙11”大促中，網頁設計會大量的使用紅色，刺激人們的消費，再如肯德基的廣告宣傳頁總是用活力四射的紅色，讓人心情愉悅。黃色在色彩上飽和度較高，給人一種溫暖和充滿活力的感覺，因此在設計中也被大量的運用。之后就是橙色，在色彩的明度上也較明亮，純度是比較接近于紅色，也是比較醒目的顏色，但是它同紅色的那種熱烈相比，顯得更容易被親近，有活力的同時又有點嚴肅，很多網頁會把橙色作為主體色來使用。

（二）多色彩的把控。一個網頁若只有一個色彩出現就會顯得過于單調，很難有受眾，同理，若一個網頁色彩過多，色彩間的跳躍太大也會讓人感覺煩悶，很難停留太久，因此，在色彩的應用上要注意色彩與色彩之間的過渡和相互之間的和諧。另一方面，設計師在網頁美工設計中還要充分考慮網頁設計的商業目的，大多數情況下，網頁都有要宣傳的商品，但在當前競爭越來越激烈的市場，大而全的宣傳很難贏得消費者，只有求新、求精、求細，才能在眾多網站中脫穎而出。因此，網頁美工設計中還要考慮網站的整體風格，與當前的宣傳商品的總體基調也要契合，將色彩對人們的心理暗示的特點發揮出來。

（三）做好色彩之間的過渡。兩個相近的顏色是最好的過渡色，同一個色系的不同純度的兩個顏色也可以很好地過渡。在網頁美工設計中，根據網站的主題，用冷暖搭配和明暗交替的幾個相近色進行搭配，但數量上最好控制好，不可過多，最好是三個左右，可以營造一種和諧平衡的美感，這些相近的顏色在成分上會有很多共同之處，搭配在一起可以讓色彩烘托氛圍的效果更強。比如在化妝品的網頁宣傳中，為了宣傳它健康、清潔和滋養的功能，用柔和的、淡雅的和暖色的色彩可以給人一種干凈、舒適和可信任的感覺，可以提升消費者對化妝品的信任感，從而刺激消費者去購買。室內涂料的宣傳上，重要體現其綠色、環保和無毒的特性，為此，在色彩的選擇上多以白色、綠色和藍色為基調，可以體現一種清爽、干凈的感覺；再如，在一些奢侈品的廣告中，主要是融入黑色、金色、白色等冷色調，突出其高貴、優雅的品味，體現其高級感。針對不同的產品特點及宣傳理念其使用的色彩區別很大。

（四）合理使用對比色。對比色顧名思義是兩個色相相差很大的色彩，但對比色雖然反差大，但若合理運用起來，能夠達到很好的效果。在對比色中尤以補色的反差最強烈，在效果上也最好。比如紅綠的對比、橙色與藍色的對比，它們的搭配可以達到很強的視覺沖擊，讓人們可以感受到熱烈又不失優雅的氣氛。這些對比色往往被用于在網頁中的廣告和標題的宣傳，能夠迅速抓住人的眼球，增強網頁的吸引力。比如聚美優品的網頁設計中用粉色和黑色營造了一種柔美又不失專業的氛圍；如京東商城的網頁設計中突出了藍色，又有灰色和黑色的搭配。這些不僅使網頁空間看起來得到了延展，同時也能夠給人一種專業、嚴肅的感覺，增強信任感；再如在婚戀網站上，往往會選擇紅色和金色的飽和色來營造熱情喜慶的氛圍。

（五）適當采用黑白色。黑白色算是色彩當中的萬能色，可以和任何的色彩進行比例調配和搭配。其中，白色是最常被使用的顏色，有些網頁會故意留出一部分白色來讓人去猜，黑色在運用上不及白色多，但是在調節功能上不輸白色。在一些顏色飽和色過高，過于明亮的顏色上，加入黑色進行調和，會顯得更加和諧，人們在瀏覽過程中也會更加舒服。如果在網頁美工設計中，選用的色彩難以選擇時，可以嘗試用黑白色。比如一些奢侈品中的香水廣告中，就會大面積運用黑白色，二者合理布局不僅不會顯得單調，反而能夠凸顯商品的特點，顯得與眾不同，又具有高級感。在題目的設計上也可以廣泛地運用黑白色，二者的搭配可以讓題目更加的清晰，增加瀏覽者的閱讀興趣。

四、結語

網絡市場的競爭越來越激烈，想要讓自己的網站能夠在競爭中立于不敗之地，做好自己的產品的同時，還需要好的宣傳和包裝，這就要求網頁設計者在網頁美工設計中要有一個好的審美，合理運用色彩搭配，讓網頁整體和諧充滿美感，在遵循色彩運用的原則的同時適度創新，增加網頁的特色，提升網頁的藝術魅力，這樣才能吸引更多的受眾，才有利于產品的宣傳和銷售。

參考文獻：

[1]中央編譯局.馬克思恩格斯全集[M].北京：人民出版社，1963.

[2]孟東生.色彩[M].石家莊：河北教育出版社，2008.

[3]秦盈瑩.網頁設計中的色彩探析[J].企業科技與發展，2008，（04）：55.

[4]馬艷麗.談網頁設計的風格把握和色彩搭配[J].藝術研究，2008，（02）：120-121.

[5]黃在賢.設計師談精彩網頁設計[M].北京：電子工業出版社，2004.

[6]權智殷.設計師談網頁色彩與風格[M].北京：電子工業出版社，2005.

[7]李立偉.淺談網頁色彩設計[J].鄭州輕工業學院學報（社會科學版），2007，（02）：74-77.

[8]文紅.色彩構成[M].重慶：重慶大學出版社，2005.

[9]文芳，李明.中國網頁設計前線[M].長沙：湖南美術出版社，2002.

[10]張連生，單德林.設計色彩[M].南京：江蘇美術出版社，2001.