【干貨實(shí)操】圖片太Low不吸睛，10招拯救電商賣家訂單成交率-ESG跨境

圖像優(yōu)化是電商網(wǎng)站運(yùn)營(yíng)中很重要的一部分，可以幫助網(wǎng)站吸引消費(fèi)者點(diǎn)擊、減少網(wǎng)站加載時(shí)間。圖像優(yōu)化和搜索引擎優(yōu)化也有關(guān)，利用產(chǎn)品圖片、裝飾圖片使得店鋪在亞馬遜和其它電商平臺(tái)上排名前列。

你是不是遇到過這些問題：

為什么我的圖片總是不能上谷歌圖片搜索？我需要我是否需要將alt屬性添加到我的圖像？JPEG，GIF和PNG有什么區(qū)別？應(yīng)該什么時(shí)候使用哪一種格式？

本文將介紹10個(gè)網(wǎng)站圖像的優(yōu)化方法：

1、圖片命名簡(jiǎn)單直白

描述圖片很重要，使用相關(guān)關(guān)鍵詞可以幫助網(wǎng)頁出現(xiàn)在搜索引擎上。創(chuàng)造性的描述、包含關(guān)鍵詞的文件名對(duì)圖像優(yōu)化至關(guān)重要。搜索引擎不僅會(huì)檢索網(wǎng)頁上的文本，也能檢索出照片的關(guān)鍵詞。

一般默認(rèn)命名為“DCMIMAGE10.jpg”，但是如果把照片命名為2012-Ford-Mustang-LX-Red.jpg就能提高被搜索到的機(jī)率。

想一想消費(fèi)者搜索產(chǎn)品時(shí)候會(huì)輸入什么關(guān)鍵詞，那你就可以據(jù)此命名。比如，想購(gòu)買汽車的消費(fèi)者可能會(huì)輸入以下關(guān)鍵詞：

2012 Red Ford Mustang LX（2012年紅色福特野馬LX）

Ford Mustang LX Red 2012（福特野馬LX紅2012）

Red Ford Mustang LX 2012（紅色福特野馬LX 2012）

你可以查看網(wǎng)站分析來知道用戶的關(guān)鍵詞搜索習(xí)慣，或者查看用戶最常用的命名模式，并按照該模式來命名你的照片。

2、仔細(xì)優(yōu)化alt屬性

Alt屬性是瀏覽器無法正確顯示圖像時(shí)，代替圖像的文本。它們也可以增加網(wǎng)絡(luò)可訪問性。如果網(wǎng)頁無法顯示圖像，根據(jù)瀏覽器設(shè)置，將鼠標(biāo)懸停在圖像上，用戶也將看到alt屬性文本。

alt屬性也會(huì)為網(wǎng)站增加SEO價(jià)值。在網(wǎng)站上添加合適的包含關(guān)鍵詞的Alt屬性，可以提高網(wǎng)站在搜索引擎上的排名。事實(shí)上，添加alt屬性可能是電商產(chǎn)品要在Google圖片和網(wǎng)絡(luò)搜索中顯示的最佳方式。

下圖為一個(gè)Alt屬性的源代碼：

圖像優(yōu)化的首要任務(wù)就是添加網(wǎng)站上每個(gè)產(chǎn)品圖片的alt屬性。

以下是一些簡(jiǎn)單的alt屬性規(guī)則：

（1）和圖片文件名一樣，用通俗的語言描述圖片。

（2）如果產(chǎn)品有型號(hào)或序列號(hào)，請(qǐng)?jiān)赼lt屬性中標(biāo)明。

（3）不要在Alt屬性中加入過多關(guān)鍵字（比如alt =“福特野馬肌肉車現(xiàn)在購(gòu)買便宜的最優(yōu)惠價(jià)格”）。

（4）請(qǐng)勿將alt屬性用于裝飾性圖像。這樣可能會(huì)因?yàn)檫^度優(yōu)化而受到搜索引擎的懲罰。

（5）請(qǐng)定期進(jìn)行健全性檢查。查看你網(wǎng)頁的來源并檢查你的alt屬性是否正確填寫。

3、合理選擇圖像尺寸和產(chǎn)品角度

通產(chǎn)產(chǎn)品圖片包含多個(gè)角度。比如你想賣掉福特野馬，那你可以加入內(nèi)飾、后部（尤其是空氣擾流板）、輪輞、發(fā)動(dòng)機(jī)等等的特寫照，并為每張照片創(chuàng)建獨(dú)特的alt屬性，比如：

2012-Ford-Mustang-LX-Red-Leather-Interior-Trim.jpg - >使用alt屬性：alt =“2012 Ford Mustang LX Red Leather Interior Trim”

2012-Ford-Mustang-LX-Red-Rear-View-Air-Spoiler.jpg - >使用alt屬性：alt =“2012 Ford Mustang LX Red Rear View Air Spoiler”

這樣做可以增加產(chǎn)品被搜索到的概率。

在提供大圖片時(shí)要小心謹(jǐn)慎

你可能會(huì)覺得放更大的圖片會(huì)為用戶帶來更好的瀏覽體驗(yàn)，但是要小心。不管怎樣，不要將最大的圖片放在網(wǎng)頁上，然后通過源代碼縮小尺寸。因?yàn)樘蟮恼掌瑫?huì)加長(zhǎng)圖片的加載時(shí)間。你可以放上小一點(diǎn)的圖片，把較大的圖片放在彈出窗口或者是單獨(dú)的頁面上。

4、調(diào)整圖像的文件大小

一半的消費(fèi)者都不愿意等待電商網(wǎng)站加載超過3秒鐘，而網(wǎng)頁的加載時(shí)間正在加長(zhǎng)。

亞馬遜發(fā)現(xiàn)，如果他們的網(wǎng)站運(yùn)行慢1分鐘，每年會(huì)損失16億美元。

谷歌會(huì)把頁面加載時(shí)間作為其算法中的排名因子。

如果普通電商網(wǎng)站加載時(shí)間需要15秒，那就會(huì)損失大量潛在消費(fèi)者。

根據(jù)網(wǎng)站不同的內(nèi)容大小，需要不同的加載時(shí)間。文件越大，加載時(shí)間就越長(zhǎng)。（Shopify平臺(tái)會(huì)為電商賣家自動(dòng)壓縮圖片）

如果商家減小圖片文件的大小、提高網(wǎng)頁加載速度，那訪客就會(huì)留下來。

減少圖像文件大小的一種方法是在Adobe Photoshop中使用“Save for Web”命令。你可以用Photoshop把圖像盡量調(diào)小一點(diǎn)，但是同時(shí)也要注意圖片質(zhì)量。

除了Photoshop以外，還有許多在線工具可以編輯圖片。Adobe還提供Photoshop的免費(fèi)平板和手機(jī)版應(yīng)用軟件。雖然移動(dòng)版沒有電腦版Adobe Photoshop功能全，但它涵蓋了圖像編輯的基礎(chǔ)工具，而且是免費(fèi)的。

以下其他幾款不錯(cuò)的照片編輯工具：

專家稱PicMonkey是“令人驚嘆的優(yōu)秀照片編輯工具”。

PIXLR是一款免費(fèi)的應(yīng)用軟件，使用體驗(yàn)很好，可以隨時(shí)隨地編輯圖片。

Canva是另一款不錯(cuò)的在線圖像編輯器。

GIMP有著免費(fèi)的資源，支持在Windows、Mac或者Linux系統(tǒng)。擁有和Photoshop一樣強(qiáng)大的功能，但反應(yīng)會(huì)有點(diǎn)慢。不過這是免費(fèi)的圖像編輯應(yīng)用里最出色的一款了。

電商網(wǎng)站圖片最好不要超過70kb，但對(duì)大圖來說有點(diǎn)困難。

5、選擇合適的文件類型

網(wǎng)絡(luò)上有三種常用格式：JPEG、GIF和PNG。

（1）JPEG

JPEG（或.jpg）是互聯(lián)網(wǎng)上照片的標(biāo)準(zhǔn)格式。JPEG圖像可以在保證圖片質(zhì)量的情況下壓縮稱更小的格式。在上面的圖片中，JPEG格式也能保證高質(zhì)量。

（2）GIF格式

GIF（.gif）圖像質(zhì)量比JPEG圖像低，適合更簡(jiǎn)單的圖像，如圖標(biāo)和裝飾圖像，GIF也支持動(dòng)畫。

GIF非常適合網(wǎng)頁上的簡(jiǎn)單圖像（僅包含幾種顏色），但不太適合復(fù)雜的圖像和照片，也不適合大圖。

（3）PNG

PNG作為GIF的替代品，使用越來越廣泛。PNG支持比GIF更多的顏色，并且不會(huì)像JPEG一樣因?yàn)橹貜?fù)保存而降低質(zhì)量，但是文件大小仍然比JPEG圖像大得多。

另外需要注意，PNG-24圖像的文件大小比PNG-8大三倍以上。

在大多數(shù)情況下，JPEG將是最好的選擇。它們?yōu)樽钚〉奈募叽缣峁┳罴奄|(zhì)量。

千萬別將GIF用于大圖，那樣圖片尺寸會(huì)非常大，而且沒辦法減少。GIF可以用來作為縮略圖和裝飾圖片的格式。

PNG可以成為JPEG和GIFS之間的很好的選擇。如果你只能用PNG格式，請(qǐng)使用PNG-8，而不是PNG-24。PNG格式照片比較小，所以適合簡(jiǎn)單的裝飾圖像。

大多數(shù)圖像編輯軟件可以將圖像保存為上述任何文件格式。

6、優(yōu)化縮略圖

許多電商網(wǎng)站都會(huì)使用縮略圖，特別是在類別頁，縮略圖可以幫助快速展示產(chǎn)品。

縮略圖一般會(huì)出現(xiàn)在購(gòu)物的關(guān)鍵點(diǎn)，如果它們使你的類別頁面不能快速加載，客戶可能就會(huì)因此流失。

盡可能縮小縮略圖文件的大小。這里可能值得質(zhì)量下滑，以支持更小的文件大小。請(qǐng)記住，縮略圖的累積影響會(huì)對(duì)你的網(wǎng)頁加載時(shí)間產(chǎn)生巨大影響。

改變你的alt屬性文本，以避免重復(fù)使用較大版本相同圖像的文本。事實(shí)上，讓你的替代文字大不相同。你最不想看到的就是你的縮略圖被索引而不是更大的圖像。你甚至可以完全忽略縮略圖的文本。

7、使用照片網(wǎng)站地圖

如果你的網(wǎng)站正使用Javascript圖庫、圖片彈出窗口或其他“花哨”的方式來改善整體的購(gòu)物體驗(yàn)，圖像站點(diǎn)地圖將有助于你的圖像在谷歌上被檢索到。

網(wǎng)頁爬蟲無法抓取在網(wǎng)頁源代碼中沒有被特別指出的圖片。因此，為了讓爬蟲識(shí)別到未命名的圖像，就必須在圖像站點(diǎn)地圖中標(biāo)出位置。

你可以在robots.txt文件中插入以下網(wǎng)站，顯示站點(diǎn)地圖的路徑：

Sitemap：http : //example.com/sitemap_location.xml

或者你也可以使用Search Console 將網(wǎng)站地圖提交給谷歌。

Google有很多發(fā)布圖片的指導(dǎo)原則，這可能會(huì)幫助網(wǎng)站提高在SERP上的排名。另外，還可以使用谷歌站點(diǎn)地圖（Google sitemap）向谷歌提供更多網(wǎng)站圖片信息，使在谷歌上能搜索到更多的產(chǎn)品照片。

使用站點(diǎn)地圖并不能保證圖片能被在谷歌上被搜索到，但是可以優(yōu)化圖片搜索。網(wǎng)站管理員工具有很多建議，以保證正確上傳網(wǎng)站地圖。

為所有圖片添加特定標(biāo)簽也非常重要。你還可以創(chuàng)建一個(gè)獨(dú)立的站點(diǎn)地圖來專門列出圖像。重要的是在使用特定標(biāo)簽的同時(shí)，將所有必要的信息添加到你擁有或?qū)⒁獎(jiǎng)?chuàng)建的站點(diǎn)地圖中。

8、謹(jǐn)慎使用裝飾性圖像

網(wǎng)站通常有各種各樣的裝飾圖片，例如背景圖片，按鈕和邊框。所有與產(chǎn)品無關(guān)的東西都可能被視為裝飾形象。

雖然裝飾圖像可以增加網(wǎng)頁的美感，但它們會(huì)擴(kuò)大文件大小、延長(zhǎng)加載時(shí)間。所以，賣家需要謹(jǐn)慎使用裝飾圖片，以免客戶訪問量降低。

賣家可以檢查網(wǎng)站上所有裝飾圖像的文件大小，或使用最小化文件大小的模板。

以下是一些縮小裝飾圖像文件大小的方法：

構(gòu)成邊框或簡(jiǎn)單圖案的圖片可以用PNG-8或GIF。好看的邊框和圖案只需要幾百字節(jié)。

盡可能使用CSS創(chuàng)建彩色區(qū)域，而不是使用圖像。盡量用CSS樣式來替換裝飾圖像。

另外，大型壁紙風(fēng)格的背景圖片，文件可能會(huì)很大，盡可能地在不破壞圖像質(zhì)量的前提下縮小文件。

你可以用來消除背景圖像大小的一種技巧是剪切背景圖像的中間部分，使其成為平坦的顏色，甚至透明。這樣可以大大減少文件大小。

9、謹(jǐn)慎使用內(nèi)容傳送網(wǎng)絡(luò)（CDN）

托管圖像和其他媒體文件可以使用內(nèi)容傳送網(wǎng)絡(luò)（CDN），它們可以提高頁面加載速度并幫助解決帶寬問題。

但CDN的一個(gè)缺點(diǎn)就是反向鏈接。反向鏈接對(duì)搜索引擎優(yōu)化至關(guān)重要，你擁有的反向鏈接越多，你的網(wǎng)站在搜索引擎中的效果就越好。

通過將圖像放在CDN上，圖像可能會(huì)從你的域名中移到CDN的域名中。所以如果有人點(diǎn)擊到網(wǎng)站圖片，他們實(shí)際上是被鏈接到CDN的域名上。

別人所謂的好方法不一定適合自己，所以用之前先確認(rèn)是不是適合公司。

如果網(wǎng)站每個(gè)月業(yè)務(wù)量很大，那就可以選擇CDN，因?yàn)樗梢越鉀Q帶寬問題。

如果網(wǎng)站現(xiàn)在每天只能獲得數(shù)千名訪問者，那就不適合CDN了。

10、測(cè)試你的圖像

優(yōu)化圖像的最終目的的提高銷量，最后需要測(cè)試什么樣的圖像可以提高銷量。

測(cè)試每頁產(chǎn)品圖像的數(shù)量：一些自主電商平臺(tái)的加載時(shí)間很長(zhǎng)，因此減少網(wǎng)頁的圖片數(shù)量可以降低加載時(shí)間，提高點(diǎn)擊量和銷售量。而有的時(shí)候更多照片可以給消費(fèi)者帶來更好的瀏覽體驗(yàn)，從而提高銷量。相應(yīng)做測(cè)試可以找出最合適的圖片數(shù)量。

測(cè)試客戶喜歡的角度：通過提供客戶希望看到的視圖，可以增加客戶的忠誠(chéng)度?？梢酝ㄟ^查看產(chǎn)品瀏覽量來確定用戶最喜歡的角度。調(diào)查、與客戶交談都是測(cè)試的好辦法。

測(cè)試類別頁面上有多少產(chǎn)品列表比較合適：測(cè)試你在類別頁面上列出的產(chǎn)品數(shù)量，以查看放10個(gè)、20個(gè)還是100個(gè)比較合適。

       歡迎關(guān)注「PingPong訂閱號(hào)」獲取更多資訊

點(diǎn)擊咨詢現(xiàn)在有哪些新興平臺(tái)值得關(guān)注 >>>

特別聲明：以上文章內(nèi)容僅代表作者本人觀點(diǎn)，不代表ESG跨境電商觀點(diǎn)或立場(chǎng)。如有關(guān)于作品內(nèi)容、版權(quán)或其它問題請(qǐng)于作品發(fā)表后的30日內(nèi)與ESG跨境電商聯(lián)系。