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

張莉

摘 要 在我國經濟飛速發展的今天，科學技術的發展日新月異。在我們的日常生活中，對網絡技術的運用更是滲透到了各個方面。人們通過互聯網進行交流、購物、工作以及學習。越來越廣泛的使用也對網頁自身有了更高的要求，更加精美的設計才是吸人眼球的第一步。因此，文章就網頁美工設計中對Photoshop的運用進行研究和分析，希望能為網頁美工設計提供一些有價值的參考。

關鍵詞 網頁美工設計；Photoshop；應用

中圖分類號 J913 文獻標識碼 A 文章編號 1674-6708（2016）162-0091-02

對網站訪問率造成影響的因素有很多種，但是網頁的設計也是關鍵的因素之一。現在的網站早已改變過去只注重單一功能性的缺點，對于網頁的美觀設計成為了未來網頁設計的重要發展方向。在以往的網站設計中最多使用的是Dreamweaver，但是其在進行美工設計時卻存在一定的缺陷。Photoshop的出現就為網頁設計師帶來了更加寬廣的空間。

1 網頁美工設計中Photoshop的應用表現

網頁設計的最主要目的就是能讓人們獲得最直觀的信息，而信息的獲取方式自然就是利用網頁的美工設計。這樣人們不僅能夠獲得自己想要的信息，還能從中體會到美的享受，而Photoshop，也就是Adobe Photoshop就是完成這一要求的重要平臺[ 1 ]。

1.1 完成更加合理的布局

從網頁設計師的角度來說，從拿到項目的那一刻就要開始思考應該進行怎樣的布局，是采用三欄布局好還是二欄布局好？自由式結構的效果更好還是普通框架結構更好？應該以圖片為主還是文字為主？這些也是設計的關鍵所在。使用Photoshop軟件就能讓設計師在不斷調整和確認工程中完成更好的設計思路。這種方式無疑要好過手繪草稿很多倍，因為這不僅更加的貼合實際還讓設計變得更加生動。如果是使用以往的Dreamweaver，就需要制作出實際的網頁，不僅會浪費很多時間，更不方便修改。在Photoshop軟件中的圖層功能就能將想要使用的不同元素進行靈活的擺放和轉換，各個圖層之間是具有很強獨立性的，當然如果想，也可以進行鏈接。圖層本身就具有可以修改的屬性。功能上的靈活性就能讓設計師在進行創作時不受任何束縛，然后根據各方面意見進行及時的調整和修改，最終完成一個成功的設計[2]。

1.2 讓元素可以更加細致

按照標準的網頁來說，其中所要設計的元素有很多，例如，最基本的導航條、圖標、標志、頁眉與頁腳等等，對于這些細碎的元素，在進行處理時會對整個頁面效果造成非常大的影響，不僅如此，元素的設計風格也會影響到頁面的主題，如果處理到位就會為頁面增色。反之，不僅會造成頁面的繁亂，更會影響頁面的整體布局。這時對于Photoshop軟件的運用就能為各種素材提供方便，這也是Photoshop軟件的強大之處，關于元素，可以制作成不同的質感和效果，進而讓網頁能夠有更加多樣的選擇，更能將設計師的創意想法進行相對完美的實現。

1.3 讓色彩更加豐富

在網頁的美工設計中，色彩搭配相當關鍵。而Photoshop軟件中對圖層的運用就能為網頁美工設計中的色彩搭配提供相當方便的路徑。首先是對元素的基本確定，然后就是進行各區域以及各圖層的單獨調整。這樣只要進行一個簡單的操作就能夠完成想要的顏色搭配，不僅如此，還能對顏色進行一個實時的分析，方便合理。更重要的是Photoshop軟件具有網頁安全色功能，這樣就夠在色板里挑選web安全顏色、web色相命令以及Web色譜，放入調色板中的任何一個顏色都會在不同操作系統、不同硬件環境以及不同瀏覽器中呈現最為正常的顏色，不論顏色有何不同，用戶在進行終端瀏覽時設備所呈現的效果沒有差別。

1.4 讓動畫變得更加精巧

網頁美工設計中，網頁的趣味性也可以依靠動畫來加以提升，以便能吸引更多訪問者的興趣。Photoshop軟件可以制作一些相對簡單的“幀動畫”這些都可以保存為GIF格式[ 3 ]。這種格式的實質就是將多幅圖片合并為一個圖像文件，進而形成一種動畫，這種格式的特點就是瀏覽器支持相對穩定以及較小的文件體積的優勢，目前在網絡上有非常廣泛的使用。

1.5 讓速率變的更快

網頁的美工設計如果不精美就無法吸引人們的眼球。而相應的，如果網站的打開速度過慢也會讓瀏覽者逐漸消失。目前我們正處于一個互聯網高速發展的時代，同種類型的網站也如雨后春筍，層出不窮。據相關調查就能夠看出，人們對網站的等待耐心不會超過十秒。造成網頁打開過慢的原因有很多，但是外在條件基本相同時，網頁元素的配置和優化以及網頁大小是影響速度的關鍵因素。而進行Photoshop軟件的應用就能夠將這些圖片進行一定的縮小。例如，可以進行圖片的減色處理，也就是在不影響圖片質量的前提下對圖片的顏色進行刪減。讓圖片體積更小，還可以進行大塊圖像的分塊，將大圖像切分成不同的小圖像，完成多圖的同時傳送，將網頁的下載速度加以提高。要注意的是，在運用Photoshop進行切片后，應將圖片的形式儲存為web形式，Dreamweaver也能完成對圖片的有效整合。對于切片的存儲格式可以用Gif，其占用的體積較小，如果有一定較高的要求，那圖片就可以存儲為JPEG格式，其能夠進行圖片更多的細節展示。如此進行過合理存儲之后，網頁就能夠被大大減小，進而也就將傳輸速率提高了上來。

2 在網頁美工設計中應用Photoshop的注意事項

對網頁的美工設計來說，對Photoshop軟件加以應用，不僅能創造出更好的頁面輪廓，更可以通過美工對Image Ready的運用來完成動畫效果的創建，當然也可以進行FrontPage、Dreamweaver的聯合設計，來幫助美工設計完成更好的頁面創作。但是在運用Photoshop進行網頁的美工設計時有一些基本問題是必須掌握的。例如，在網頁設計的初始階段，要注意網頁尺寸與分辨率的關系。通常來說網頁的文檔尺寸都會設為708×800像素，而分辨率則為72即可。進行設計時也不能忘記對分辨率的調整，要保證分辨率的適當。當然，對于參考線的運用也是非常重要的，網頁設計中如果能合理的使用參考線，那將會讓網頁有更加清晰明確的規劃與布局。在最初使用參考線時，將頁面進行一個按比例分割，主要內容一定要在分割點上，其目的就是吸引更多人的視線。不僅如此，Photoshop軟件還具有鏈接的優勢，適當的使用鏈接，給訪問者們展示更多的圖片以及信息，也是其他制作軟件所不能取代的優勢。

3 結論

綜上所述，在網頁的美工設計中對Photoshop進行應用是未來的發展趨勢。不管是網頁設計還是其他的設計，表達永遠是第一目的。只有能將本網站的內容與主題進行完整表達的網站界面才算的上是專業，因為設計者想要表達的內容都呈現在了眼前。精美并具有特色的網頁美工設計能為訪問者帶來非常好的體驗感受，第一觀感通常是成功的最關鍵部分，進入網站的瞬間就決定了潛在客戶的人群以及是否能獲取他們的信任。可見網站的美工設計是多么的重要，希望未來的網頁設計師們能夠通過對Photoshop的應用而完成一次又一次更好的設計。

參考文獻

[1]馬綏莉.基于藝術設計中Photoshop軟件的應用仿真研究[J].電子設計工程，2015（16）：56-58.

[2]古韻婷.有關網頁設計中Photoshop和Flash的應用探析[J].科技致富向導，2014（9）：242.

[3]李娜.高職Photoshop網頁美工課程教學方法改革及實踐應用探究[J].科教文匯旬刊，2014（13）：162.