第一篇：Photoshop在網頁美工設計中的應用研究

Photoshop在網頁美工設計中的應用研究

摘要：隨著互聯網上各類網站越來越多，人們在瀏覽網頁時除了基本的對信息量的需求外，對網站的界面設計也產生了新的要求，一個信息齊全、設計精美的網站更能吸引觀眾的目光。本文主要描述了強大的圖形圖像處理軟件Photoshop在網頁美工設計中的應用。

關鍵詞：Photoshop；網頁美工；應用

目前，全世界的網站總數已經超過了10億個，中國的網站總數接近400萬個，如何使自己的網站能夠在眾多的網站中脫穎而出，令人刮目相看，除了提升網站的知名度和訪問率外，對網站內容進行詳細的規劃和設計也是提高網站訪問率的重要因素?，F在眾多的網站已經由原來單一的功能性向現在的功能和美觀兼顧的方向發展。相同情況下，一個設計美觀的網站更能受到人們的青睞。以往設計網頁常用的軟件Dreamweaver在網頁的美工設計方面有一定的局限性，而Photoshop是網頁設計師常用的一個非常重要而強大的工具，可以讓網頁設計師的工作高效便捷的進行，也為設計師們的天馬行空提供了實際技術實現。

網頁設計的根本目的是通過網頁美工設計出作品為人們傳播直觀的信息，使人們獲得美感享受的同時獲得大量直觀的信息，充分表達用戶要求的內容，Photoshop為這種直觀的展現提供了很好的平臺。Photoshop在網頁美工設計中的應用主要表現在以下幾個方面：

一、更好的布局

作為一個網頁設計師開始一個項目時經常會考慮到網頁的布局，是用兩欄布局還是三欄布局？是采用普通框架結構還是采用自由式結構？是以文字為主還是以圖片為主？Photoshop軟件可以在網頁布局階段把設計師的構思更好的展現出來，這種展現比手繪草稿更形象生動貼近實際，比用Dreamweaver實際制作出來的網頁更節約時間便于修改。Photoshop的圖層功能每層可以放置不同的元素，圖層之間相互獨立又可相互鏈接，圖層屬性可以隨意修改。如此靈活的功能，完全可以讓設計者隨心所欲設計而不受任何約束，設計的同時可根據各方的意見隨時進行修改和調整，最終達到大家同時認同的標準。

二、更細致的元素

一個標準的網頁里面涉及到很多的元素，比如說頁眉、頁腳、標志、圖標、導航條等等，這些元素的處理直接關系到整個頁面的效果，而且元素的風格與頁面的主題有著很強的相關性。Photoshop強大的功能為制作這些元素提供了方便，可以制作各種效果和各種質感的元素，為網頁的最終效果提供了豐富的選擇，能完美的實現設計師各種想法創意。

三、更豐富的色彩

色彩的搭配也是網頁設計的一個重要因素，Photoshop的圖層功能也為網頁色彩的搭配提供了方便。在基本元素確定的情況下，可以單獨對各個圖層、各個區域的顏色進行單獨的調整，簡單的操作就可以搭配出需要的顏色，并可以實時對顏色進行比較分析，非常方便。而且Photoshop帶有的網頁安全色的功能，可以在色板中選擇web安全顏色、web色譜和web色相命令，載入該調板中的任何色彩在不同硬件環境、不同操作系統，不同瀏覽器中都能夠正常實現的色彩，這些顏色在任何終端瀏覽用戶的顯示設備上所呈現出的效果都是相同的。

四、更精巧的動畫

在網頁設計中，動畫可以增添網頁的趣味性，吸引觀眾的目光，Photoshop也可以制作簡單的“幀動畫”，存儲為GIF格式。GIF格式其實將多幅圖像保存為一個圖像文件，從而形成動畫，具有文件體積小、瀏覽器支持穩定的優點，是一種在網絡上非常流行的圖形文件格式。

五、更快的速率

一個不美觀的網頁是不能吸引觀眾的，但是一個打開速度慢的網站盡管做得再精美也會使觀眾流失。在互聯網高度發展的今天，同類型的網站層出不窮，人們一般在一個網站等待超過10秒就會失去耐心，雖然決定網頁打開速度的因素很多，但是在條件相同時，網頁大小及網頁元素的優化和配置就是唯一的因素。用Photoshop可以有多種方式縮小圖片體積，比如對圖像進行減色處理，在對圖片質量影響不大的基礎下減去圖片上的一些顏色，使圖像更為小巧，或是對大塊圖像進行分塊，大的圖像切分成均勻的小圖，這樣可以多幅圖像同時傳送，提高網頁下載速度。使用Photoshop的切片工具切片后，存儲時用“存儲為web所用格式”命令，Dreamweaver就能對效果圖進行有效的整合。切片存儲格式要求一般存為Gif格式，Gif占用體積小。要求較高的圖像存儲為JPEG格式，JPG格式顯示更多的圖片細節。這樣進行合理的存儲后，大大的縮小的網頁的大小，從而提高了傳輸的速率。

表達是所有設計的第一目的，一個專業的網站界面可以很好的表達網站本身的主題與內容，通過網站可以將你本身最想表達的東西體現出來。一個精美的網站設計界面，可以給訪問者以很好的體驗感受，往往第一印象的好壞就能獲得對方的信任，有可能這個訪問者就將成為你的客戶或潛在客戶。一個專業設計的網站就需要一個專業的軟件，Photoshop作為專業且應用最廣的圖形圖像處理軟件，能夠幫助網頁設計師更好更高效的完成設計。（作者單位：重慶城市管理職業學院）

參考文獻：

[1]徐琳.Photoshop圖像設計中的網頁色彩表現[J].文藝生活，2012（3）：87.[2]劉麗君，等.淺談Photoshop在網頁制作中的應用[J].科技廣場，2007（7）：212-213

第二篇：武漢網頁美工設計培訓

網頁美工設計專業班課程

武漢新思維，網頁美工設計專業班課程

網頁美工設計專業班

招生對象：在校大中專學生、在職轉行學員、初入門的設計愛好者

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

學習內容：

課程一：photoshop

學習目的及效果：

Photoshop是著名的圖像處理軟件，具有超強的特效制作功能和照片處理合成功能。是設計師必須掌握和精通的軟件。本課程采用案例式教學方法，通過對大量有針對性的教學案例，使學習者掌握Photoshop的圖像處理、圖像合成、圖像創意效果等技術。

課程二：網頁界面及網站美工設計

學習目的及效果：

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

本課程旨在提高學員的審美能力、讓學員能熟練操作PS軟件進行各類風格類型的靜態頁面設計。

課程三：Dreamweaver

課程四：Fireworks

課程五：Flash

課程六：網頁設計及綜合案例

第三篇：網頁美工設計制作崗位職責

1.負責網站整體版式設計。

2.負責網站各種活動推廣頁面設計工作。

3.熟練運用各種不同類型的設計表現形式，準確傳達信息。

4.本著以用戶為核心的設計理念，對頁面進行優化，使用戶操作更趨于人性化。

第四篇：網頁美工設計色彩搭配原則

網頁美工設計色彩搭配原則

網頁設計中：網頁美工設計色彩搭配原則

網頁美工設計中，最常用的幾個顏色為藍色、綠色、橙色，以及暗紅色。

藍色多與白、橙搭配，藍為主調。白底，藍標題欄，橙色按鈕或ICON做點綴;藍天白云，沉靜整潔的感覺。

綠色多與白、蘭兩色搭配，綠為主調。白底，綠標題欄，蘭色或橙色按鈕或ICON做點綴，綠白相間，雅致而有生氣。

橙色多與白、紅搭配，橙為主調。白底，橙標題欄，暗紅或桔紅色按鈕或ICON做點綴，橙色活潑熱情，標準的商業色調，因此多用于商業網站的網頁美工設計。

暗紅色顯得寧重、嚴肅、高貴，需要配黑和灰來壓制刺激的紅色，常以暗紅為主調。黑或灰底，暗紅標題欄，文字內容背景為淺灰色。

網頁美工設計色彩忌諱

盡管三原色的相互搭配創造出了無數顏色，可不是所有的顏色都適用于網頁美工設計，不同的顏色在搭配上也有著其中的學問，網頁設計就相當于平面設計，網頁設計師可以將平面設計中的審美觀點套用到這上面來，所以平面設計上的審美的觀點在網頁設計上非常實用。

在網頁美工設計中對于色彩的使用特別忌諱臟、純、跳、花、粉這幾種情形。

忌臟是指背景與文字內容對比不強烈，灰暗的背景令人沮喪!

忌純是指艷麗的純色對人的刺激太強烈抗議，缺乏內涵。

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

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

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

另外，藍色忌純，綠色忌黃，紅色忌艷。

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

第五篇：網頁美工設計需要注意的三大細節

網頁美工設計需要注意的三大細節 細節決定成敗，可用于每一件事，每一個工作，對于細致的網頁美工來說更是需要注意了，下面為大家美工新手們介紹幾種需要注意的細節。

1、精確到1個像素

如果你是一個成功的頁面設計者，你至少會在做出頁面前已經把整個頁面構思好了;如果你很寬容地對待圖片中1個像素的差別，那說明你還不是很合格。

2、色彩的平衡與呼應。1)色彩的平衡。色彩在頁面中可以形成很多的效果，通過強烈的對比，可以突出頁面的重點。還可以通過色彩調配，達到頁面穩重度的改變。一般的情況下，頁面上方的顏色總是很重，這樣才能壓住下面的顏色，如果不采取這種辦法，整個頁面將顯得很不穩重，底下的文字圖片，有飄出的意味。因此，要使整個頁面顯得很平衡，必須要有能鎮住其他顏色的色彩。

2)色彩的呼應。一種比較突出的色彩，如果很突兀地放在頁面中，無論你是突出重點也好，還是logo圖標，都給整個頁面帶來了副作用。為此，你必須在相對稱的位置加上該色系(對于頁面并不醒目)的色彩以呼應，這樣可以弱化這種視覺的沖擊。

3、注意頁面的分塊，著手設計一個頁面的時候，你必須根據所掌握的內容，以及其風格，對頁面的整體進行分塊。分塊是一個非常必要且難以掌握的技巧。對于一般雜志來說，它們是有邊的，這意味著雜志美工設計師有邊可循，依靠邊來形成立體感，依靠邊來產生未盡的意韻;但是對于web頁面，邊的概念被淡化了，屏幕可以上下左右的拖動。所以此時分塊顯得非常必要，目的也就是產生邊的效果。

分塊可以用不同著色的色塊、框、細線、排列整齊的英文等等，還可以混合使用，但是注意不要過于醒目，因為頁面的重點在內容，而不在其他。

1.ps圖像處理的功底要好，這樣才能夠吸引人的眼球。

2.要有審美觀點，網頁不是平面，頁面里的元素比較多。

3.需要細心，對做出來的東西近可能的細。

4.多參考一些精品網站，學習了解他們的經驗，你會收獲很大。

5.很重要的一點，就是網站的布局一定要合理，一個布局合理的網站是成功的一大半。

6.多交流多溝通，可將自己設計好的網站給朋友們來欣賞，讓他們提提建議，說不定會有好的建議，但自己一定要有主見。