葉志向

摘要：一個(gè)完整的網(wǎng)頁基本上都含有圖像，圖像在網(wǎng)頁中扮演著十分重要的角色。在網(wǎng)頁中合理地使用圖像，可以讓網(wǎng)頁更加具有吸引力，給訪問者以美的享受。本文著重介紹了圖像的類型、圖像的獲取、網(wǎng)頁中的圖像處理、網(wǎng)頁中的圖像使用原則。

關(guān)鍵詞：網(wǎng)頁設(shè)計(jì);圖像類型;圖像獲取;圖像處理;使用原則

一、圖像類型

網(wǎng)頁中用到的圖像類型有以下幾種：

1.JPEG：它是應(yīng)用廣泛的圖像壓縮格式，廣泛應(yīng)用于網(wǎng)頁中。

2.GIF：它既可以存儲(chǔ)靜態(tài)圖像，也可以存儲(chǔ)動(dòng)態(tài)圖像，廣泛應(yīng)用于網(wǎng)頁中。

3.PNG：它的特點(diǎn)是支持透明度，當(dāng)我們要在網(wǎng)頁中插入背景透明的圖像，就需要用到這種格式的圖像。

4.BMP：是“畫圖”程序的固定格式，文件幾乎不壓縮，占用磁盤空間大，所以在網(wǎng)頁中并不常用。

二、圖像獲取

獲取圖像的方法常見的有以下幾種：1.上網(wǎng)下載;2.用截圖軟件進(jìn)行截圖;3.用數(shù)碼相機(jī)、攝像機(jī)或者掃描儀等來獲取。需要注意的是：1.獲取的圖片尺寸要足夠大;2.要為獲取的圖像重命名（最好取一個(gè)見名知義的名字，名字可以為英文、數(shù)字或它們的組合）。

三、圖像處理

圖像處理的軟件有很多，在進(jìn)行網(wǎng)頁設(shè)計(jì)過程中，處理圖像我比較常用的軟件是Photoshop和Acdsee。下面著重講解如何使用這兩種軟件來進(jìn)行圖像處理。

（一）改變圖像尺寸或格式，提高網(wǎng)站顯示速度

每個(gè)網(wǎng)站含有的圖像通常是比較多的，如果每個(gè)圖像大小都可以縮小一些，那么就可以減少很多存儲(chǔ)空間，網(wǎng)站的顯示速度將大大提高，訪問者也會(huì)比較樂意訪問該網(wǎng)站。通過改變圖像尺寸或格式，可以有效減少圖像的大小，我們可以使用Photoshop軟件或者Acdsee軟件來輕松做到。

（二）圖像局部剪裁

在網(wǎng)頁設(shè)計(jì)中經(jīng)常要用到圖像的某一部分，例如：剪裁圖像右下角部分圖像、左下角部分圖像、中間部分圖像等。在圖像局部剪裁方面，Acdsee軟件只提供了長(zhǎng)方形的剪裁區(qū)域，因此我比較常用的是Photoshop軟件，因?yàn)樗峁┝嗽S多選取工具，基本上可以滿足網(wǎng)頁設(shè)計(jì)中圖像剪裁的要求。方法如下：①打開要剪裁的圖像;②點(diǎn)擊選取工具，如：矩形選框工具、橢圓選框工具、套索工具等選取局部圖像，并進(jìn)行拷貝操作;③新建畫布，并進(jìn)行粘貼;④在新圖像上進(jìn)行進(jìn)一步的編輯操作（如添加文字、調(diào)整位置、尺寸等），最后保存文件。

（三）制作透明圖像

我們?cè)谥谱骶W(wǎng)頁時(shí)往往會(huì)根據(jù)主題為網(wǎng)頁頁面設(shè)置相應(yīng)的背景顏色或者圖片，這樣使整個(gè)網(wǎng)頁頁面看起來更加美觀。但是當(dāng)我們?cè)诰W(wǎng)頁中再插入圖像時(shí)，往往會(huì)發(fā)現(xiàn)插入的圖像背景顏色和網(wǎng)頁頁面的背景色發(fā)生沖突，這時(shí)候我們就必須將插入的圖像背景色設(shè)置為透明，這樣插入的圖像才能融合到網(wǎng)頁中。我們可以使用Photoshop軟件非常方便地將圖像的背景設(shè)置為透明。

（四）將特殊字體制作成圖像

在網(wǎng)頁制作過程中，我們常常會(huì)在電腦中安裝一些特殊的字體并使用，使網(wǎng)頁中的文字看起來更加美觀，更加具有個(gè)性化。但是這些字體在其它電腦上可能沒有安裝，這時(shí)候網(wǎng)頁的瀏覽效果將大打折扣，這時(shí)候我們可以使用Photshop軟件將這些使用特殊字體的文字內(nèi)容制作成圖片，并插入到網(wǎng)頁中即可解決問題。

（五）與透明Flash相結(jié)合，制作特效效果

在制作網(wǎng)頁的過程中，我們發(fā)現(xiàn)可以為網(wǎng)頁、某個(gè)表格或者某個(gè)單元格指定一個(gè)很漂亮的背景圖像，然后在其中再插入透明Flash動(dòng)畫，可制作出極具吸引人的特效效果。

（六）制作滾動(dòng)圖像

在網(wǎng)頁中添加滾動(dòng)圖像，可以為圖像增色不少。操作如下：①根據(jù)網(wǎng)頁主題需要，準(zhǔn)備幾張大小一致的圖像，作為實(shí)現(xiàn)圖片滾動(dòng)效果的素材;②通過新建CSS樣式表文件和JS文件，并在網(wǎng)頁中添加對(duì)該樣式表的引用來實(shí)現(xiàn)圖像的滾動(dòng)效果。

四、圖像使用原則

1.在制作網(wǎng)頁之前，要先對(duì)網(wǎng)頁的內(nèi)容版式做好規(guī)劃。哪些地方要用到圖像，圖像長(zhǎng)寬大致多少，做到心中有數(shù)。

2.使用圖像處理軟件將網(wǎng)頁中用到的圖像調(diào)整成對(duì)應(yīng)的大小，而不要直接在網(wǎng)頁中直接插入大圖，然后再調(diào)整大小。這是因?yàn)樵诰W(wǎng)頁中直接調(diào)整圖像大小，并沒有真正改變圖像的大小，會(huì)導(dǎo)致網(wǎng)頁的顯示速度變慢。

3.使用圖像做為網(wǎng)頁的背景，最好選擇拼接比較自然的小圖像做為網(wǎng)頁背景，提高網(wǎng)頁的顯示速度。

以上是本人制作網(wǎng)頁時(shí)進(jìn)行圖像處理的一點(diǎn)心得體會(huì)，懇請(qǐng)各位同仁的批評(píng)指正。

參考文獻(xiàn)：

[1]徐福蔭.信息技術(shù)基礎(chǔ)必修[M].廣東教育出版社，2013.

[2]聶小燕.精美網(wǎng)頁設(shè)計(jì)與制作[M].人民郵電出版社，2006.