第一篇：網(wǎng)頁美工設(shè)計(jì)色彩搭配原則

網(wǎng)頁美工設(shè)計(jì)色彩搭配原則

網(wǎng)頁設(shè)計(jì)中：網(wǎng)頁美工設(shè)計(jì)色彩搭配原則

網(wǎng)頁美工設(shè)計(jì)中，最常用的幾個(gè)顏色為藍(lán)色、綠色、橙色，以及暗紅色。

藍(lán)色多與白、橙搭配，藍(lán)為主調(diào)。白底，藍(lán)標(biāo)題欄，橙色按鈕或ICON做點(diǎn)綴;藍(lán)天白云，沉靜整潔的感覺。

綠色多與白、蘭兩色搭配，綠為主調(diào)。白底，綠標(biāo)題欄，蘭色或橙色按鈕或ICON做點(diǎn)綴，綠白相間，雅致而有生氣。

橙色多與白、紅搭配，橙為主調(diào)。白底，橙標(biāo)題欄，暗紅或桔紅色按鈕或ICON做點(diǎn)綴，橙色活潑熱情，標(biāo)準(zhǔn)的商業(yè)色調(diào)，因此多用于商業(yè)網(wǎng)站的網(wǎng)頁美工設(shè)計(jì)。

暗紅色顯得寧重、嚴(yán)肅、高貴，需要配黑和灰來壓制刺激的紅色，常以暗紅為主調(diào)。黑或灰底，暗紅標(biāo)題欄，文字內(nèi)容背景為淺灰色。

網(wǎng)頁美工設(shè)計(jì)色彩忌諱

盡管三原色的相互搭配創(chuàng)造出了無數(shù)顏色，可不是所有的顏色都適用于網(wǎng)頁美工設(shè)計(jì)，不同的顏色在搭配上也有著其中的學(xué)問，網(wǎng)頁設(shè)計(jì)就相當(dāng)于平面設(shè)計(jì)，網(wǎng)頁設(shè)計(jì)師可以將平面設(shè)計(jì)中的審美觀點(diǎn)套用到這上面來，所以平面設(shè)計(jì)上的審美的觀點(diǎn)在網(wǎng)頁設(shè)計(jì)上非常實(shí)用。

在網(wǎng)頁美工設(shè)計(jì)中對(duì)于色彩的使用特別忌諱臟、純、跳、花、粉這幾種情形。

忌臟是指背景與文字內(nèi)容對(duì)比不強(qiáng)烈，灰暗的背景令人沮喪!

忌純是指艷麗的純色對(duì)人的刺激太強(qiáng)烈抗議，缺乏內(nèi)涵。

忌跳是指再好看的顏色，也不能脫離整體。

忌花是指要有一種主色貫穿其中，主色并不是面積最大的顏色，而是最重要，最能揭示和反映主題的顏色，就象領(lǐng)導(dǎo)者一樣，雖然在人數(shù)上居少數(shù)，但起決定作用。

忌粉是指顏色淺固然顯的干凈，但如果對(duì)比過弱，顯得蒼白無力了，就象病夫一樣無可救藥。

另外，藍(lán)色忌純，綠色忌黃，紅色忌艷。

一位網(wǎng)頁美工設(shè)計(jì)的前輩說過：設(shè)計(jì)師不要“為設(shè)計(jì)而設(shè)計(jì)”。再炫酷的頁面效果、再豐富的表現(xiàn)形式，如果偏離了以用戶為中心的主線，讓用戶抓不住重點(diǎn)，感悟不到網(wǎng)頁本身所需要體現(xiàn)的信息，那么，再好的畫面呈現(xiàn)也是敗筆。

第二篇：網(wǎng)頁制作色彩搭配總結(jié)資料

通過上次會(huì)議內(nèi)容，我經(jīng)過多方面的學(xué)習(xí)與總結(jié)，結(jié)合我們公司目前的現(xiàn)狀，為提高網(wǎng)站的吸引力，我查閱了一些相關(guān)文章以及案例，為我們公司網(wǎng)頁宣傳提供一些建議，同時(shí)也加強(qiáng)自己的專業(yè)知識(shí)水平。

網(wǎng)絡(luò)發(fā)展得太快，網(wǎng)站設(shè)計(jì)跟不上時(shí)代的發(fā)展，互聯(lián)網(wǎng)上很大一部分企業(yè)網(wǎng)站缺乏設(shè)計(jì)思想，沒有個(gè)性，并沒有體現(xiàn)企業(yè)文化。頗具設(shè)計(jì)思想、富于企業(yè)文化信息、令人流連忘返、過目難忘、能夠起到營銷作用的的網(wǎng)站讓人垂涎。

隨著網(wǎng)絡(luò)的發(fā)展，網(wǎng)站設(shè)計(jì)人員的鑒賞力也越來越高，對(duì)于網(wǎng)站的設(shè)計(jì)也越來越在意，我們的網(wǎng)站應(yīng)該不僅僅是信息的簡單羅列，否則就會(huì)很容易被淹沒在浩如煙海的互聯(lián)網(wǎng)之中。我們隨便在一個(gè)搜索引擎上查找某一行業(yè)的企業(yè)網(wǎng)站，我們都會(huì)找到成千上萬條信息，試想，在這么多的網(wǎng)站中，沒有自己企業(yè)特色、平庸無奇的網(wǎng)站是不會(huì)令人趕興趣的，更不用說進(jìn)入詳細(xì)瀏覽了，我們知道，好的衣服能提高一個(gè)人的身價(jià)，好的網(wǎng)站也會(huì)提高一個(gè)企業(yè)的形象，一個(gè)好的網(wǎng)站在結(jié)構(gòu)，導(dǎo)航，用色，內(nèi)容等各個(gè)方面都是很講究的，她可能很簡單，但卻給人一種吸引力，讓瀏覽者觀賞的同時(shí)了解了企業(yè)信息。

1.精心設(shè)計(jì)網(wǎng)頁，沖擊訪問者的眼球

網(wǎng)頁設(shè)計(jì)和網(wǎng)絡(luò)的發(fā)展是建立一個(gè)網(wǎng)站的步驟之一。用在您的網(wǎng)站的設(shè)計(jì)可以決定您網(wǎng)站的可用性。這就是為什么一些業(yè)務(wù)流程外包公司提供網(wǎng)頁設(shè)計(jì)和網(wǎng)站開發(fā)服務(wù)。您的網(wǎng)站的設(shè)計(jì)應(yīng)該考慮你的網(wǎng)站的訪問者，盡可能的增加網(wǎng)頁的美感，配合網(wǎng)頁的內(nèi)容，讓訪問者流連忘返，這應(yīng)該是一個(gè)網(wǎng)站設(shè)計(jì)者最核心的工作。

（一）選擇合適的背景圖案

對(duì)于一個(gè)網(wǎng)站，要爭取給訪問者留下美好的第一印象。而精美的背景圖片便是第一印象的核心元素。而國內(nèi)的網(wǎng)站往往交傳統(tǒng)，死板，缺乏新意和美感，僅僅靠內(nèi)容吸引顧客。但殊不知，一個(gè)好的網(wǎng)站有一個(gè)好的外表應(yīng)該是基本要求，正如人要穿著得體一樣。而訪問者進(jìn)入一個(gè)網(wǎng)站的第一印象便是背景，因此，選擇一個(gè)好的背景應(yīng)該是網(wǎng)站設(shè)計(jì)的第一步。

（二）合理搭配網(wǎng)站的顏色

研究人員發(fā)現(xiàn)，顏色將是一個(gè)很久以前的人類精神的巨大影響，通過不同的配色方案的網(wǎng)站，可以觀察用戶是否獲得吸引力，尤其是新用戶或在用戶離開網(wǎng)站。而更重要的是，該網(wǎng)站往往是潛意識(shí)的顏色效果。按顏色可讓使用者產(chǎn)生煩躁，幸福，快樂，苦悶等情緒。

因此，如何能通過網(wǎng)站的配色方案使網(wǎng)站更具魄力，下面是我收索尋找的一些顏色的建議：

1、使網(wǎng)絡(luò)安全的顏色使用，即色彩，在自然界存在的，而不是非天然彩色顯示屏的合成。

2、網(wǎng)頁背景顏色和文字的對(duì)比，背景顏色為白色一般煊往往選擇的字體，當(dāng)然，不是絕對(duì)的，如深藍(lán)色，灰色，是常用的網(wǎng)頁字體的顏色。

3、避免藍(lán)色和紅色，藍(lán)色和黃色，綠色/藍(lán)色和紅色的在同一時(shí)間拋出了這些類別的色彩。由于這是很容易讓人們感到視覺疲勞

4、使用的顏色總是有團(tuán)結(jié)，研究表明，5種顏色是網(wǎng)站的限制，一般不超過5種顏色。

5、盡量減少小字體或藍(lán)色形式的使用。

6、色彩有些本身就是很無聊，喜歡灰色的，但與橙色或鮮艷的色彩會(huì)產(chǎn)生一些完全不同的感覺，你可以嘗試下一個(gè)。

7、可以使用空格來平衡刺激色彩的網(wǎng)站

8、始終保持相同的顏色，這是一個(gè)網(wǎng)站的可讀性的重要方面。

2.網(wǎng)頁配色方案的選擇和色彩使用技巧

要說色彩的運(yùn)用，還是先談?wù)労诎谆疑实膽?yīng)用吧，因?yàn)楹诎谆疑适侨f能色，可以跟任意一種色彩搭配。當(dāng)你為某種色彩的搭配苦惱的時(shí)候，不防試試用黑白灰。當(dāng)你覺得兩種色彩的搭配不協(xié)調(diào)，試試加入黑色，或者灰色，或許會(huì)有意想不到的效果哦。

對(duì)一些明度較高的網(wǎng)站，配以黑色，可以適當(dāng)?shù)亟档推涿鞫取０咨蔷W(wǎng)站用的最普遍的一種顏色。很多網(wǎng)站甚至留出大塊的白色空間，作為網(wǎng)站的一個(gè)組成部分。這就是留白藝術(shù)。很多設(shè)計(jì)性網(wǎng)站較多運(yùn)用留白藝術(shù)。留白，給人一個(gè)遐想的空間，恰當(dāng)?shù)牧舭讓?duì)于協(xié)調(diào)頁面的均衡起到相當(dāng)大的作用。

確定網(wǎng)站的主題色，一個(gè)網(wǎng)站不可能單一的運(yùn)用一種顏色，讓人感覺單調(diào)，乏味；但是也不可能將所有的顏色都運(yùn)用到網(wǎng)站中，讓人感覺輕浮，花哨。一個(gè)網(wǎng)站必須有一種或兩種主題色，不至于讓客戶迷失方向，也不到于單調(diào)，乏味。所以確定網(wǎng)站的主題色也是設(shè)計(jì)者必須考慮的問題之一。

一個(gè)頁面盡量不要超過4種色彩，用太多的色彩讓人沒有方向，沒有側(cè)重。當(dāng)主題色確定好以后，考慮其它配色時(shí)，一定要考慮其它配色與主題色的關(guān)系，要體現(xiàn)什么樣的效果。另外哪種因素占主要地位，是明度，純度還是色相。避免只有藍(lán)色產(chǎn)生冷冷清清的感覺，整體顯得很整潔很和諧，和諧就是恰到好處。

3.網(wǎng)站風(fēng)格的確立

一個(gè)人擁有自己獨(dú)特的風(fēng)格是一般人所沒有的，這個(gè)叫做個(gè)性，如果有特殊的需要，甚至可以變成另類，呵呵，總之就是會(huì)讓人注意到那種特別，若那個(gè)人的個(gè)性風(fēng)格是正面的積極的，甚至?xí)饎e人的羨慕與注意或是贊賞。就如同一個(gè)網(wǎng)站，擁有別的網(wǎng)站所沒有的風(fēng)格，就會(huì)讓瀏覽者愿意多停留些時(shí)間，細(xì)細(xì)品嘗該站的內(nèi)容，甚至該站會(huì)得到多人的鼓勵(lì)與注目，粗略的說，網(wǎng)站風(fēng)格可以從以下幾個(gè)方向來探討，而每一項(xiàng)都是有關(guān)聯(lián)性的：

1、色系：網(wǎng)頁的底色、文字字型、圖片的色系、顏色等等，更詳細(xì)的色板可參考網(wǎng)頁配色方案的選擇和色彩使用技巧。

2、排版：表格、框架的應(yīng)用、文字縮排、段落等等，特別要注意錯(cuò)別字。

3、窗口：窗口效果，例如：全屏幕窗口、特效窗口等。

4、程序：網(wǎng)頁互動(dòng)程序，例如：ASP.PHP.XML.CGI等等。

5、特效：讓網(wǎng)頁看起來靈動(dòng)活潑的各種應(yīng)用，如：Flash.Java script.Java applets.DHTML等等。

6、架構(gòu)：目錄規(guī)劃、層次淺顯易懂、選單應(yīng)用等等原則就是適于瀏覽和閱讀。

7、內(nèi)容：網(wǎng)站主題、整體實(shí)用性、文件關(guān)聯(lián)性、內(nèi)容切合度、是否有不必要的或不相關(guān)的檔案等等。

8、走向：對(duì)于網(wǎng)站的未來規(guī)劃、網(wǎng)站整體內(nèi)容走向等。

以上這些是我通過網(wǎng)絡(luò)、書籍整理了這些資料。

附：Google官方的網(wǎng)頁設(shè)計(jì)建議

Google官方對(duì)于此問題的闡述原文如下：

Make a site with a clear hierarchy and text links.Every page should be reachable from at least one static text link.Offer a site map to your users with links that point to the important parts of your site.If the site map is larger than 100 or so links, you may want to break the site map into separate pages.Create a useful, information-rich site and write pages that clearly and accurately describe your content.Think about the words users would type to find your pages, and make sure that your site actually includes those words within it.Try to use text instead of images to display important names, content, or links.The Google crawler doesn't recognize text contained in images.Make sure that your TITLE and ALT tags are descriptive and accurate.Check for broken links and correct HTML.If you decide to use dynamic pages(i.e., the URL contains a '?' character), be aware that not every search engine spider crawls dynamic pages as well as static pages.It helps to keep the parameters short and the number of them small.Keep the links on a given page to a reasonable number(fewer than 100).翻譯過來就是：

使網(wǎng)站有清晰的結(jié)構(gòu)和文本鏈接，每一個(gè)頁面至少要有一個(gè)靜態(tài)文本鏈接入口。

為用戶提供一個(gè)站點(diǎn)地圖：轉(zhuǎn)向網(wǎng)站的重要部分。如果站點(diǎn)地圖頁面超過100個(gè)鏈接，則需要將頁面分成多個(gè)頁面。

創(chuàng)建有用的，信息量豐富的站點(diǎn)，清晰并正確的描述你的信息。

想像用戶可能用來找到你的關(guān)鍵詞，并保證這些關(guān)鍵詞在網(wǎng)站中出現(xiàn)。

盡可能使用文本，而不是圖片顯示重要的名稱，內(nèi)容和鏈接。GOOGLE的機(jī)器人不能識(shí)別圖片中的文字。

保證頁面的TITLE和ALT標(biāo)記正確的精確描述

檢查死鏈接并修正這些HTML錯(cuò)誤。

如果你打算使用動(dòng)態(tài)頁面，鏈接中包含“?”，必須了解：并非所有的搜索引擎的機(jī)器人能象對(duì)待靜態(tài)頁面一樣對(duì)待動(dòng)態(tài)頁面，保持動(dòng)態(tài)頁面的參數(shù)盡可能的少會(huì)很有幫助。

保持一個(gè)頁面中的鏈接數(shù)少于100個(gè)。

第三篇：武漢網(wǎng)頁美工設(shè)計(jì)培訓(xùn)

網(wǎng)頁美工設(shè)計(jì)專業(yè)班課程

武漢新思維，網(wǎng)頁美工設(shè)計(jì)專業(yè)班課程

網(wǎng)頁美工設(shè)計(jì)專業(yè)班

招生對(duì)象：在校大中專學(xué)生、在職轉(zhuǎn)行學(xué)員、初入門的設(shè)計(jì)愛好者

上課形式：周一到周六每天三小時(shí)，分上午班或下午班

學(xué)習(xí)內(nèi)容：

課程一：photoshop

學(xué)習(xí)目的及效果：

Photoshop是著名的圖像處理軟件，具有超強(qiáng)的特效制作功能和照片處理合成功能。是設(shè)計(jì)師必須掌握和精通的軟件。本課程采用案例式教學(xué)方法，通過對(duì)大量有針對(duì)性的教學(xué)案例，使學(xué)習(xí)者掌握Photoshop的圖像處理、圖像合成、圖像創(chuàng)意效果等技術(shù)。

課程二：網(wǎng)頁界面及網(wǎng)站美工設(shè)計(jì)

學(xué)習(xí)目的及效果：

網(wǎng)頁美工及界面設(shè)計(jì)，是指網(wǎng)頁設(shè)計(jì)者根據(jù)網(wǎng)頁所要表達(dá)的主題，將大量信息通過歸納、整理、美化設(shè)計(jì)，使頁面視覺漂亮、網(wǎng)頁信息有條理，從而提高網(wǎng)頁的閱讀效率和信息搜索率。網(wǎng)頁設(shè)計(jì)者不僅要掌握基本的網(wǎng)頁制作技術(shù)，還需要掌握網(wǎng)站的風(fēng)格、配色等網(wǎng)頁美術(shù)設(shè)計(jì)原理，依照項(xiàng)目設(shè)計(jì)的目的和需求，自覺地對(duì)網(wǎng)頁的構(gòu)成元素進(jìn)行藝術(shù)構(gòu)思，是一種創(chuàng)造性思維活動(dòng)，以創(chuàng)造出藝術(shù)化、人性化的網(wǎng)站頁面為目的。

本課程旨在提高學(xué)員的審美能力、讓學(xué)員能熟練操作PS軟件進(jìn)行各類風(fēng)格類型的靜態(tài)頁面設(shè)計(jì)。

課程三：Dreamweaver

課程四：Fireworks

課程五：Flash

課程六：網(wǎng)頁設(shè)計(jì)及綜合案例

第四篇：網(wǎng)頁美工設(shè)計(jì)制作崗位職責(zé)

1.負(fù)責(zé)網(wǎng)站整體版式設(shè)計(jì)。

2.負(fù)責(zé)網(wǎng)站各種活動(dòng)推廣頁面設(shè)計(jì)工作。

3.熟練運(yùn)用各種不同類型的設(shè)計(jì)表現(xiàn)形式，準(zhǔn)確傳達(dá)信息。

4.本著以用戶為核心的設(shè)計(jì)理念，對(duì)頁面進(jìn)行優(yōu)化，使用戶操作更趨于人性化。

第五篇：【網(wǎng)頁設(shè)計(jì)-最新經(jīng)典技術(shù)文檔】網(wǎng)站設(shè)計(jì)風(fēng)格和色彩搭配經(jīng)驗(yàn)談

【網(wǎng)頁設(shè)計(jì)-最新經(jīng)典技術(shù)文檔】網(wǎng)站設(shè)計(jì)風(fēng)格和色彩搭配經(jīng)驗(yàn)談.txt懂得放手的人找到輕松，懂得遺忘的人找到自由，懂得關(guān)懷的人找到幸福！女人的聰明在于能欣賞男人的聰明。生活是燈，工作是油，若要燈亮，就要加油！相愛時(shí)，飛到天邊都覺得踏實(shí)，因?yàn)橛心愕臓繏欤环质趾螅诩依锒加X得失重，因?yàn)闆]有了方向。在一般人眼中，“網(wǎng)站”幾乎就代表著“互聯(lián)網(wǎng)”。網(wǎng)站本身的價(jià)值正在被人們不斷的發(fā)現(xiàn)，不斷的認(rèn)可。“如何設(shè)計(jì)一個(gè)成功的網(wǎng)站？”已成為越來越多的網(wǎng)頁設(shè)計(jì)師所思考、關(guān)注的問題。本人從事商業(yè)網(wǎng)站建設(shè)已經(jīng)有兩年以上的經(jīng)驗(yàn)，在此只想拋磚引玉，提出自己的一些想法，歡迎高手指點(diǎn)！設(shè)計(jì)網(wǎng)站需要考慮的因素非常之多，從前期網(wǎng)站開始時(shí)的定位、設(shè)定網(wǎng)站框架、整理資料，到具體制作中的設(shè)計(jì)環(huán)節(jié)，再到最后的調(diào)試、發(fā)布、宣傳。這是一個(gè)環(huán)環(huán)相扣的過程。在此我們僅僅從設(shè)計(jì)師的角度來整體把握我們這次想討論的主題——如何設(shè)計(jì)成功的網(wǎng)站！由于篇幅有限，我們僅僅討論設(shè)計(jì)網(wǎng)站時(shí)重要的兩大部分：整體風(fēng)格和色彩搭配。

一、確定網(wǎng)站的整體風(fēng)格

網(wǎng)站的整體風(fēng)格及其創(chuàng)意設(shè)計(jì)是最難以學(xué)習(xí)的。難就難在沒有一個(gè)固定的模式可以參照和模仿。給你一個(gè)主題，任何兩人都不可能設(shè)計(jì)出完全一樣的網(wǎng)站。

風(fēng)格(style)是抽象的。是指站點(diǎn)的整體形象給瀏覽者的綜合感受。這個(gè)“整體形象”包括站點(diǎn)的CI（標(biāo)志、色彩、字體、標(biāo)語）、版面布局、瀏覽方式、交互性、文字、語氣、內(nèi)容價(jià)值、存在意義、站點(diǎn)榮譽(yù)等等諸多因素。舉個(gè)例子：我們覺得網(wǎng)易是平易近人的，迪斯尼是生動(dòng)活潑的，IBM是專業(yè)嚴(yán)肅的。這些都是網(wǎng)站給人們留下的不同感受。在這里，我提供給大家一些參考經(jīng)驗(yàn)：

1．將你的標(biāo)志logo，盡可能的放在每個(gè)頁面上最突出的位置。

2．突出你的標(biāo)準(zhǔn)色彩。

3．總結(jié)一句能反映貴站精髓的宣傳標(biāo)語！

4．相同類型的圖像采用相同效果，比如說標(biāo)題字都采用陰影效果，那么在網(wǎng)站中出現(xiàn)的所有標(biāo)題字的陰影效果的設(shè)置應(yīng)該是完全一致的！

二、網(wǎng)頁色彩的搭配

無論是平面設(shè)計(jì)，還是網(wǎng)頁設(shè)計(jì)，色彩永遠(yuǎn)是最重要的一環(huán)。當(dāng)我們距離顯示屏較遠(yuǎn)的時(shí)候，我們看到的不是優(yōu)美的版式或者是美麗的圖片，而是網(wǎng)頁的色彩。

關(guān)于色彩的原理有許多，在此我們不可能一一闡述，大家可以看看相關(guān)設(shè)計(jì)書籍，有利于系統(tǒng)地理解。在此我們僅僅想告訴大家一些網(wǎng)頁配色時(shí)的小技巧。

1．用一種色彩。這里是指先選定一種色彩，然后調(diào)整透明度或者飽和度，產(chǎn)生新的色彩，用于網(wǎng)頁。這樣的頁面看起來色彩統(tǒng)一，有層次感。

2．用兩種色彩。先選定一種色彩，然后選擇它的對(duì)比色。

3．用一個(gè)色系。簡單的說就是用一個(gè)感覺的色彩，例如淡藍(lán)，淡黃，淡綠；或者土黃，土灰，土藍(lán)。

在網(wǎng)頁配色中，還要切記一些誤區(qū)：

1．不要將所有顏色都用到，盡量控制在三種色彩以內(nèi)。

2．背景和前文的對(duì)比盡量要大，(絕對(duì)不要用花紋繁復(fù)的ＱＱ291911320圖案作背景)，以便突出主要文字內(nèi)容。