導語：商務(wù)網(wǎng)站頁面色彩以及分布一文來源于網(wǎng)友上傳，不代表本站觀點，若需要原創(chuàng)文章可咨詢客服老師，歡迎參考。

目前,SEO(搜索引擎優(yōu)化)已成為眾多商務(wù)網(wǎng)站提高點擊率的一個重要手段,但SEO主要是從搜索引擎的角度來優(yōu)化頁面,著眼于關(guān)鍵字在頁面中的位置、頁面內(nèi)容的簡練等,而忽略了消費者的偏好和使用習慣,導致不少網(wǎng)站雖然提高了訪問量,但提高的訪問量并沒有轉(zhuǎn)化成訪問者的購買行為,甚至不少瀏覽者進入頁面后,幾乎沒有停留便關(guān)閉網(wǎng)頁,這就要在SEO的基礎(chǔ)之上,通過頁面色彩與布局的合理設(shè)置,做到不但能把人"請進來",而且能"留下來".

一.商務(wù)網(wǎng)站色彩定位在人的日常生活中,視覺提供的信息量是相當大的,大約為所有感官所能提供信息量之和的80%,這就決定了一個成功的商務(wù)網(wǎng)站在色彩的設(shè)置上必須做到:第一要與網(wǎng)站主題一致,第二要能和諧統(tǒng)一并且吸引人,從而對網(wǎng)站的主、輔色調(diào)的設(shè)置提出了要求.

色調(diào)是指一幅作品色彩外觀的基本傾向,在明度、純度、色相這三要素中,某種因素起主導作用,我們就稱之為某種色調(diào).本文主要從主頁面的色相的運用來進行闡述.

1、主色調(diào).網(wǎng)站的主色調(diào)是網(wǎng)站主題的體現(xiàn),是頁面色彩的主要色調(diào)、總趨勢,其他配色不能超過該主要色調(diào)的視覺面積,往往用于網(wǎng)頁的底色和主要圖案.不同的商務(wù)網(wǎng)站所適用的主色調(diào)是有區(qū)別的,可以從企業(yè)形象、產(chǎn)品性質(zhì)、消費者特征等方面來考慮.

首先,從企業(yè)形象的角度來選擇色調(diào)是首先考慮的重要方面.主色調(diào)中色相選藍色的大企業(yè)居多,因為藍色是最冷的顏色,突出了企業(yè)冷靜、睿智、不斷進取的形象.

如微軟公司、中國移動通信集團、蘇寧電器股份有限公司均選擇了藍色.金融類企業(yè)的網(wǎng)站偏向于選擇冷色系,以期帶給瀏覽者穩(wěn)健強大的感覺.如中國銀行、中國建設(shè)銀行使用了藍色,中國農(nóng)業(yè)銀行使用淡綠.旅游類網(wǎng)站在選擇主色調(diào)的時候也往往將目光投向綠色和藍色,因為綠色是和平色,偏向自然美,藍色是天空和海洋的顏色,容易激發(fā)人向往自然,追求寧靜的情緒.如南京旅游網(wǎng)、涂牛旅游網(wǎng)采用了綠色,旅游環(huán)球網(wǎng)、攜程旅行網(wǎng)采用了藍色.

其次,產(chǎn)品的性質(zhì)也是決定網(wǎng)站主色調(diào)的重要因素,汽車、電腦、電視、音響、儀器等具有金屬成分且有相當科技含量的產(chǎn)品,所選用的色彩往往是藍色、黑色、白色、灰色.因為藍色沉穩(wěn)的特性,具有理智,準確的意象,如聯(lián)想電腦中國網(wǎng)站采用了淡藍色;黑色具有高貴、穩(wěn)重、科技的意象,如東芝液晶電視-中國官方網(wǎng)站選用了黑色,以突出其"領(lǐng)先、創(chuàng)新"的企業(yè)理念;白色具有高級、科技的意象,如BMW中國官方網(wǎng)站采用了白色;灰色具有柔和、高雅的意象,而且屬于中間性格,男女皆能接受,所以灰色也是永遠流行的主要顏色,如奔馳中國官網(wǎng)的主頁從左到右使用了逐漸淡化的灰色,柔和的感覺暗暗打動瀏覽者的心,盡顯其Mercedes-給車主帶來幸福的寓意.食品類網(wǎng)站通常會選用暖色調(diào)中的橙色、紅色、綠色.橙色是歡快活潑的光輝色彩,是暖色系中最溫暖的色,它使人聯(lián)想到金色的秋天,豐碩的果實,是一種富足、快樂而幸福的顏色,同時橙色也是最使人產(chǎn)生食欲的顏色,所有橙色通常是食品類網(wǎng)站的首選,如康維多奶粉中國官網(wǎng)就使用了橙色,給瀏覽者(多為新生兒媽媽)溫馨幸福的感覺;紅色是最引人注目的顏色,是熱情、活力、能量的象征,對于宣傳著力于帶來活力或溫暖的食品可考慮采用紅色,如可口可樂(中國)官方活動網(wǎng)站,打開主頁面,通篇是跳脫的大紅色,所帶來的色彩沖擊與它"活力永遠是可口可樂"的宣傳口號非常貼切;綠色所傳達的清爽,理想,希望,生長的意象,往往為保健類食品網(wǎng)站所青睞,如樂力官方商城就采用了綠色.

再次,消費者的特征也是不可忽略的因素.男性網(wǎng)多使用冷色作為主色調(diào),如怒劍網(wǎng)、男人幫都采用了藍色.女性網(wǎng)站使用粉紅色的較多,如鳳網(wǎng)、魅網(wǎng)在線.紫色也多為女性網(wǎng)站所用,如.兒童或親子類網(wǎng)站多用綠色、橙色,給人生機蓬勃、溫馨的感覺,如中國兒童教育網(wǎng)采用橙色和綠色,寶寶媽媽網(wǎng)采用綠色.

2、輔色調(diào).定義了主色調(diào)后,需要在"總體協(xié)調(diào),局部對比,突出特點"的原則上確定輔色調(diào).網(wǎng)站的輔色調(diào)是僅次于主色調(diào)的視覺面積的輔助色,用來烘托主色調(diào)、支持主色調(diào),起到增強主色調(diào)的感染力,使頁面更加和諧生動的效果.

用同類色.一般指單一色相系列的顏色,指通過調(diào)整主色調(diào)的透明度或者飽和度(通俗些而言就是將色彩變淡或則加深),產(chǎn)生新的色彩,用于網(wǎng)頁.這樣的頁面看起來色彩統(tǒng)一,有層次感.如海爾的外文網(wǎng)站,主色調(diào)是淺藍色,而輔色調(diào)則類顏色稍深的湖藍色.這種顏色的搭配給人協(xié)調(diào)感,產(chǎn)生了微妙的韻律美.

以色相環(huán)來劃分,奧斯特瓦爾德顏色系統(tǒng)的基本色相為黃、橙、紅、紫、藍、藍綠、綠、黃綠8個主要色相,每個基本色相又分為3個部分,組成24個分割的色相環(huán).

24色相環(huán)中相距45度,或彼此相隔二三個數(shù)位的兩種色彩,為同類色關(guān)系,簡單的說就是用一個感覺的色彩,例如淡黃和淡綠色、紅和橙色.如拉手網(wǎng),主色調(diào)為淡紅色,輔色調(diào)采用橙色,主輔色調(diào)極為協(xié)調(diào),給人溫馨的感覺.

用臨近色.色相環(huán)中相距90度,或相隔五六個數(shù)位的兩色,為鄰近色關(guān)系.色調(diào)感覺調(diào)和又避免單調(diào),如藍與紫、黃和綠.

用對比色.色相環(huán)中相距135度或相隔八九個數(shù)位的兩色,為對比色關(guān)系.屬于中強對比效果的色組.如藍色和黃色,整個頁面色彩豐富但不花稍.如薄荷女人網(wǎng),主色調(diào)為淡紅色,輔色調(diào)為綠色,在突出女性柔美特點的同時,增強了網(wǎng)站色彩的鮮明感,也和網(wǎng)站主題相貼切.

用補色.色相環(huán)中相隔十二個數(shù)位后相距180度的兩色,為補色關(guān)系.補色關(guān)系的色組,是對比最強的色組,給人以強烈的視覺沖擊,如紅和綠、黃和紫.使用補色比較容易出彩,但在配色時要注意通過主輔色調(diào)面積的大小,或以分散形態(tài)的方式來緩和過于激烈的對比.如卡卡樂園網(wǎng),以紅色為主色調(diào),綠色為輔色調(diào),紅底色襯著蜿蜒分塊的綠色,給人既生動又和諧的感覺.

用黑色.大部分彩色配黑色都會給人留下很深的印象.如EELE中國,以玫紅色為主色調(diào),以黑色為輔色調(diào),給人浪漫、時尚的感覺沖擊.

除了主、輔色之外,還有點睛色、背景色的運用,以及純度明度的合理安排,這些都是商務(wù)網(wǎng)站設(shè)計必須要考慮的.總之,在商務(wù)網(wǎng)站色彩設(shè)計時要注意如下幾點:不要片面追求出彩,色彩的選擇始終要以適合于讀者群為關(guān)鍵,如視覺刺激較強烈的頁面會給年輕人留下深刻的印象,從而吸引進一步瀏覽,但對年長的瀏覽者卻會形成反面效果;網(wǎng)頁歸根結(jié)底是為了傳達訊息,因此色彩的使用要適合閱讀,在閱讀的部分要使用對比色;不要使用過多的顏色,除了黑與白之外,頁面色彩總類不要超過三種.

二、商務(wù)網(wǎng)站布局安排1、主頁面.主頁面是兼具網(wǎng)站的封面及目錄功能,是決定網(wǎng)站風格和吸引瀏覽者的重要頁面,主頁面的布局安排在網(wǎng)站設(shè)計中具有舉足輕重的作用.

骨骼型.骨骼型是最常見的網(wǎng)頁布局,是一種規(guī)范化的、理性的分割方法,類似于報刊的版式.主要分為豎向通欄、雙欄、三欄和橫向的通欄、雙欄、三欄等.一般以豎向分欄為多.這種版式給人以和諧、理性的美."T"型、"同"型、"回"型等布局都屬于骨骼型布局.通欄結(jié)構(gòu)通常適用于信息少、圖片多,以宣傳產(chǎn)品和企業(yè)形象為目的的網(wǎng)頁,如海爾集團、聯(lián)想集團網(wǎng)站.二分欄結(jié)構(gòu)一般情況下都是左窄右寬,在右側(cè)的寬欄中嵌入多個橫向的分欄.這種結(jié)構(gòu)效果簡練、大氣,個性鮮明,各功能區(qū)域分割清晰,一目了然,能夠放置較多信息且便于瀏覽者閱讀,是著重在主頁進行產(chǎn)品展示的商務(wù)網(wǎng)站進行網(wǎng)頁布局的首選.如當當購網(wǎng)、淘寶數(shù)碼網(wǎng).三分欄結(jié)構(gòu)在商務(wù)網(wǎng)站中最為普遍,其特點是結(jié)構(gòu)清晰、明確,通常適合于信息量大、更新速度快的商務(wù)網(wǎng)站和綜合網(wǎng)站.其結(jié)構(gòu)通常表現(xiàn)為頁面頂部為橫條網(wǎng)站標志+廣告條+導航欄,下面豎向分為三欄,若干橫欄,可以放置不同的內(nèi)容的鏈接,如新浪,第一塊豎向三欄從左到右分別為廣告、視頻、新聞.

自由型.這種結(jié)構(gòu)的隨意性比較大,通過不同形態(tài)圖形或曲線的運用,巧妙地安排文字,達到提升美感、給瀏覽者較強的視覺沖擊的效果,這種類型的頁面往往用在體現(xiàn)創(chuàng)作者的創(chuàng)意,使瀏覽者產(chǎn)生共鳴,但文字通常較少.如奧黛莉網(wǎng)站,潔白的界面上綻放著淡雅的花,頁面的焦點是花中一美麗女性,圍繞著花簡單放置著相關(guān)鏈接.帶給瀏覽者無盡的美感和遐想.

Flash型:這種布局將Flash作為主體內(nèi)容,文字說明或欄目條被分布在不顯眼的位置,這種設(shè)計較多運用在時尚類網(wǎng)站或網(wǎng)站用來推廣相關(guān)產(chǎn)品.如雅詩蘭黛網(wǎng)站,深藍色的底色上演繹著異國風味的flash,盡顯優(yōu)雅時尚.

Pop(海報型)型:指頁面布局就像一宣傳海報,如薇姿網(wǎng)站,進入主頁,映入眼簾便是如海報般的一幅畫面,用來推介某一款產(chǎn)品,清新的界面、明確的主題較易獲得訪問者的認同感,并激起進一步瀏覽下去的欲望.

2、其它頁面.其它頁面分為兩種,一種往往是二級頁面,對應(yīng)于主頁面上相應(yīng)的頻道,內(nèi)容比較豐富,需要放置大量的鏈接和圖片,這種頁面布局多考慮采取三欄式;另外一種頁面用來放置具體的內(nèi)容,頁面布局多采用"匡"型結(jié)構(gòu),旨在給主內(nèi)容區(qū)更多空間.這種布局上面是標題及廣告橫幅,接下來的左側(cè)/右側(cè)是一窄列鏈接等,右列/左列是很寬的正文,下面放置一些的輔助信息,如相關(guān)新聞、留言等.

網(wǎng)頁一定要有統(tǒng)一感,即訪問者在瀏覽同一網(wǎng)站的頁面時,認可所有的頁面屬于同一網(wǎng)站,這需要網(wǎng)站所有頁面有一致的風格,也可說網(wǎng)站的每一頁面都要遵循網(wǎng)站CI形象設(shè)計.

三、結(jié)束語商務(wù)網(wǎng)站設(shè)計需要從定位、色彩、布局、模塊、內(nèi)容等方面綜合考慮,每一個方面都會關(guān)系到網(wǎng)站的成敗,在進行網(wǎng)站設(shè)計時,一定要以商務(wù)的眼光,從企業(yè)、消費者的角度出發(fā),在細節(jié)上下功夫,只有這樣,網(wǎng)站才能在電子商務(wù)的大潮中站住腳,無論是在提升企業(yè)知名度,還是在開拓市場方面起到積極的作用.