圖文并茂可以說是所有站長默認的創(chuàng)作方式，然而圖片過大對頁面的打開速度影響是很大的，由此才需要我們也給圖片做優(yōu)化。

圖片優(yōu)化不僅僅是為了吸引潛在消費者，另一個目的就是增加圖片搜索所帶來的流量，又或是提升網(wǎng)站加載速度，圖片優(yōu)化圖片優(yōu)化起著至關(guān)重要的作用。說到圖片優(yōu)化，最常用的就是給圖片加alt屬性，圖片壓縮等，這些只是比較粗線條的優(yōu)化，想要做好圖片優(yōu)化只是這樣是不夠的，遠遠沒有這么簡單，這只是開始。

要做圖片優(yōu)化，首先我們需要先給圖片減減肥。

我們先來看看這些數(shù)據(jù)，大部分PC用戶不會等待超過3秒的網(wǎng)站加載速度，而在移動設(shè)備上則不會等待超過5秒鐘，5秒還沒有加載出來，結(jié)果就是用戶關(guān)掉頁面，還會給用戶留下不好的印象。

亞馬遜發(fā)現(xiàn)如果他們的網(wǎng)站加載速度慢了1秒鐘，他們一年將損失16億美元。

搜索引擎已經(jīng)將網(wǎng)站加載速度列入了排名算法之中，如果你網(wǎng)站有大量的圖片致使網(wǎng)站非常臃腫，將嚴重影響網(wǎng)站加載速度，如果超過10秒鐘，那你等著和你的客戶說拜拜吧。

有些理論說圖片的大小應該保持在70kb以下，這個到?jīng)]有明確的規(guī)格，有的時候為了保證圖片的清晰度，圖片稍微大點是在所難免的。個人覺得，不要用一個標準去限制每一張圖片的大小，我們的最終目的只是保證在不影響清晰度的情況下，盡可能的降低圖片大小來保證頁面的打開速度。

不同的圖片格式對圖片優(yōu)化也是有影響的。

目前最流行的三種圖片格式就是：JPEG、GIF、PNG。

JPEG (或者說 .jpg) 是最常用的圖片壓縮格式，支持最高級別的壓縮。通常，對于顯示要求比較高的圖片來說，JPEG格式展示的圖片效果較GIF和PNG有明顯的優(yōu)勢。

GIF (.gif) 的圖片顯示質(zhì)量要比JPEG遜色很多，通常用作非常簡單的圖片展示，比如素材或者裝飾性圖案，gif也可以用來制作動畫。gif不適合用作高顯示質(zhì)量的圖片。

PNG(.png)圖片是比GIF更好的選擇，因為PNG圖片支持的色彩要比GIF多。和JPEG一樣，PNG反復保存也不會影響圖片質(zhì)量，而且對于小圖來說，PNG占用的體積極小，PNG完美支持透明背景，一般logo或一般裝飾性圖案都會選擇PNG格式。注意PNG-24圖片體積是PNG-8版本的3倍，對待PNG你要十分小心，看仔細了。

如下是一個例子，通過對比相同體積下(都是24kb)不同格式的圖片

可以很清楚的看到，JPEG顯然是獲勝者，在同樣的體積下，GIF和PNG必須以犧牲圖片質(zhì)量為代價。不過話又說回來，對于非常小的圖片來說(比如小于5K)，PNG是比較好的選擇，相比GIF，PNG可以在體積很小的情況下依然不會讓圖片失真。

對于那些對圖片質(zhì)量要求極高的站長來說，JPEG毫無疑問是首選，絕對不要用GIF來當做產(chǎn)品大圖。不然的話文件尺寸會非常大不說，也沒有很好的辦法去壓縮它(一壓縮就失真)。可以用GIFs做動畫或是裝飾性小圖。

PNG可以作為JPEG和GIF的替代，如果你想把產(chǎn)品圖片做成PNG格式，盡量用PNG-8而非PNG-24。PNG同時也擅長處理簡單地裝飾圖而只需很小的體積，PNG將會變得越來越流行。當然了，大部分的圖片編輯軟件可以轉(zhuǎn)換以上三種形式的圖片格式。

如果你希望提供更大的圖片讓用戶欣賞，不建議將大圖直接放在網(wǎng)頁上然后用css將圖片縮小，雖然看上去圖片變小了，但是圖片的真實尺寸還是沒有變的，這會嚴重影響頁面加載速度。相反，你可以先放一張較小的圖片，然后提供查看大圖的功能，不管是點擊彈出大圖還是另外新頁面顯示，都是極好的。

還有一些人會把一張大圖切成一張張的小圖做拼接，這樣做雖然可以讓圖片快速顯示，但這樣做會增加服務器的請求數(shù)，從而會影響網(wǎng)頁加載速度。所以，如果對圖片的要求非常高的話，建議為圖片專門配置專門的服務器。

首頁顯示縮略圖是個不錯的選擇。

盡可能壓縮縮略圖體積，縮略圖的圖片不要過分追求顯示質(zhì)量，當用戶點擊到下一層詳情頁面的時候再給他一張高質(zhì)量的圖片。

不要為縮略圖設(shè)置alt標簽，我們并不希望搜索引擎索引的是縮略圖而應是詳情頁的高質(zhì)量原圖。

背景圖、按鈕圖，邊框圖等都可算作裝飾圖，作為一名SEOer，你需要仔細去檢查這些圖片的體積是否過大，是否會影響網(wǎng)站載入速度。

如果只是一些邊框類的、或是簡單的樣式圖片，使用PNG-8或者GIF，可以創(chuàng)建非常好看的圖片并且只占幾百byte的體積。如果可能的話，盡量使用css來創(chuàng)建一些特殊效果，而非圖片。

不建議為網(wǎng)站設(shè)置背景圖片，如果一定要有的話，在保證清晰度的前提下最大程度去壓縮體積。你還可以把背景圖當中鏤空或保持透明來壓縮體積。