上一篇文章我們簡單的介紹了 產(chǎn)品標題，產(chǎn)品描述的書寫以及SEO優(yōu)化 。本章，我們借著產(chǎn)品圖片上傳教程這個機會，來詳細的說一下產(chǎn)品圖片相關(guān)的一些知識。之所以把產(chǎn)品圖片單獨列一章來說，是因為產(chǎn)品圖片的優(yōu)化涉及到很多的方面，對電商業(yè)務(wù)的拓展也非常的重要。

文章更新信息

Shopify官方指出最適合的產(chǎn)品圖片的文件格式為JPG Shopify官方推出高質(zhì)量免費圖片服務(wù)

Shopify官方指出一個產(chǎn)品可以上傳的圖片數(shù)量最多為250張

Shopify官方指出，產(chǎn)品圖片長寬尺寸最大為4472*4472像素，單個圖片文件大小不能超過20MB，否則無法上傳。Shopify推薦的產(chǎn)品圖片長寬尺寸為2048*2048像素

關(guān)于產(chǎn)品圖片相關(guān)的內(nèi)容，我覺得大致可以分為三個部分關(guān)鍵詞排名點擊陸金手指谷哥3：

產(chǎn)品圖片怎么拍好； 產(chǎn)品圖片如何優(yōu)化； 產(chǎn)品圖片如何上傳。

在這里面，對我來說最難的就是第一個階段，產(chǎn)品圖片怎么拍好，這里面涉及到的內(nèi)容真的太多了，我覺得都可以單獨出一本書了。暫時我還沒有能力去搞，所以本節(jié)略過。需要聲明

的是，這個是相當重要的內(nèi)容，建議大家多去問問谷哥和度娘。有句話說的好：做電商賣產(chǎn)

品，其實賣的就是圖片。大概就是這個意思了。我想做Amazon的對產(chǎn)品圖片的重要程度，

應(yīng)該是深有體會的.

這里Shopify的博客上有2篇關(guān)于飾品類產(chǎn)品圖片的Tips和 產(chǎn)品圖片對銷售的影響 的文章， 做相關(guān)產(chǎn)品的同學(xué)可以看看，發(fā)布的時間雖然有點兒久，但是還是很實用的。

Shopify后臺上傳產(chǎn)品圖片的操作很簡單，幾句話就可以帶過，這個我會放到本節(jié)內(nèi)容的最后簡單說下。所以本節(jié)重點是結(jié)合Shopify博客上的一篇關(guān)于圖片優(yōu)化的文章來說下關(guān)于產(chǎn)品圖片優(yōu)化的事情。

這里我們所說的圖片優(yōu)化，主要指兩個方面的優(yōu)化: 一個是如何讓Google或者其他搜索引擎找到并正確的理解索引你的圖片，以便當客戶使用圖片搜索功能搜索產(chǎn)品的時候正確顯示你的產(chǎn)品圖片給潛在客戶。另一個是，如何在保證圖片質(zhì)量的前提下盡可能的縮小產(chǎn)品圖片文件大小，來加快網(wǎng)頁的加載速度，縮短打開時間。

圖片優(yōu)化第一點： 為你的圖片正確命名

Creating descriptive, keyword-rich file names. Search engines not only crawl the text on your webpage, but they also search for keywords within your image file names.

舉個栗子：

通常我們用相機/手機拍完照片之后，將照片導(dǎo)入到電腦里，照片的文件名會是一串字母數(shù)字加文件擴展名。如DCMIMAGE10.jpg。我們將產(chǎn)品圖片上傳到Shopify之前的第一步優(yōu)化， 就是更改圖片的文件名字。例如，改為： 2012-Ford-Mustang-LX-Red.jpg。為什么關(guān)鍵詞排名點擊陸金手指谷哥3？正如上面 所 說 Search engines not only crawl the text on your webpage, but they also search for keywords within your image file names. 搜索引擎不僅僅會抓取你網(wǎng)頁上的文字，還會抓取你的圖片名稱。如下圖，為上圖野馬跑車的圖片名稱。如果是默認的DCMIMAGE10.jpg， 搜索引擎是無法知道這張圖片上是什么內(nèi)容的。如果是2012-Ford-Mustang-LX-Red.jpg，則

搜索引擎會將圖片名稱中的這幾個關(guān)鍵詞進行索引。

那 么 ，2012 Red Ford Mustang LX； Ford Mustang LX Red 2012； Red Ford Mustang LX 2012這三個命名哪個更好呢？ 在我看來其實是一樣的，但是文章作者提出來，可以依據(jù)網(wǎng)頁分析數(shù)據(jù)看下訪客們都是使用哪種排序方式的關(guān)鍵詞進行搜索的，然后進行圖片重命名重新上傳。精確匹配客戶的搜索，當然更好，但是我覺得，只要能夠準確描述產(chǎn)品圖片，語序具有邏輯性就可以了。

其實不僅僅是Shopify，任何圖片在上傳之前都應(yīng)該進行這樣的重命名，把這個養(yǎng)成一個習(xí)慣。

Tips：圖片命名的時候，單詞之前請使用“-”代替空格，否則上傳上去之后，空格會被%20替換。2012-Ford-Mustang-LX-Red.jpg會變成

2012%20Ford%20Mustang%20LX%20Red.jpg。圖片優(yōu)化第二點：務(wù)必填寫圖片的ALT屬性

ALT是英文單詞Alternate的縮寫，意為交換、替換。圖片的ALT屬性是圖片一個必需的屬 性，它用于在圖像無法顯示或者用戶禁用圖像顯示時，代替圖像顯示在瀏覽器中的內(nèi)容。假

設(shè)由于下列原因用戶無法查看圖像，alt屬性可以為圖像提供替代的信息：1. 網(wǎng)速太慢; 2. src

屬性中的錯誤; 3. 瀏覽器禁用圖像; 4. 用戶使用的是屏幕閱讀器 (以上內(nèi)容來源于百度)

舉個栗子：

上圖，添加圖片的時候定義了該圖片的ALT屬性值為“上海鮮花港 – 郁金香”。當用戶打開瀏覽器進行瀏覽時，正常顯示就是郁金香的圖片了。如果因為網(wǎng)速問題導(dǎo)致圖片打不開，則上圖位置顯示的內(nèi)容為：

此時用戶知道這里有一張關(guān)于郁金香的圖片，但是圖片具體什么樣

子，就只能自行腦補了。

除了幫助用戶在無法打開圖片的時候理解圖片內(nèi)容，ALT的另外一個重要作用就是幫助搜索引擎更好的理解圖片的內(nèi)容了。ALT中的關(guān)鍵詞，可以幫你的圖片在搜索引擎中有個更好的排名。因此我們說的圖片的優(yōu)化，就是要給每個產(chǎn)品圖片都加上Alt標簽。

目前產(chǎn)品圖片展示一個流行趨勢就是從不同角度給產(chǎn)品拍一些細節(jié)圖。因此在填寫圖片的Alt 屬性的時候，也盡可能的為每一張圖填寫不同的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 “

相對長尾帶有描述性的Alt關(guān)鍵詞可以讓你從Google搜索中獲得更多的訪問。圖片優(yōu)化第三點：在保證圖片質(zhì)量的前提下盡可能的控制文件大小

你可能有聽說過： 在桌面電腦上，如果一個網(wǎng)站3秒內(nèi)還沒有打開，很多人就會選擇離開；

在移動設(shè)備上，這一時間增加到5秒；Amazon的一項數(shù)據(jù)研究表明，他們的網(wǎng)站打開速度慢1秒，一年的銷售損失大約為16億美元；Google的排名算法中，網(wǎng)站打開速度也是幫你獲得更高排名的重要因素之一。

因此，如果你的網(wǎng)站打開速度很慢的話，大部分人都會在網(wǎng)頁還未加載完的情況下直接選擇離開。雖然Shopify采用了包括CDN技術(shù)，圖片壓縮技術(shù)等等多項網(wǎng)頁加速技術(shù)為網(wǎng)站加

速，但是如果你的網(wǎng)站上需要加載很多的大文件，例如很多人會用的動輒1M-2M的Banner 圖，很大的產(chǎn)品圖片，這些還是會成為影響網(wǎng)站打開速度的重要因素。

在保證圖片質(zhì)量的前提下控制圖片文件大小的工具有很多，你可以找找百度圖片無損壓縮工具找找。

圖片優(yōu)化第四點：選用合適的圖片格式

目前主流的圖片格式有jpg,png,gif。查了寫資料，gif是大部分人不推薦使用的，jpg和png-8 則是大家公認的比較好的圖片格式。看下圖。在文件大小一樣的情況下，jpg的色彩明顯要比

gif和png要鮮艷好多。

也因此 《10 Must Know Image Optimization Tips》的作者認為，Jpg格式的圖片是第一選擇。（2017年9月22日更新）在最新的Shopify官方聲明中也指出 – “The best file type for

productimagesisgif格式的圖片就算了，不要用了。png格式的圖片要注意區(qū)分

下是png-8還是png-24. png-8可以使用，png-24文件大，就不要用了。最后來簡單說下Shopify產(chǎn)品圖片上傳以及圖片編輯設(shè)置的方法

圖片上傳一共有四種方法。打開Shopify后臺的產(chǎn)品添加頁面，到Images板塊，如下圖所

示，一種是點擊右上角的Upload Image，彈出對話框，選擇本地圖片之后進行上傳。一次可以上傳多張圖片。也可以使用Drop files to Upload功能，直接選中本地需要上傳的產(chǎn)品圖片，拖放到Shopify后臺Images板塊區(qū)域進行上傳。

當且僅當Images板塊區(qū)域至少有一張圖片的時候，板塊的右上角按鈕就會由Upload Image

變?yōu)锳dd image from URL和Add images兩個按鈕。

Add images和之前的Upload images功能無異。Add image from URL則可以通過URL將你放在提供圖床服務(wù)的網(wǎng)站上的圖片導(dǎo)入到Shopify上. 如下圖，點擊Add image from URL之后， 會彈出對話框要求你輸入圖片的Direct URL （注意URL的結(jié)尾肯定是以圖片格式.jpg 或

者.png 或者.gif結(jié)尾的，否則會上傳失?。┹斎險RL之后點擊Add image, 就可以了. （此方法僅僅是個備用方法，有需要的話可以使用，在上傳速度上并沒有比上面兩種方法有多快）

第四種辦法就是通過批量上傳表格進行產(chǎn)品上傳的時候捎帶著進行圖片的上傳了。這個在這里就不贅述，在說到批量上傳方法的時候再說。

產(chǎn)品圖片上傳成功之后，就可以對圖片進行排序，預(yù)覽，編輯，添加Alt 或者刪除操作了。對圖片的操作都會自動保存并實時顯示在網(wǎng)站前臺，無需再點擊保存按鈕進行保存操作。

Images板塊的第一張大圖就是產(chǎn)品頁面的主圖MainImage了，如果你想使用其他圖片做主圖，只需要用鼠標將該圖片拖拽到主圖的位置就可以了。其他圖片也可以使用鼠標隨意拖動進行排序。

將鼠標移動到需要編輯的圖片上之后，在圖片下方會顯示四個編輯按鈕。預(yù)覽就是在當前彈出新的放大的窗口展示圖片。點擊編輯按鈕可以對圖片進行裁剪，縮放，旋轉(zhuǎn)，調(diào)色，調(diào) 光，添加文字等等操作，功能上還是蠻強大的，具體功能就不在這里贅述了，大家有時間自己探索吧。

點擊ALT就彈出來一個編輯圖片ALT的對話框了，在文本框中添加Image Alt Text然后點擊

Done按鈕進行保存就可以了. 最后一個垃圾桶圖標按鈕就是刪除鍵了。

相關(guān)文章

·企業(yè)自助建站靠譜嗎？自助建站安全嗎？

·深度解析：外貿(mào)B2B企業(yè)建站“攔路虎”

·Shopify 獨立站免費流量獲取方法

·Shopify主題：如何有效解決Shopify的主題問題

更多shopify教程、外貿(mào)推廣、谷歌SEM、谷歌SEO等相關(guān)教程盡在：gzxxmu