觸屏版
全國服務(wù)熱線:0571-87205688
登錄
注冊
客戶中心
關(guān)注云客
圖文并茂可以說是所有站長默認(rèn)的創(chuàng)作方式,然而圖片過大對頁面的打開速度影響是很大的,由此才需要我們也給圖片做優(yōu)化。
圖片優(yōu)化不僅僅是為了吸引潛在消費(fèi)者,另一個目的就是增加圖片搜索所帶來的流量,又或是提升網(wǎng)站加載速度,圖片優(yōu)化圖片優(yōu)化起著至關(guān)重要的作用。說到圖片優(yōu)化,最常用的就是給圖片加alt屬性,圖片壓縮等,這些只是比較粗線條的優(yōu)化,想要做好圖片優(yōu)化只是這樣是不夠的,遠(yuǎn)遠(yuǎn)沒有這么簡單,這只是開始。
要做圖片優(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)站非常臃腫,將嚴(yán)重影響網(wǎng)站加載速度,如果超過10秒鐘,那你等著和你的客戶說拜拜吧。
有些理論說圖片的大小應(yīng)該保持在70kb以下,這個到?jīng)]有明確的規(guī)格,有的時候為了保證圖片的清晰度,圖片稍微大點(diǎn)是在所難免的。個人覺得,不要用一個標(biāo)準(zhǔn)去限制每一張圖片的大小,我們的最終目的只是保證在不影響清晰度的情況下,盡可能的降低圖片大小來保證頁面的打開速度。
不同的圖片格式對圖片優(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反復(fù)保存也不會影響圖片質(zhì)量,而且對于小圖來說,PNG占用的體積極小,PNG完美支持透明背景,一般logo或一般裝飾性圖案都會選擇PNG格式。注意PNG-24圖片體積是PNG-8版本的3倍,對待PNG你要十分小心,看仔細(xì)了。
如下是一個例子,通過對比相同體積下(都是24kb)不同格式的圖片
可以很清楚的看到,JPEG顯然是獲勝者,在同樣的體積下,GIF和PNG必須以犧牲圖片質(zhì)量為代價。不過話又說回來,對于非常小的圖片來說(比如小于5K),PNG是比較好的選擇,相比GIF,PNG可以在體積很小的情況下依然不會讓圖片失真。
對于那些對圖片質(zhì)量要求極高的站長來說,JPEG毫無疑問是首選,絕對不要用GIF來當(dāng)做產(chǎn)品大圖。不然的話文件尺寸會非常大不說,也沒有很好的辦法去壓縮它(一壓縮就失真)。可以用GIFs做動畫或是裝飾性小圖。
PNG可以作為JPEG和GIF的替代,如果你想把產(chǎn)品圖片做成PNG格式,盡量用PNG-8而非PNG-24。PNG同時也擅長處理簡單地裝飾圖而只需很小的體積,PNG將會變得越來越流行。當(dāng)然了,大部分的圖片編輯軟件可以轉(zhuǎn)換以上三種形式的圖片格式。
如果你希望提供更大的圖片讓用戶欣賞,不建議將大圖直接放在網(wǎng)頁上然后用css將圖片縮小,雖然看上去圖片變小了,但是圖片的真實(shí)尺寸還是沒有變的,這會嚴(yán)重影響頁面加載速度。相反,你可以先放一張較小的圖片,然后提供查看大圖的功能,不管是點(diǎn)擊彈出大圖還是另外新頁面顯示,都是極好的。
還有一些人會把一張大圖切成一張張的小圖做拼接,這樣做雖然可以讓圖片快速顯示,但這樣做會增加服務(wù)器的請求數(shù),從而會影響網(wǎng)頁加載速度。所以,如果對圖片的要求非常高的話,建議為圖片專門配置專門的服務(wù)器。
首頁顯示縮略圖是個不錯的選擇。
盡可能壓縮縮略圖體積,縮略圖的圖片不要過分追求顯示質(zhì)量,當(dāng)用戶點(diǎn)擊到下一層詳情頁面的時候再給他一張高質(zhì)量的圖片。
不要為縮略圖設(shè)置alt標(biāo)簽,我們并不希望搜索引擎索引的是縮略圖而應(yīng)是詳情頁的高質(zhì)量原圖。
背景圖、按鈕圖,邊框圖等都可算作裝飾圖,作為一名SEOer,你需要仔細(xì)去檢查這些圖片的體積是否過大,是否會影響網(wǎng)站載入速度。
如果只是一些邊框類的、或是簡單的樣式圖片,使用PNG-8或者GIF,可以創(chuàng)建非常好看的圖片并且只占幾百byte的體積。如果可能的話,盡量使用css來創(chuàng)建一些特殊效果,而非圖片。
不建議為網(wǎng)站設(shè)置背景圖片,如果一定要有的話,在保證清晰度的前提下最大程度去壓縮體積。你還可以把背景圖當(dāng)中鏤空或保持透明來壓縮體積。
評論(0人參與,0條評論)
發(fā)布評論
最新評論