Shopify最全的圖片優化經驗總結,請看這里！

? ? ? ?用戶在購物時第一眼看到的是網站產品的圖片，然后是產品的標題、價格。在行業上有這么一句說法：“做跨境電商的產品，其實就是賣圖片。”所以做好圖片的優化是一個網站比較緊急的任務。圖片優化有兩方面，第一，在保證圖片質量的前提下盡可能的壓縮圖片大小來提升網站的加載速度，進而縮短網站打開時間。第二，增加谷歌或者bing能更多收錄我們產品圖片，為我們帶來更多優質瀏覽。接下來從圖片正確命名、壓縮圖片大小、圖片類型選擇、ALT屬性優化、使用圖片sitemap五方面來做圖片優化。

一、圖片正確的命名

根據shopify官方給圖片的定義：創建描述性的、關鍵字豐富的文件名。搜索引擎不僅會抓取您網頁上的文本，還會在您的圖像文件名中搜索關鍵字。

舉個例子，我從anker的亞馬遜店鋪里下載的一張產品圖片，圖片的默認名字是71AAIEEX6ZL._AC_SL1500_.jpg，我們需要在電腦上給已經下載好的圖片進行命名：Anker-Fast-Charging-For-the-iphone-13-Series。

溫馨提示：在圖片命名的時候，單詞之間的空格請使用“-”代替，否則圖片上傳到服務器之后，空格會被%20替換。

普及一下：提取網頁圖片的1個谷歌APP工具

• Fatkun：圖片批量下載

二、在保證圖片的質量情況下壓縮圖片大小

???????在谷歌的排名算法中，網站打開速度是獲得高排名的重要因素之一。你也許聽說過，如果一個受眾在3秒鐘沒打開網站，50%的概率會離開網站，因此網站加載速度的時間是很重要的，而圖片的大小是網站加載速度的重要影響因素之一。

???????從一組數據來看，知名大賣https://www.aukey.com//的一張圖片僅僅36.32kb，圖片非常高清，我隨機打開了一個網站https://hedorance.com圖片大小為223kb，圖片相對模糊。之前我也瀏覽過很多網站的圖片3-4MB,當時有強迫癥的我真的想聯系這個網站給他點建議，可惜當時沒聯系上。

???????對于Shopify的圖片來說，一張圖片的大小能壓縮在70kb以下就完美了。強烈推薦一個工具-Tingpng,（https://tinypng.com），這是我使用了5年的壓縮圖片大小工具，圖片壓縮前后的效果幾乎沒差別，超實用，也是其他的工具無法替代的。我之前也用過其他工具，非常不好用，就不推薦了。

三、圖片類型的選擇

??????常見的圖片文件類型有JPG,GIF和PNG.

• JPG是Shopify最常見的圖片也是最佳選擇，以最小的文件大小提供最佳的質量。

• PNG圖片非常小，可以用于LOGO和裝飾性的圖片（背景圖，按鈕和邊框）。

• GIF更多用于生動的展示動畫，通常在爆品網站中展示，在使用前請壓縮。

?

四、優化ALT文本屬性

1.?ALT文本是什么和作用

ALT文本，俗稱可替代性文本，在?HTML?代碼中用于描述頁面上圖像的外觀和功能。

作用有兩方面：

第一，當圖片無法顯示時，將顯示替代文本來替代圖片。

第二，替代文本為搜索引擎提供更好的圖像上下文/描述，幫助他們正確索引圖像。

?

2.?我如何寫出好的替代文本？

谷歌官方案例參考

效果欠佳（缺少替代文本）：<img?src="puppy.jpg"/>

效果較佳：<img?src="puppy.jpg"?alt="puppy"/>

效果最佳：<img?src="puppy.jpg"?alt="Dalmatian?puppy?playing?fetch"/>

從谷歌案例參考，得出以下3點結

• 盡可能具體地描述圖像。

• 植入產品關鍵詞，alt文本提供了一個包含關鍵詞的位置，因此要充分利用好它。

• 避免堆砌關鍵詞

  
  

五、使用圖片sitemap

通過Search?Console將shopify店鋪的網站地圖（?eg:??www.shopify.com/sitemap.xml?）提交給Google站長工具。

方法：

• 注冊Google站長工具：https://developers.google.com/search
• 網址前綴的方式驗證網站所有權（內容太多，需要了解請私信我)
• 提交Shopify店鋪的站點地圖(?www.shopify.com/sitemap.xml?)，提交成功后，就等待谷歌抓取。

???我喜歡原創，這篇文章是經過很久時間準備才寫出來的。后期會有更多關于圖片優化的想法時，我會及時分享和完善。關注我，每日分享干貨！

越分享越快樂！

微信：klayjiang11

公眾號：shopify老手說