幾種常用圖像格式的教學(xué)應(yīng)用剖析

陸元明

（深圳大學(xué)師范學(xué)院，廣東深圳 518060）

教學(xué)圖像不僅是教學(xué)系統(tǒng)的最重要資源之一，也是教學(xué)系統(tǒng)最主要的人機(jī)交互元素之一，它對教學(xué)的重要性是不言而喻的，我們經(jīng)?；ê芏喙Ψ蛉パ芯拷虒W(xué)系統(tǒng)里的聲音、視頻、動畫，甚至網(wǎng)絡(luò)流媒體等教學(xué)資源，而很少有專門針對教學(xué)圖像格式的研究，這里所做的初步嘗試性分析，希望起到拋磚引玉的作用。

一、教學(xué)圖像的重要共性

1.圖像格式

各種圖像格式的不同之處在于表示圖像數(shù)據(jù)的方式，并且它們支持不同的壓縮方法和Photoshop 功能。圖像的標(biāo)準(zhǔn)位深度是8 位/通道，除非是圖像處理類課程的特例，教學(xué)圖像通常不需要涉及更多的位深度。

適用于教學(xué)的圖像格式，種類不少，但真正常用、兼容性又好的卻并不多，在充分研究這些格式特性的基礎(chǔ)上用好它們，是本文的初衷。

2.分辨率設(shè)置

在調(diào)整圖像大小的時候，可以設(shè)置分辨率，因?yàn)榻^大多數(shù)教學(xué)圖像都是用于教學(xué)網(wǎng)站、網(wǎng)絡(luò)課程、課堂教學(xué)用演示文稿或者教學(xué)軟件等幾個方面，極少有涉及高分辨率打印輸出等情況，因此可將教學(xué)圖像分辨率固定設(shè)置為72PPI 或者96PPI，而以96PPI 為更好（以適應(yīng)高清顯示器已經(jīng)廣泛應(yīng)用這個現(xiàn)實(shí)），只有用GIF 格式制作教學(xué)動畫時，可以選擇72PPI，這是因?yàn)閯赢嫳旧淼某叽绫容^小。

由于顯示器物理分辨率是固定的，在教學(xué)圖像中使用更高的分辨率，通常只是無謂增加了傳輸、解壓和系統(tǒng)的負(fù)擔(dān)，有害無益，這應(yīng)當(dāng)成為共識和常識。

3.存儲為Web 所用格式

“存儲為Web 所用格式”是Photoshop“文件”菜單下的選項(xiàng)，其鍵盤快捷鍵為Alt+Shift+Ctrl+S，這種存儲方式往往不容易被人們注意到，但它卻是生成教學(xué)圖像的最佳方式，理由如下：

（1）三種最常用的教學(xué)圖像格式，GIF、JPEG 和PNG 都可統(tǒng)一用這種方式生成；

（2）每種圖像格式，都有針對Web 和電腦顯示的完整優(yōu)化選項(xiàng)，適應(yīng)性極強(qiáng)；

（3）過去Photoshop 附帶的Image Ready 位圖編輯器已經(jīng)被這個功能替代，即：“存儲為Web 所用格式”是Photoshop 生成GIF 動畫的唯一方法。

二、JPEG 格式圖像及其教學(xué)應(yīng)用

1.JPEG 格式圖像概述

JPEG (聯(lián)合圖像專家組) 格式是在 World Wide Web 及其他聯(lián)機(jī)服務(wù)上最常用的一種格式（如圖1），用于顯示超文本標(biāo)記語言 (HTML) 文檔中的照片和其他連續(xù)色調(diào)圖像，它是大多數(shù)數(shù)碼相機(jī)的默認(rèn)記錄格式。JPEG 格式支持 CMYK、RGB 和灰度顏色模式，但不支持透明度。與 GIF 格式不同，JPEG 保留 RGB 圖像中的所有顏色信息，但通過有選擇地扔掉數(shù)據(jù)來壓縮文件大小。

JPEG 圖像在打開時自動解壓。壓縮級別越高，得到的圖像品質(zhì)越低；壓縮級別越低，得到的圖像品質(zhì)越高。在大多數(shù)情況下，“最佳”品質(zhì)選項(xiàng)產(chǎn)生的結(jié)果與原圖像幾乎無分別。

JPEG 使用有損壓縮，建議對連續(xù)色調(diào)圖像（如照片）使用此壓縮方法，若要指定圖像的品質(zhì)，當(dāng)用Photoshop 保存時，請在“品質(zhì)”文本框中輸入 0 至12 之間的一個值。如果圖像需要高分辨率打印輸出，請選取最佳品質(zhì)壓縮。但對大多數(shù)教學(xué)應(yīng)用，品質(zhì)“高”（對應(yīng)值8）已經(jīng)足夠。

2.JPEG 圖像的教學(xué)應(yīng)用及處理方法

（1）就教學(xué)而言，JPEG 格式通常用于教學(xué)網(wǎng)站上的照片展示、網(wǎng)頁的背景圖片、網(wǎng)絡(luò)課程的“Banner”（橫幅漸變圖片）、教學(xué)示意圖/原理圖、幻燈片放映用圖、課堂演示文稿的母版背景圖、教學(xué)軟件插圖以及在其他在線服務(wù)中顯示照片和其他連續(xù)色調(diào)圖像；

（2）由于其壓縮品質(zhì)可選，所以適應(yīng)范圍很廣，既可以是非常簡潔的圖符，也可以是用以研究圖像處理效果的高清晰度大圖；

（3）需要注意的是，由于JPEG 不支持透明度，所以作為背景類或者裝飾性的圖片使用時，通常要進(jìn)行一些加工，在Photoshop 中，“以快速蒙板模式”編輯、使用自定形狀工具和圖層樣式制作特別的邊框、在蒙板上使用漸變填充、調(diào)整圖層不透明度和圖層混合模式、使用各種濾鏡等，是常用的方法。

依據(jù)前文，“存儲為Web 所用格式”是生成教學(xué)圖像簡便而又更加適當(dāng)?shù)姆绞?，如圖1 所示，“品質(zhì)”可選0 至100，這里選了“非常高”（默認(rèn)為80），默認(rèn)勾選“連續(xù)”，這時網(wǎng)絡(luò)圖片將以多條路徑下載，而“優(yōu)化”用以創(chuàng)建更小但兼容性更低的文件，“圖像大小”用于改變尺寸，如果是縮小，通常選擇插值算法“兩次立方（較銳利）”，其他選項(xiàng)較少用到，讀者可自行參閱相關(guān)文獻(xiàn)或Adobe 的幫助文件。

圖1 存儲為Web 所用格式：JPEG 選項(xiàng)

三、GIF 格式圖像：圖片動畫的唯一選擇

1.GIF 格式圖像概述

圖形交換格式 (GIF) 是在 World Wide Web 及其他聯(lián)機(jī)服務(wù)上常用的一種文件格式(如圖2)，用于顯示超文本標(biāo)記語言 (HTML) 文檔中的索引顏色圖像。GIF是一種用 LZW 壓縮的格式，目的在于最小化文件大小和傳輸時間。GIF 格式保留索引顏色圖像中的透明度，但不支持 Alpha 通道。

2.GIF 圖像的教學(xué)應(yīng)用價值

GIF 與JPEG 同為最早出現(xiàn)、最常用的圖像格式，它有以下三大特點(diǎn)，注定了其廣泛的教學(xué)應(yīng)用價值：

（1）GIF 采用索引顏色模式，最多256 色，這個特性使得文件可以變得非常小，尤其適合教學(xué)插畫、圖符、教學(xué)示意圖或原理圖等類不需要太多顏色的教學(xué)應(yīng)用；

（2）GIF 支持透明度，這樣插入的圖片可更好地與教學(xué)應(yīng)用情景融為一體，而不需要專門設(shè)置，圖2 所示的是一個256 色，摳為透明背景的教學(xué)插圖，文件很小，可以方便自然地應(yīng)用到教學(xué)網(wǎng)頁、網(wǎng)絡(luò)課程、演示文稿或者教學(xué)軟件中，而無須額外處理；

（3）GIF 是唯一支持動畫的圖像格式，與FLASH 等需要插件或播放器的動畫不同，GIF 動畫天然被各種教學(xué)應(yīng)用環(huán)境所支持，不需要任何設(shè)置！設(shè)計精巧的GIF動畫可以給教學(xué)應(yīng)用帶來豐富的多媒體感受和教學(xué)交互性（例如設(shè)置形象生動的超級鏈接等）。

圖2 存儲為Web 所用格式：GIF 選項(xiàng)

四、PNG 格式圖像：教學(xué)應(yīng)用前途廣闊

1.PNG 格式圖像概述

便攜網(wǎng)絡(luò)圖形 (PNG) 格式是上世紀(jì)90年代中期作為GIF 和TIFF 的無專利替代品開發(fā)的，同時增加了一些GIF 文件格式所不具備的特性，用于無損壓縮和在Web 上顯示圖像。PNG 格式支持無Alpha 通道的RGB、索引顏色、灰度和位圖模式的圖像。

PNG 格式有PNG-8 和PNG-24 兩種，都支持透明度，而前者跟GIF 類似，同樣采用8 位調(diào)色板，將RGB 彩色圖像轉(zhuǎn)換為2 至256 種索引仿色，它很適合那些顏色比較單一的圖像，例如Logo、圖標(biāo)等；PNG-24 與GIF 不同，它支持24 位真彩色和256 級透明度，使得彩色圖像的邊緣能與任何背景平滑地融合，從而徹底地消除鋸齒邊緣，這種功能是其他圖像格式?jīng)]有的；此外，PNG 具備流式讀/寫性能(stream ability)，即允許連續(xù)讀出和寫入圖像數(shù)據(jù)，這個特性很適合在網(wǎng)絡(luò)教學(xué)過程中生成和顯示圖像。

PNG 出現(xiàn)較晚，很多網(wǎng)絡(luò)瀏覽器經(jīng)過很長時間才開始完全支持PNG 格式，如微軟的IE 瀏覽器一直到7.0版才支持PNG 格式中的半透明效果，但它后來居上，在許多教學(xué)情境下可以更好地替代JPEG 和GIF 格式。

2.PNG 圖像的教學(xué)獨(dú)特應(yīng)用

（1）PNG-24 格式同時擁有256 級透明度和真彩色支持兩大屬性，這在圖像格式中是獨(dú)一無二的，可適用于制作教學(xué)圖標(biāo)、Logo、教學(xué)示意圖、流程圖、帶透明漸變的背景圖、各種材質(zhì)的鏤空文字、帶自定形狀邊框的高清圖片等等幾乎所有教學(xué)環(huán)境；

（2）更優(yōu)化的網(wǎng)絡(luò)傳輸性能（流式特性）、更小的體積和能夠無損壓縮等優(yōu)異特點(diǎn)，使其成為未來教學(xué)圖像應(yīng)用，特別是網(wǎng)絡(luò)教學(xué)方面非常有前途的格式；

（3）在目前的智能移動設(shè)備上，PNG 已經(jīng)成為最主流的圖像格式之一，它在移動學(xué)習(xí)方面（例如以平板電腦為主的“電子書包”）的應(yīng)用重要性，將是不可替代的。

圖3 為“存儲為Web 所用格式”，預(yù)設(shè)選“PNG-24”時的對話框，其中“交錯”復(fù)選框用以讓圖片“以多條路徑下載”。

圖3 存儲為Web 所用格式：PNG 選項(xiàng)

示例圖片使用了蘋果自定形狀做蒙版摳圖，又用了“金子”圖層樣式做特色邊框，再在圖層蒙板中用黑白漸變工具示范了連續(xù)漸變半透明效果。

五、PDF 格式：理想的電子教材

便攜文檔格式 (PDF) 是一種靈活的、開放標(biāo)準(zhǔn)的、跨平臺和跨應(yīng)用程序的文件格式，2007年12月成為國際標(biāo)準(zhǔn)。

基于 PostScript 成像模型，PDF 文件精確地顯示并保留字體、頁面版式以及矢量和位圖圖形，無論在哪種打印機(jī)上都可保證忠實(shí)地再現(xiàn)原稿的每一個字符、顏色以及圖像。另外，PDF 文件可以包含電子文檔搜索和各種導(dǎo)航功能等。

PDF 包括Photoshop PDF 和通用PDF 兩種類型，后者更多是圖像和文本等的混合文件類型，這里將它作為常用圖像格式來推介，是因?yàn)樗哂幸韵聝煞N特別的教學(xué)應(yīng)用價值：

1.交互式多媒體電子書

PDF 電子書制作簡單、排版美觀、圖文并茂、兼容性好，更重要的是具有很強(qiáng)的交互功能，如翻頁、跳轉(zhuǎn)、超級鏈接到網(wǎng)頁或音視頻等，還可隨意放大縮小閱讀、圈點(diǎn)標(biāo)注等，是最常用的電子書格式。

通過新版本Adobe Acrobat 等軟件制作的PDF 電子書，不僅可以通過鏈接、書簽等方式激活多媒體，甚至可以在頁面上直接播放包括各種格式的音頻、視頻和交互多媒體（如SWF）在內(nèi)的各種多媒體文件。

另外，PDF 電子書通過安全性設(shè)置，可以有效地保護(hù)知識產(chǎn)權(quán)，例如限制電子書的閱讀、打印、內(nèi)容復(fù)制和編輯等。

2.高度精確的教材打印

筆者曾對我市中學(xué)教師開設(shè)《教學(xué)圖像處理：應(yīng)用與研究》繼續(xù)教育課程，印刷自編教材時遭遇較嚴(yán)重的排版問題：在Word 中我已經(jīng)對特別選擇的美觀中文字體做了“將字體嵌入文件”處理，并將無法嵌入的專利字體轉(zhuǎn)換為PNG 圖片了，但在其他電腦上依然會出現(xiàn)版式混亂等情況，反復(fù)折騰幾次后，最終選擇將文件另存為PDF 格式，打印時一切問題都不存在了，在Word 中的諸多設(shè)置變?yōu)槎嘤啵?/p>

注：Office2010 起已經(jīng)整合另存為PDF 格式功能，老版本則需安裝和使用“Microsoft 另存為PDF 或XPS加載項(xiàng)”。

PDF 的優(yōu)點(diǎn)在于跨平臺、能保留文件原有格式，字型嵌入系統(tǒng)是其特色技術(shù)之一，可使字型隨文件一起傳輸。此外，Photoshop PDF 文件能在PDF 中保留Photoshop 數(shù)據(jù)，如圖層、Alpha 通道、路徑和專色等，并支持幾乎所有顏色模式，而文件大小和兼容性都優(yōu)于PSD 格式，可作為圖像處理教學(xué)的一種可選存儲格式。

六、結(jié)束語

本文介紹的四種圖像格式，也是最常用的教學(xué)圖像格式，在各教學(xué)領(lǐng)域中的應(yīng)用價值很高，這方面的專門思考雖然不多，但不知不覺的應(yīng)用已經(jīng)在教學(xué)中不斷開展。

表1 概括了四種圖像格式的特點(diǎn)，根據(jù)教學(xué)應(yīng)用的不同，我們應(yīng)該有的放矢地選擇不同圖像格式，以達(dá)到優(yōu)化教學(xué)資源的目的。

表1 四種常用圖像格式的特點(diǎn)對比

總體來說，JPEG 適用于不需要透明度的連續(xù)色調(diào)教學(xué)場景，例如照片插圖和背景圖（有時需額外處理），它的特點(diǎn)是壓縮程度靈活可調(diào)、兼容性好；GIF 是唯一支持教學(xué)動畫的格式，有利于促進(jìn)教學(xué)交互性，而它對透明度的有限支持，又可用于顏色不多的簡潔圖標(biāo)或教學(xué)示意圖等的創(chuàng)建；PNG 是最有教學(xué)應(yīng)用前景的一種格式，除了不支持動畫外，它幾乎可以在所有方面替代前面兩種格式；PDF 更多時候是一種混合媒體格式，它支持多媒體和交互性很強(qiáng)的電子書，同時可用于高保真的教學(xué)文檔打印。

[1]Adobe幫助系統(tǒng) [DB/OL].http://helpx.adobe.com/cn/photoshop,2014.

[2]維基百科：JPEG [DB/OL].http://en.wikipedia.org/wiki/JPEG,2014.

[3]維基百科：GIF [DB/OL].http://zh.wikipedia.org/zh-cn/GIF,2014.

[4]維基百科：PNG [DB/OL].http://zh.wikipedia.org/zh-cn/PNG,2014.

[5]PNG 功能規(guī)范白皮書（最新版）[DB/OL].http://www.w3.org/TR/PNG,2003.

[6]維基百科：PDF [DB/OL].http://zh.wikipedia.org/zh-cn/PDF,2014.