Photoshop在網(wǎng)頁設(shè)計(jì)中的技巧及應(yīng)用策略分析

?；矍?（陸軍步兵學(xué)院石家莊校區(qū) 050000）

隨著時(shí)代不斷進(jìn)步與發(fā)展以及互聯(lián)網(wǎng)的不斷普及，制作一個(gè)網(wǎng)站不再像以前那樣屬于少數(shù)人所掌握的技巧，對于大眾來說，越來越多的開始去制作一個(gè)屬于自己的網(wǎng)站。可是要做出一個(gè)能吸引人的好的網(wǎng)站往往是不容易的，這就需要有很好的網(wǎng)頁主題，以及精美的頁面布局，相應(yīng)的文字圖片視覺排版，這些是一個(gè)好的網(wǎng)站所要具有的東西，除此之外還需要好的網(wǎng)站創(chuàng)意、同時(shí)要有個(gè)性化的設(shè)計(jì)在里面還要能夠吸引瀏覽者的目光，是否能夠做到以上幾點(diǎn)一直是網(wǎng)頁設(shè)計(jì)中的難點(diǎn)問題。我將結(jié)合我多年的網(wǎng)站設(shè)計(jì)經(jīng)驗(yàn)，同時(shí)也利用Photoshop這一強(qiáng)大的圖片處理軟件對這一個(gè)問題進(jìn)行分享與交流，希望可以幫助大家在網(wǎng)頁設(shè)計(jì)的過程中能夠設(shè)計(jì)出來吸引瀏覽者目光且具有個(gè)性的網(wǎng)頁。下面我將通過Photoshop軟件來介紹一下網(wǎng)頁設(shè)計(jì)中的一些技巧和使用的方法。

一、網(wǎng)頁構(gòu)圖與圖像處理

方向式構(gòu)圖、曲線式構(gòu)圖以及其他方式構(gòu)圖這三種構(gòu)圖方式是一個(gè)網(wǎng)站布局的主要的構(gòu)圖形式。如果你要設(shè)計(jì)一個(gè)網(wǎng)站是關(guān)于汽車的維修、旅游經(jīng)驗(yàn)的分享、一些電子科技的應(yīng)用等等相關(guān)的方面的話你就應(yīng)該選擇方向式的構(gòu)圖模式作為你網(wǎng)頁的模式，在這個(gè)布局模式中你可以采取垂直、斜向以及氛圍水平的模式進(jìn)行相應(yīng)的排版。如果你想增加整個(gè)網(wǎng)站的層次感的話你就要選區(qū)水平類型的框架，這樣所設(shè)計(jì)出來的網(wǎng)站會(huì)明顯的具有一定的層次感，整個(gè)頁面的布局也會(huì)顯得簡潔明亮，可以最大限度的讓讀者獲得更多的知識。對于垂直框架來說，它與水平框架所不同的地方就是他所采用的是上下的結(jié)構(gòu)，這樣的布局方式對于讀者來說具有更多的可操作性，同時(shí)整個(gè)網(wǎng)頁也可以承載更多的內(nèi)容與信息，同時(shí)也方便的讀者進(jìn)行相關(guān)信息的查閱。對于曲線式的布局來說，對于這種類型的布局主要是運(yùn)用在交友、教育等等相關(guān)的網(wǎng)站布局方面，通過采用這種方式的布局可以使整個(gè)網(wǎng)站更加具有浪漫主義色彩，同時(shí)通過柔和的色調(diào)搭配可以讓讀者具有一定的溫馨的感覺。對于整個(gè)頁面的規(guī)格來說，曲線布局并沒有什么嚴(yán)格的規(guī)定，這就讓設(shè)計(jì)者在設(shè)計(jì)的過程中可以最大限度的發(fā)揮自己的想象力，從而讓整個(gè)頁面的布局具有自己的個(gè)性，進(jìn)而可以吸引更多讀者的眼球。

在一個(gè)網(wǎng)站的設(shè)計(jì)中要能最大限度的給人視覺的沖擊就需要大量的運(yùn)用到精美的圖片，如果我們直接將我們拍攝或者網(wǎng)上所尋找的照片插入的網(wǎng)頁中是很難有視覺沖擊的效果，這就需要我們利用Photoshop軟件對圖片進(jìn)行一定的處理，從而讓應(yīng)用到網(wǎng)頁當(dāng)中的主題更加具有視覺的沖擊。對于Photoshop軟件的使用，首先我們要打開Photoshop軟件，然后新建一個(gè)工作區(qū)，將自己所要需要的圖片拖入到工作區(qū)當(dāng)中，在工具欄中選擇相應(yīng)的工具對圖片進(jìn)行一定的截取，如果要精確的處理圖片的比例大小，就需要進(jìn)行“樣式”的選擇對圖片進(jìn)行比例的調(diào)節(jié)，通過“固定大小”從而可以對于一個(gè)圖片的比例進(jìn)行調(diào)節(jié)，從而調(diào)出自己所要需要的比例。然后再通過“菜單-文件-拷貝”可以將圖片進(jìn)行復(fù)制這一個(gè)環(huán)節(jié)，然后再通過“菜單-文件-新建”可以對于這個(gè)畫布進(jìn)行重新的布局與處理，然后在點(diǎn)擊“菜單-文件-粘貼”就可以把剛剛所復(fù)制的圖片粘貼到這一個(gè)畫布上面了，讓后通過保存將圖片進(jìn)行相應(yīng)的保存。

二、Photoshop處理圖像背景

在一個(gè)網(wǎng)頁設(shè)計(jì)的過程中最常用到的一個(gè)方式就是將一個(gè)圖片中的東西利用摳圖工具將其摳出來之后放置到另一個(gè)背景之中去，這就要求要對圖片的背景要進(jìn)行相應(yīng)的處理，要將背景圖片處理成為相應(yīng)透明的狀態(tài)，這種方式在網(wǎng)頁設(shè)計(jì)的過程中是會(huì)被經(jīng)常使用到的，通過這種方式可以讓兩張圖片更好的融合到一起中去。具體的操做過程是，首先打開Photoshop軟件，將所要處理的圖片拖選到畫布當(dāng)中去，然后利用工具欄中的圖形工具對于圖形進(jìn)行選擇，然后進(jìn)行相應(yīng)的保存，如果你所選取的圖片的背景過于單一的話，我們可以利用工具欄中魔法棒工具選擇背景顏色然后單擊“菜單-選擇-反向“，這要就可以選擇我們所要處理的背景區(qū)域了。然后通過復(fù)制的方式將這一個(gè)圖層進(jìn)行復(fù)制，在一個(gè)新的畫布里面講這一個(gè)圖層進(jìn)行粘貼，在圖片的背景內(nèi)容里面選擇”透明“再講圖片粘貼，這樣的話圖片的背景透明就做好了，接下來只需講圖片的比例進(jìn)行調(diào)整然后進(jìn)行相應(yīng)的保存就好了。

三、應(yīng)用Photoshop使圖像融合

在網(wǎng)頁設(shè)計(jì)的實(shí)際過程中不僅是需要將一個(gè)圖片融合到另一個(gè)背景當(dāng)中去，還需要將兩個(gè)或兩個(gè)以上圖形進(jìn)行很好的融合與拼接，從而形成一個(gè)具有整體層次感的圖片，這就需要利用Photoshop軟件進(jìn)行相應(yīng)的處理了，從而更好的提高圖片的整體效果。一兩個(gè)比較相同的圖片合成一個(gè)圖片為例，首先再Photoshop中新建一個(gè)畫布，將其中的一張圖片拖入到畫布當(dāng)中去進(jìn)行比例的調(diào)節(jié)，然后再將第二張圖片拖拽到Photoshop中去，將其放到適當(dāng)?shù)奈恢卯?dāng)中去。如果在調(diào)節(jié)的過程中我們發(fā)現(xiàn)這兩張圖片不能很好的協(xié)調(diào)，這就需要我們利用好軟件中的工具欄，將其進(jìn)行相應(yīng)的協(xié)調(diào)性的處理，確保兩個(gè)圖片可以很好的進(jìn)行相應(yīng)的融合，接著在第二個(gè)圖片上面選擇模板的構(gòu)建接著選擇漸變工具，然后對兩個(gè)圖片進(jìn)行拖拽，從而讓兩個(gè)圖片變成黑白漸變的形式，接著通過對于圖片透明度的調(diào)整讓兩個(gè)圖片更好的融合到一起，最后進(jìn)行相應(yīng)的圖片保存，兩個(gè)圖片的融合就做好了。

四、在Photoshop中特殊字體的設(shè)計(jì)

在網(wǎng)頁設(shè)計(jì)的整個(gè)過程中，通過多樣化的字體設(shè)計(jì)可以更好的吸引到別人的眼球，所以說一個(gè)好的字體設(shè)計(jì)可以給你的整個(gè)網(wǎng)頁的布局增分不少。字體的設(shè)計(jì)同樣的可以利用Photoshop進(jìn)行相關(guān)的處理，通過Photoshop所設(shè)計(jì)出來的字體可以讓整個(gè)網(wǎng)頁的質(zhì)量得到很好的提升。在日益發(fā)展的今天來說，人們對于很多的東西來說已經(jīng)產(chǎn)生了很嚴(yán)重的視覺疲勞，人們對與個(gè)性化的追求也是越來的越顯著，這就對于設(shè)計(jì)行業(yè)提出了更高的要求，要求在網(wǎng)站設(shè)計(jì)的過程中盡可能的使用個(gè)性化的字體來表達(dá)自己的內(nèi)涵，讓整個(gè)網(wǎng)站的設(shè)計(jì)看起來更加的新穎。然而在大多數(shù)的情況下我們的計(jì)算機(jī)中只有默認(rèn)的字體，相關(guān)比較藝術(shù)的字體是比較的少的，這就需要我們下載一些個(gè)性化的字體到我們的電腦當(dāng)中去，從而來滿足我們設(shè)計(jì)的需要。除此之外，我們也可以選擇一些好看的圖片作為我們文字的背景顏色，這就要利用到遮罩蒙版，從而讓整個(gè)文字更具特色。例如，對于一些計(jì)算中所沒有的字體我們現(xiàn)在網(wǎng)上下載下來然后安裝到我們的計(jì)算機(jī)當(dāng)中去，當(dāng)我們把這些字體下載下來的時(shí)候我么和是不能直接進(jìn)行使用的，我們要將這個(gè)文件復(fù)制粘貼到c盤中的window文件夾之下的Font文件夾之下，這樣的話我們就可以在Photoshop中進(jìn)行這一個(gè)文字的使用了，然后輸入一些字體，利用這個(gè)個(gè)性字體進(jìn)行相應(yīng)的設(shè)計(jì)與排版，從而讓整個(gè)網(wǎng)頁看起來更加的美觀。

五、Photoshop中進(jìn)行l(wèi)ogo的設(shè)計(jì)

Logo是一個(gè)網(wǎng)站的核心，通過一個(gè)網(wǎng)站的Logo我們可以清晰的明白這個(gè)的網(wǎng)站的主要內(nèi)容，同時(shí)也能夠?qū)τ谶@個(gè)網(wǎng)站留下深刻的影響。在一個(gè)網(wǎng)站中l(wèi)ogo更多的所傳遞出來的是這一個(gè)網(wǎng)站的主要內(nèi)涵以及相應(yīng)的理念，這也是一個(gè)網(wǎng)站設(shè)計(jì)師風(fēng)格的展現(xiàn)，從而可以更好的提高一個(gè)網(wǎng)站的整體質(zhì)量和水平，進(jìn)而提高網(wǎng)站的點(diǎn)擊量。對于logo的設(shè)計(jì)Photoshop軟件可以提供最基礎(chǔ)的技術(shù)的支撐，其中最核心的還是要設(shè)計(jì)師自己的靈感，通過多種簡單或者復(fù)雜的模型組合成一個(gè)具有寓意的圖案，從而來表達(dá)自己所設(shè)計(jì)網(wǎng)站的核心內(nèi)容，這一個(gè)過程對于一個(gè)設(shè)計(jì)師的核心素養(yǎng)一項(xiàng)很大的挑戰(zhàn)，需要設(shè)計(jì)師長期綜合素質(zhì)的積累才能達(dá)到這一個(gè)效果。

六、結(jié)語

總而言之，Photoshop軟件對于一個(gè)網(wǎng)頁頁面的設(shè)計(jì)是有很大的幫助的，它可以很好的提升網(wǎng)頁頁面設(shè)計(jì)的整體的水平，讓你的網(wǎng)頁整體的布局更加具有自己的特色，從而讓你的網(wǎng)站發(fā)展的更好。對于一個(gè)網(wǎng)頁的設(shè)計(jì)僅僅通過一個(gè)軟件是很難達(dá)到很好的效果的，其中核心的還是要設(shè)計(jì)師的綜合素養(yǎng)，提高自身的綜合素養(yǎng)可以讓Photoshop在網(wǎng)頁設(shè)計(jì)中得到更好的應(yīng)用。