如果你運營(yíng)在線(xiàn)商城又或是大型電商網(wǎng)站,圖片優(yōu)化是你必須要掌握的。不僅僅是從吸引潛在消費者,還是增加圖片搜索流量,又或是提升網(wǎng)站加載速度,圖片優(yōu)化扮演者非常關(guān)鍵的角色。但說(shuō)到圖片優(yōu)化,很多傳統意義上的SEO人會(huì )說(shuō),圖片要加alt標簽,圖片要壓縮…這樣的粗線(xiàn)條顯然是不行的。


  1、用結構化數據寫(xiě)產(chǎn)品圖片ALT


  我們很容易使用照相機默認的圖片編號當做圖片們的命名,這樣的話(huà)對于搜索引擎來(lái)說(shuō),可能就沒(méi)有辦法辨識圖片的內容,從而我們就失去了從圖片搜索那塊兒帶來(lái)的流量,這是非??上У?,特別是當你的產(chǎn)品有數以萬(wàn)計的話(huà)。通常我們可以制定結構化數據規則讓技術(shù)人員設計程序批量替換圖片的alt屬性,而無(wú)需我們手工操作。


  對于產(chǎn)品圖片的描述來(lái)說(shuō),不建議寫(xiě)過(guò)多冗余內容,保持數據結構化,做到關(guān)鍵詞辨識度高,關(guān)鍵詞信息豐富就可以了,千萬(wàn)不要做關(guān)鍵詞堆積。


  2、圖片拍攝角度問(wèn)題


  基本上拍攝產(chǎn)品照片不會(huì )只拍一個(gè)角度,訪(fǎng)客肯定不會(huì )滿(mǎn)足于只有一張正面照,多角度的去展示才能更好的吸引訪(fǎng)客在你的網(wǎng)站上停留更多的時(shí)間,這個(gè)時(shí)候如何寫(xiě)alt標簽?


  較好的方法也是保持alt標簽的結構化,繼承主圖的格式,千萬(wàn)不要去給這些圖片一個(gè)全新的寫(xiě)法。


  3、關(guān)于大圖的顯示問(wèn)題


  如果你希望提供更大的圖片讓用戶(hù)爽一下,這個(gè)思路很好,但要非常小心,不建議將大圖直接放在網(wǎng)頁(yè)上然后用css將圖片縮小,雖然你看上去圖片變小了,但是圖片的尺寸還是實(shí)實(shí)在在存在的,這會(huì )影響加載速度。相反,你可以先放一張較小的圖片,然后提供查看大圖功能的選項,不管是點(diǎn)擊彈出大圖還是另外新頁(yè)面顯示。


  當然,還有一些人會(huì )把大圖切成一張張小圖做拼接,這樣做可以讓圖片快速顯示,但同時(shí)一張圖片切成小圖之后,服務(wù)器的請求數會(huì )增加,從而會(huì )影響網(wǎng)頁(yè)加載速度。所以,如果圖片的體積實(shí)在過(guò)大的話(huà),建議為圖片專(zhuān)門(mén)配置新服務(wù)器。


  4、給圖片減減肥


  如果你大量的網(wǎng)站圖片非常臃腫,這將嚴重影響網(wǎng)站加載速度,如果超過(guò)10秒鐘,那你等著(zhù)和你的客戶(hù)說(shuō)byebye把。


  圖片文件應該多大?


  有些理論說(shuō)圖片的大小應該保持在70kb以下,不過(guò)這個(gè)有時(shí)候是很困難的,特別對于大圖片來(lái)說(shuō)幾乎是不可能的,除非你不求清晰度。我個(gè)人倒是覺(jué)得,不要用一個(gè)標準去限制每一張圖片的大小,關(guān)鍵在于,我們有沒(méi)有去執行,有沒(méi)有看到我這篇博文后去真正壓縮圖片,這才是關(guān)鍵。


  5、用對圖片格式


  目前有三種非常流行的圖片格式,他們是JPEG,GIF,和PNG。讓我們來(lái)看看他們有何不同,


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


  GIFs (.gif) 的圖片顯示質(zhì)量要比JPEGs遜色很多,通常用作非常簡(jiǎn)單的圖片展示,比如素材或者裝飾性圖案,gif也可以用來(lái)制作動(dòng)畫(huà)。gif不適合用作高顯示質(zhì)量的圖片。


  PNG圖片是比gif更好的選擇,因為PNG圖片支持的色彩要比GIFs多。此外,和JPEG一樣,PNG反復保存也不會(huì )影響圖片質(zhì)量,而且對于小圖來(lái)說(shuō),PNG占用的體積極小,PNG完美支持透明背景,所以一般logo或一般裝飾性圖案都會(huì )選擇PHG格式。注意PNG-24圖片體積要超3倍地大于同樣情況下的PNG-8版本,對待PNG你要十分小心,看仔細了。


  6、正確看待縮略圖


  大部分電商網(wǎng)站都有縮略圖展示,它可以讓訪(fǎng)客迅速的掃描到盡可能多的商品樣式而不需要再去點(diǎn)擊一個(gè)額外的頁(yè)面。


  縮略圖很棒,但是要小心,他們可能是你網(wǎng)站的速度殺手。他們通常會(huì )出現在關(guān)鍵的購物流程之中,若因此影響了購物流程的流暢性,額… 就可能又損失了一個(gè)顧客。


  盡可能壓縮縮略圖體積,縮略圖的圖片不要過(guò)高的追求顯示質(zhì)量,當用戶(hù)點(diǎn)擊到下一層詳情頁(yè)面的時(shí)候再給他一張高質(zhì)量的圖片。


  盡量不要為縮略圖設置alt標簽,通常我們并不希望搜索引擎索引的是縮略圖而應是產(chǎn)品詳情頁(yè)的高質(zhì)量原圖。


  7、使用圖片地圖


  如果你的網(wǎng)站用JS做圖片效果來(lái)更好的提升用戶(hù)體驗,你是否擔心圖片是否還能收錄?當然通常來(lái)說(shuō)蜘蛛是不會(huì )爬取不顯示在源代碼里面的圖片文件的,但是谷歌對于這點(diǎn)已經(jīng)很有經(jīng)驗了,通過(guò)圖片地圖的提交,即把圖片地址一個(gè)個(gè)老老實(shí)實(shí)地列出來(lái),搜索引擎就可以爬行了。


  8、留心裝飾性圖片


  如果只是一些邊框類(lèi)的、或是簡(jiǎn)單的樣式圖片,使用PNG-8或者GIFs,你可以創(chuàng )建非常好看的圖片并且只占幾百bytes的體積。


  如果可能的話(huà),盡量使用css來(lái)創(chuàng )建一些特殊效果,而非圖片。


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


Tag: 技巧