如何減小網(wǎng)頁中圖片的尺寸？

應(yīng)當(dāng)注意網(wǎng)頁中每個圖片的尺寸，檢查是否可以將圖片的調(diào)色板設(shè)置為256色或者更少。當(dāng)然，這也取決于圖像和文件的格式。網(wǎng)站上有照片、截圖和屏幕截圖等，每種類型都需要認(rèn)真處理。這是一項乏味的幾乎沒人想要從事的工作。下面大家介紹下減小網(wǎng)頁中圖片的尺寸的幾種方法？

打開Firefox并訪問你的網(wǎng)站。在瀏覽器的右下角，可以看到截圖的小圖標(biāo)。單擊它就會出現(xiàn)一個新的瀏覽器窗口，這個Web服務(wù)器會獲取網(wǎng)站的所有圖片，然后進(jìn)行壓縮。下載經(jīng)過優(yōu)化的打包zip文件替換服務(wù)器中的文件。同樣，在其他有圖片的頁面中進(jìn)行相應(yīng)的處理。這樣做的好處是，網(wǎng)站中的圖片越小，加載時間越短，用戶體驗越好。

圖片聚合技術(shù)是減少網(wǎng)頁圖片尺寸的最好的方法，假設(shè)你有一個論壇，論壇中的人們喜歡使用表情圖標(biāo)來表示自己的感情。因為表情圖標(biāo)很多，你就需要很多不同的圖片文件，這增加了每個頁面的HTTP請求數(shù)。大量的文件下載大大降低了網(wǎng)站的加載時間。

想想一個48*16像素的圖片平均分成3列，每一列都是16X16像素的表情圖標(biāo)：一個是悲傷的表情，一個是高興的表情，一個是生氣的表情等等。這種單獨文件包含了3張圖片的方式就是圖片聚合。使用CSS的“background-image”和“background-position”屬性就可以確定想要顯示的圖片。例如，在頁面上顯示高興的表情。這樣，我們可以將所有的表情都放到一個單獨的文件中，極大地減少了HTTP的請次數(shù)和時間。自然，圖片聚合的越多，你的受益就越大。