企業(yè)網(wǎng)站模板設(shè)計(jì)風(fēng)格色彩

企業(yè)網(wǎng)站模板設(shè)計(jì)風(fēng)格色彩

一、網(wǎng)站設(shè)計(jì)的風(fēng)格

“風(fēng)格”是指站點(diǎn)的整體形象給瀏覽者的綜合感受。這個(gè)“整體形象”包括站點(diǎn)的CI（標(biāo)志，色彩，字體，標(biāo)語(yǔ)）、版面布局、瀏覽方式、交互性、文字、語(yǔ)氣、內(nèi)容價(jià)值等等諸多因素。風(fēng)格是有人性的，不管是色彩、技術(shù)、文字、布局，還是交互方式，只要能由此讓瀏覽者明確分辨出這是本網(wǎng)站獨(dú)有的，這就形成了網(wǎng)站的“風(fēng)格”。一般都要求：清純簡(jiǎn)潔，主題鮮明，內(nèi)容編排得當(dāng)合理、有一定的藝術(shù)感，美觀、實(shí)用，相關(guān)鏈接正常，能體現(xiàn)網(wǎng)站的基本功能，可以從以下幾個(gè)方面來為網(wǎng)站設(shè)計(jì)一個(gè)獨(dú)特的風(fēng)格。

1.網(wǎng)站標(biāo)志(LOGO)

LOGO是指網(wǎng)站的標(biāo)志，標(biāo)志可以是中文、英文字母，也可以是符號(hào)、圖案等。標(biāo)志的設(shè)計(jì)創(chuàng)意應(yīng)當(dāng)來自網(wǎng)站的名稱和內(nèi)容。比如：網(wǎng)站內(nèi)有代表性的人物、動(dòng)物、植物，可以用它們作為設(shè)計(jì)的藍(lán)本，加以卡通化或者藝術(shù)化；專業(yè)網(wǎng)站可以以本專業(yè)有代表的物品作為標(biāo)志。最常用和最簡(jiǎn)單的方式是用自己網(wǎng)站的英文名稱作標(biāo)志，采用不同的字體、字母的變形、字母的組合可以很容易制作好自己的標(biāo)志。

2.網(wǎng)站色彩

網(wǎng)站給人的第一印象來自視覺沖擊，不同的色彩搭配產(chǎn)生不同的效果，并可能影響到訪問者的情緒。顏色搭配是體現(xiàn)風(fēng)格的關(guān)鍵�！皹�(biāo)準(zhǔn)色彩”是指能體現(xiàn)網(wǎng)站形象和延伸內(nèi)涵的色彩，要用于網(wǎng)站的標(biāo)志、標(biāo)題、主菜單和主色塊，給人以整體統(tǒng)一的感覺。至于其它色彩也可以使用，但應(yīng)當(dāng)只是作為點(diǎn)綴和襯托，絕不能喧賓奪主。例如IBM的深藍(lán)色，肯德基的紅色條型。一般來說，一個(gè)網(wǎng)站的標(biāo)準(zhǔn)色彩不超過3種，太多則讓人眼花繚亂。適合于網(wǎng)頁(yè)標(biāo)準(zhǔn)色的顏色有：藍(lán)色，黃/橙色，黑/灰/白色三大系列色。一般以白色和黑色的背景網(wǎng)頁(yè)最好做，顏色搭配最方便；亮色與暗色配合，最容易突出畫面，如黑與白，紅與黑，黃與紫；而近似的顏色的搭配，能給一種柔和的感覺，如墨藍(lán)與淡藍(lán)，深綠與淺綠。最好能給主頁(yè)定一個(gè)主色調(diào)，不要搞得花花綠綠的。

3.設(shè)計(jì)網(wǎng)站字體

和標(biāo)準(zhǔn)色彩一樣，標(biāo)準(zhǔn)字體是指用于標(biāo)志、標(biāo)題、主菜單的特有字體。一般網(wǎng)頁(yè)默認(rèn)的字體是宋體。為了體現(xiàn)站點(diǎn)的“與眾不同”和特有風(fēng)格，可以根據(jù)需要選擇一些特別字體。制作者可以根據(jù)自己網(wǎng)站所表達(dá)的內(nèi)涵，選擇更貼切的字體。需要說明的是：使用非默認(rèn)字體只能用圖片的形式，因?yàn)楹芸赡転g覽者的計(jì)算機(jī)里沒有安裝特別字體，他看到的只能是亂碼，那么辛苦的設(shè)計(jì)制作便付之東流了。

4.使用精煉有效的語(yǔ)言

現(xiàn)代生活節(jié)奏加快，人們往往沒有時(shí)間看大塊文章。為了節(jié)約時(shí)間，在單位時(shí)間內(nèi)獲取最大量的信息，人們需要精練的信息，即信息精品，要用信息語(yǔ)言來表達(dá)信息內(nèi)容。所謂信息語(yǔ)言是指以下公式：信息=基本事實(shí)＋數(shù)據(jù)描述＋專家觀點(diǎn)。

信息語(yǔ)言摒棄一切廣告性詞句、文學(xué)性修飾詞句，不歡迎一切關(guān)于意義、重要性的過分渲染。盡量采用數(shù)字說話，歡迎定量描述，反對(duì)過多的定性描述，特別是無法形成準(zhǔn)確概念的定性描述。用信息語(yǔ)言描述，任何信息都應(yīng)該有出處，有時(shí)間，分類準(zhǔn)確。當(dāng)然，應(yīng)當(dāng)滿足信息的時(shí)效性、準(zhǔn)確性、完整性、精練性等固有的特點(diǎn)。在此特別注意的是，不要出現(xiàn)錯(cuò)別字、病句。

5.設(shè)計(jì)網(wǎng)站宣傳語(yǔ)

網(wǎng)站的宣傳語(yǔ)也可以說是網(wǎng)站的精神、主題與中心，或者是網(wǎng)站的目標(biāo)，用一句話或者一個(gè)詞來高度概括。用富有氣勢(shì)的話或詞語(yǔ)來概括網(wǎng)站，進(jìn)行對(duì)外宣傳，可以收到比較好的結(jié)果。

二、網(wǎng)站設(shè)計(jì)的色彩搭配

打開一個(gè)網(wǎng)站，給用戶留下第一印象的既不是網(wǎng)站的豐富內(nèi)容，也不是網(wǎng)站合理的版面布局，而是網(wǎng)站的色彩。色彩對(duì)人的視覺效果非常明顯，一個(gè)網(wǎng)站設(shè)計(jì)成功與否，在某種程度上取決與設(shè)計(jì)者對(duì)色彩的運(yùn)用和搭配，因此專業(yè)人士把色彩制作成色系表，根據(jù)這些色系讓網(wǎng)站也有其自身的色系，網(wǎng)站的色系是瀏覽者整體的視覺觀感，若一個(gè)網(wǎng)站色系能有一致性，不僅會(huì)使網(wǎng)站看起來美觀，更能讓瀏覽者對(duì)內(nèi)容不易混淆，增加了瀏覽的簡(jiǎn)潔與方便。而網(wǎng)站的色系更能襯托出網(wǎng)站的主題，若色系能與主題合理搭配，將會(huì)增加瀏覽者的易讀性。網(wǎng)站的色系包含了網(wǎng)頁(yè)的底色、文字字型、圖片的色系、顏色等等，這不單只是將顏色搭配得當(dāng)就算完美，還要配合每個(gè)內(nèi)容，及網(wǎng)站主題。

1.網(wǎng)頁(yè)的底色

網(wǎng)頁(yè)的底色是整個(gè)網(wǎng)站風(fēng)格的重要指針。舉例來說，以黑色作為背景顏色的網(wǎng)頁(yè)，因黑色本對(duì)人的視覺上會(huì)造成黯淡的感覺，若是拿來用作活潑的兒童網(wǎng)站，就是不適合了。因?yàn)樾『⒆邮翘煺鏌o邪的、活潑的、有朝氣的，與黑色的沉穩(wěn)、黯淡，很難聯(lián)想在一起。當(dāng)然，每個(gè)人的審美觀不同，可能也會(huì)對(duì)顏色的代表性看法不同，但既然網(wǎng)站不是只寫給自己看的，就應(yīng)該要注意到大部分人可能會(huì)有的觀點(diǎn)，然后以眾人居多的觀點(diǎn)出發(fā)，來設(shè)計(jì)網(wǎng)頁(yè)。

2.文字字型

文字字型上的設(shè)計(jì)，最好的網(wǎng)站是以所有瀏覽者都能看到的字型為主。常會(huì)看到有許多網(wǎng)站要求瀏覽者須自行下載某種字型，才能達(dá)到最佳瀏覽效果，這是種非常奇怪的行為。畢竟瀏覽者只是來找資料或是來看網(wǎng)站的內(nèi)容，不可能會(huì)因?yàn)檫@種“為達(dá)最佳瀏覽效果”，而自行下載所需要的字型。當(dāng)所要求的字型若不下載，并不會(huì)影響到網(wǎng)站內(nèi)容上的瀏覽與不便，那么對(duì)瀏覽者的要求就微乎其微不可能發(fā)生任何作用。這么一來，對(duì)于網(wǎng)頁(yè)設(shè)計(jì)者來說，無非是非�？上У模�因?yàn)楫?dāng)初的設(shè)計(jì)風(fēng)格卻未能讓瀏覽者一窺全貌，豈不是白費(fèi)心思的嗎？

3.圖片的色系

以色彩學(xué)簡(jiǎn)單的區(qū)分，色系可分為冷色系與暖色系，再詳細(xì)一點(diǎn)的區(qū)分，又可分出各種顏色的色系，而色系的區(qū)分，就在于主觀瀏覽意識(shí)上的差異了。如何將圖片的色系與網(wǎng)站整體色系相對(duì)應(yīng)，就是比較困難的地方了。要繪制一張圖并非易事，要繪制一張符合自己網(wǎng)頁(yè)風(fēng)格的圖，更是困難重重。大部分的網(wǎng)頁(yè)制作者，并不大可能駕輕就熟的使用影像處理軟件或繪圖軟件，于是乎，網(wǎng)頁(yè)素材的網(wǎng)站就開始盛行了。當(dāng)然，不會(huì)使用繪圖軟件并不代表網(wǎng)頁(yè)就不能設(shè)計(jì)的很出色，若是能將網(wǎng)絡(luò)上的素材資源妥善利用，網(wǎng)站也是可以走出自己的風(fēng)格的。而該怎么選擇適合自己網(wǎng)站的圖片，就是門很大的學(xué)問了。

以圖片內(nèi)容來說，能切合網(wǎng)站主題最好，若不能，也別差異太多。以顏色來說，若一個(gè)網(wǎng)頁(yè)是藍(lán)色的底色，但整個(gè)網(wǎng)頁(yè)的圖片卻亂七八糟，各種顏色紛紛出籠，更糟的是，藍(lán)色是屬于冷色系的顏色，若以藍(lán)色為底的網(wǎng)頁(yè)，卻盡都是大紅色、橘色的圖片，那將會(huì)使整張網(wǎng)頁(yè)看起來就像垃圾堆，雜亂無章。所以，可以簡(jiǎn)單的歸納出，網(wǎng)頁(yè)與圖檔的顏色，色系一致或是視覺效果一致，將會(huì)使網(wǎng)頁(yè)看起來更為美觀且有自己的風(fēng)格。

4.網(wǎng)頁(yè)的顏色

網(wǎng)頁(yè)的顏色，并非單一就圖文件、文字顏色、或是底色為主，而是以瀏覽者的角度來觀看，整體網(wǎng)頁(yè)看上去是偏向哪種色系。常常見到許多網(wǎng)站雖然色系搭配的很好，但卻是沒有自己的風(fēng)格。以目前流行的柔色系、粉色系網(wǎng)站來說，就是失了自己獨(dú)到的風(fēng)格。因?yàn)槭褂梅凵�系的網(wǎng)站，不外乎都有相同的特點(diǎn)，文字顏色淺，底色也以淺色系為主，這樣除了沒有自己的風(fēng)格外，看起來既不大方也難登大雅之堂。以各大搜尋網(wǎng)站來說，根本不會(huì)做這樣的設(shè)計(jì)，因?yàn)槲淖诸伾�淡，加上底色淺，對(duì)瀏覽者來說，閱讀上非常吃力，所以這樣的設(shè)計(jì)風(fēng)格也應(yīng)盡量避免。一個(gè)有自己風(fēng)格，且閱讀起來舒適大方的網(wǎng)頁(yè)，并不可能一次就寫好，而是需要經(jīng)過不厭其煩的修正、調(diào)色，才能達(dá)到最佳瀏覽效果的。

三、網(wǎng)頁(yè)的美化設(shè)計(jì)

1.使用CSS優(yōu)化網(wǎng)頁(yè)外觀

使用CSS來獲得對(duì)整個(gè)站點(diǎn)所有WEB頁(yè)面的外觀控制。設(shè)置頁(yè)邊空白，頁(yè)面填充，邊界，顏色和背景。對(duì)任意網(wǎng)頁(yè)元素設(shè)置字體大小及改變字體外觀。創(chuàng)建動(dòng)態(tài)活動(dòng)鏈接。創(chuàng)建CSS風(fēng)格的完全兼容的網(wǎng)頁(yè)。

CSS的主要好處就在于，你不用去修改網(wǎng)頁(yè)文件，只要修改這個(gè)頁(yè)面連接的CSS文件，就可以實(shí)現(xiàn)不同的顯示效果，包括底色、背景圖片、文字大小、顏色、邊框……等等。網(wǎng)站的版面、布局要求，不能占用較大的邊幅放欄目圖片，正文的位置不能少，圖片與文章的搭配要平衡，過多使用大圖片，大大增加了傳輸流量，影響了網(wǎng)站瀏覽者閱讀的速度，要優(yōu)化網(wǎng)頁(yè)就盡可能使用CSS實(shí)現(xiàn)，靈活地使用CSS，可以使頁(yè)面精致漂亮而又不會(huì)占用過多的系統(tǒng)資源，所以很有必要花些時(shí)間研究一下。

2.用表格美化頁(yè)面布局

表格布局好像已經(jīng)成為一個(gè)標(biāo)準(zhǔn)，隨便瀏覽一個(gè)站點(diǎn)，它們一定是用表格布局的。表格布局的優(yōu)勢(shì)在于它能對(duì)不同對(duì)象加以處理，而又不用擔(dān)心不同對(duì)象之間的影響。而且表格在定位圖片和文本上比起用CSS更加方便。表格布局唯一的缺點(diǎn)是，當(dāng)你用了過多表格時(shí)，頁(yè)面下載速度受到影響。對(duì)于表格布局，你可以隨便找一個(gè)站點(diǎn)的首頁(yè)，然后保存為HTML文件，利用網(wǎng)頁(yè)編輯工具打開它(要所見即所得的軟件)，你會(huì)看到這個(gè)頁(yè)面是如何利用表格的。

更多相關(guān)資訊：