多媒體教程 - 在 Web 上使用圖像
本文詳細(xì)講解在什么條件下使用圖像和文本、如何加快圖像的下載以及選擇合適的圖像格式。
何時(shí)使用圖像
對(duì)于大多數(shù)圖片來說，一張圖片可能勝過千言萬(wàn)語(yǔ)。但還是要注意，沒有人會(huì)注意那些饒舌的人。首先，也是最重要的一點(diǎn)，是要把文檔的圖形作為可視化工具，而不是將其作為無(wú)緣無(wú)故的裝飾。它們應(yīng)當(dāng)支持文本的內(nèi)容，并幫助讀者在文檔中導(dǎo)航。使用圖像可使文檔內(nèi)容更清楚，還可以為文檔加注釋或示例。支持內(nèi)容的照片、圖表、曲線圖、地圖和圖畫等都是很自然的、很合適的選擇項(xiàng)。例如，產(chǎn)品的照片對(duì)于在線目錄和購(gòu)物指南來說是非常關(guān)鍵的組成部分。還有具有鏈接功能的圖標(biāo)和印刷符號(hào)，包括具有動(dòng)畫效果的圖像等，都可以是導(dǎo)向內(nèi)容或者外部資源的非常有效的可視向?qū)�。如果某個(gè)圖像對(duì)文檔沒有起到任何上述作用，那就應(yīng)該把它丟到一邊去！
在考慮向文檔添加圖像時(shí)，另外一個(gè)重要的考慮因素，就是在通過網(wǎng)絡(luò)，尤其是通過調(diào)制解調(diào)器連接傳輸這個(gè)文檔時(shí)，檢索方面所帶來的時(shí)間延遲。一般的普通文檔最多可以容納 10-15 千字節(jié)，而一個(gè)圖像可以輕易地達(dá)到數(shù)百千字節(jié)大小。而且一個(gè)文檔的總下載時(shí)間不僅僅是它所有部分加起來的總和，還要考慮網(wǎng)絡(luò)負(fù)載所帶來的延遲。
根據(jù)連接的速度（也就是帶寬，bandwidth，通常用 bps 或者 b/s 來表示）和可能減慢連接速度的網(wǎng)絡(luò)阻塞情況，要下載一個(gè)包含 100 KB 圖像的單獨(dú)文檔，可能要在凌晨一兩點(diǎn)，當(dāng)大多數(shù)人還在睡覺時(shí)，用一個(gè) 57.6 Kbps 的調(diào)制解調(diào)器連接花大約 15 秒鐘左右的時(shí)間來完成下載，也有可能在中午的時(shí)候用一個(gè) 9600 bps 調(diào)制解調(diào)器花上超過 10 分鐘的時(shí)間來下載。您得到這張圖片了嗎？
當(dāng)然，圖片和其他多媒體的使用，會(huì)促使因特網(wǎng)服務(wù)提供商不斷追求更快、更好、更加健壯的方式來提供 Web 內(nèi)容。不久，56 Kbps 調(diào)制解調(diào)器連接就會(huì)像馬和馬車一樣退出歷史舞臺(tái)（就像 9600 bps調(diào)制解調(diào)器那樣），它會(huì)被電纜調(diào)制解調(diào)器和 ADSL 這樣的新技術(shù)所取代。實(shí)際上，大多數(shù)連接很快就會(huì)超過 1Mbps 的速率。
隨著價(jià)格的降低，網(wǎng)絡(luò)的使用會(huì)不斷增加，于是就帶來了阻塞的問題。如果你正在試圖訪問一個(gè)超負(fù)荷運(yùn)轉(zhuǎn)的服務(wù)器，那么不管你的網(wǎng)絡(luò)連接速度有多快，都無(wú)法正常進(jìn)行訪問。
何時(shí)使用文本
文本并沒有過時(shí)。對(duì)于某些用戶來說，文本是他們文檔中唯一可以訪問的部分。我們建議，在大多數(shù)情況下，文檔應(yīng)當(dāng)能夠被任何人訪問，包括那些無(wú)法瀏覽圖像、或者那些為了改善網(wǎng)絡(luò)連接性能而禁用瀏覽器自動(dòng)下載圖像功能的用戶。雖然向文檔中加入圖像的需求可能會(huì)非常強(qiáng)烈，但是有些時(shí)候，純文本文檔確實(shí)會(huì)更有意義。
從其他格式轉(zhuǎn)換為 Web 頁(yè)面的文檔很少含有嵌入式圖像，而參考文獻(xiàn)和其他一些嚴(yán)肅的內(nèi)容，通常都是完全可用的純文本形式。
在訪問速度非常重要的時(shí)候，應(yīng)該創(chuàng)建純文本文檔。如果你知道用戶可能爭(zhēng)著去獲取你的文檔，就應(yīng)該在文檔中避免使用圖像，以適應(yīng)這些用戶的需要。在某些極端的情況下，您可能會(huì)提供一個(gè)主頁(yè)（引導(dǎo)頁(yè)），讓用戶有機(jī)會(huì)在您作品的兩個(gè)副本之間做出選擇：一個(gè)包含圖像，另外一個(gè)則去掉了圖像（流行瀏覽器都具有特殊的圖像圖標(biāo)，來為那些有待下載的圖像留出地方，而這些占位符可能會(huì)把文檔的布局搞得一團(tuán)糟，甚至變成一堆根本沒有辦法閱讀的東西）。
如果希望你的文檔可以很容易地被 Web 上眾多的索引服務(wù)搜尋到，那么文本是最合適的形式 - 僅僅支持圖像，而不支持裝飾和不必要的圖形。但是這些搜索引擎通常會(huì)忽略圖像的存在。如果頁(yè)面的主要內(nèi)容是通過圖像來提供的，那么在線 Web 目錄中有關(guān)你的文檔的信息就會(huì)很少。
加快圖像的下載速度
除了謹(jǐn)慎地選擇要包含在文檔中的內(nèi)容外，還有許多方法可以改善由圖像帶來的負(fù)載和延遲問題：
保持簡(jiǎn)單性
一個(gè)全屏的 24 位彩色圖形，即使經(jīng)過標(biāo)準(zhǔn)格式（例如 GIF 或者 JPEG 等）的數(shù)字壓縮減少了尺寸，它還是會(huì)侵占大部分網(wǎng)絡(luò)帶寬。因此，最好使用各種圖像管理工具來優(yōu)化圖像的尺寸，并將顏色的數(shù)目減為最少的像素?cái)?shù)。簡(jiǎn)化你的繪圖，也不要使用那些風(fēng)景照片，并且避免在圖像中出現(xiàn)大塊的空白背景，和不必要的邊框以及其他占用空間的元素。還要避免使用抖動(dòng)效果（把兩種相近的顏色混合起來已獲得第三種顏色），這種技術(shù)會(huì)極大地降低圖像的可壓縮性。相反，要盡量使用大面積一致的顏色，因?yàn)橛?GIF 或者 JPEG 格式可以很容易地對(duì)它們進(jìn)行壓縮。
重復(fù)利用圖像
這一點(diǎn)對(duì)于圖標(biāo)和 GIF 動(dòng)畫尤其適用。大多數(shù)瀏覽器會(huì)在本地存儲(chǔ)器把引入的文檔成分進(jìn)行緩存，這樣在獲得數(shù)據(jù)時(shí)可以更快，而且使用的網(wǎng)絡(luò)連接也更少。對(duì)于較小的 GIF 動(dòng)畫文件，則要試著準(zhǔn)備每個(gè)連續(xù)的圖像，以便只更新那些在動(dòng)畫中發(fā)生了改變的部分，而不是刷新整個(gè)圖像（這樣也可以加速動(dòng)畫本身的顯示）。
分割大文檔
這是一個(gè)包含圖像的一般原則。很多小的文檔片段是用超鏈接（當(dāng)然是用它了�。┖陀行У哪夸泚斫M織到一起的，與整個(gè)的大塊文檔相比，這樣可以讓用戶覺得更容易接受一些。一般來講，人們寧愿在幾個(gè)頁(yè)面間翻來翻去，也不愿意浪費(fèi)光陰等待下載一個(gè)大文檔（這和電視頻道瀏覽綜合癥有點(diǎn)相似）。一條好的經(jīng)驗(yàn)是把每個(gè)文檔保持在大小為 50 KB 左右，這樣即使讀者使用的是最慢的連接也不會(huì)感到厭煩。
必要時(shí)隔離大圖形
為很大的圖像專門提供一個(gè)鏈接，該鏈接可能是一個(gè)圖像的縮略詞，讓讀者決定是否需要花時(shí)間下載整幅圖像，以及什么時(shí)候下載。而且，由于這樣的圖像不像內(nèi)聯(lián)圖像那樣和文檔中的其他元素混在一起，因此很容易標(biāo)識(shí)并保存在本地存儲(chǔ)器上，以供日后研究使用。
指定圖像的尺寸
最后，另外一種改善性能的方法是把圖像矩形邊界的高度和寬度都包含在它的標(biāo)簽里面。通過指定這些尺寸，就可以省去其他一些額外步驟，擴(kuò)展功能的瀏覽器不必再用額外步驟下載、檢驗(yàn)并計(jì)算圖像在文檔中的尺寸。然而，這種做法有一個(gè)不好的地方。如果用戶關(guān)閉了自動(dòng)下載圖像的功能，瀏覽器還是會(huì)把為圖像預(yù)留的空間以指定的尺寸顯示出來。這樣留給讀者的通常是一個(gè)空的框架，雖然對(duì)于該問題還沒有解決方案，但是我們還是鼓勵(lì)您使用這些尺寸屬性，因?yàn)槲覀児膭?lì)一切能夠改善網(wǎng)絡(luò)性能的行為。
JPEG 還是 GIF？
如果圖像的來源或者你的工具軟件更傾向于某一種格式，您可能只能使用 JPEG 或者 GIF 圖像中的一種�，F(xiàn)在，這兩種格式都得到了瀏覽器的廣泛支持，所以不會(huì)存在用戶能否瀏覽的問題。
然而，我們還是建議您使用一定的工具去創(chuàng)建或者轉(zhuǎn)換這兩種格式，以充分利用它們各自的功能。例如，可以把 GIF 的透明特性應(yīng)用在圖標(biāo)和小的裝飾符號(hào)上。而利用 JPEG 來壓縮那些較大的顏色豐富的圖像，以加快下載速度。
<img> 標(biāo)簽
<img> 標(biāo)簽允許在文檔的當(dāng)前文檔流中引用或者插入圖形圖像。如需了解更多有關(guān)該標(biāo)簽的詳細(xì)信息，請(qǐng)參閱：