如何為電子商務產品頁面優化圖片 | Bulk Image Compressor
產品圖片能促成銷售。如果購物者無法清楚看到細節,他們就不會購買。但如果你的圖片太大而頁面載入緩慢,他們在圖片載入完成之前就離開了。取得這個平衡是你可以為線上商店做的最實用的事情之一。
好消息是你不必在品質和速度之間做出選擇。使用正確的壓縮設定和格式,你的產品照片可以在螢幕上看起來銳利,同時在任何裝置上快速載入。
為什麼產品圖片大小很重要
一個典型的產品頁面有 4 到 8 張圖片:主照片、幾個角度、可能一張細節特寫,以及一張展示產品使用情境的生活風格圖片。如果每張都是來自攝影師的未壓縮 4MB 檔案,那就是每個頁面 16 到 32MB 的圖片。
緩慢的產品頁面直接損害銷售。Deloitte 的研究發現,行動網站速度每改善 0.1 秒,零售網站的轉換率就會增加 8.4%。對電子商務來說,頁面速度的最大因素幾乎總是圖片。
還有行動因素。大多數線上購物發生在手機上。你的產品圖片需要在蜂窩網路連線上快速載入,而不僅僅是快速的 Wi-Fi。
白背景照片 vs 生活風格照片
這兩種產品圖片類型有不同的壓縮特性。
白背景產品照片 是你在 Amazon、eBay 和大多數產品清單頁面上看到的。它們通常有乾淨的白色背景,產品在中間。這些圖片壓縮效果非常好,因為大面積的純白區域需要的資料非常少。你通常可以將這些壓縮到 75% 到 80% 的 JPEG 品質,幾乎看不出差異。
生活風格照片 在真實世界場景中展示產品。廚房流理台上的咖啡杯、戶外模特兒身上的夾克、城市人行道上的鞋子。這些圖片具有更多的視覺複雜性,背景多變、有紋理和光影。它們需要稍高的品質設定,大約 80% 到 85%,以保持細節。
兩種型別都可以比原始檔案小得多。一張 5MB 的白背景產品照片通常可以壓縮到 200 到 400KB。一張 6MB 的生活風格照片可以壓縮到 300 到 600KB。
平台要求和建議
不同的電子商務平台有自己的圖片指南。以下是主要平台的規格:
Shopify 建議使用 2048 x 2048 像素的圖片。最大檔案大小為 20MB,但他們強烈建議將圖片保持在該數值以下。Shopify 會進行一些自動壓縮,並在瀏覽器支援時提供 WebP,但從優化的圖片開始會獲得更好的結果。
WooCommerce 沒有強制嚴格限制,因為它執行在你自己的主機上。這意味著圖片優化完全是你自己的責任。預設的縮圖大小為 600 x 600(用於目錄),產品頁面使用完整圖片大小。你應該在上傳前調整尺寸和壓縮。
Amazon 要求最長邊至少 1000 像素(用於縮放功能),並建議 2000 像素。最大檔案大小為 10MB。主要圖片必須有純白色背景(RGB 255, 255, 255)。Amazon 會在他們那邊壓縮圖片,但上傳已經優化的圖片讓你對最終結果有更多控制。
Etsy 建議最短邊 2000 像素。他們接受最大 1MB 的檔案。由於 Etsy 的限制相對較小,你幾乎肯定需要在上傳前進行壓縮。
建議的尺寸和檔案大小
對大多數電子商務平台來說,以下是實用的目標:
| 圖片類型 | 尺寸 | 目標檔案大小 |
|---|---|---|
| 主要產品照片 | 2000 x 2000px | 200 到 400KB |
| 其他角度 | 2000 x 2000px | 200 到 400KB |
| 細節 / 縮放照片 | 2000 x 2000px | 250 到 500KB |
| 生活風格照片 | 2000 x 1333px | 300 到 600KB |
| 縮圖 | 600 x 600px | 30 到 60KB |
這些尺寸為縮放功能提供了足夠的解析度,同時保持頁面快速。每個產品頁面的總圖片載入量理想情況下應保持在 2MB 以下。
選擇正確的格式
JPEG 是產品攝影的標準。它處理照片效果很好,到處都受支援。將其作為你的預設格式。
WebP 在相同視覺品質下提供比 JPEG 好約 25% 到 35% 的壓縮。如果你的平台支援(Shopify 自動支援,WooCommerce 需要插件),WebP 是一個可靠的升級。想深入了解格式比較,請閱讀我們的 JPEG vs PNG vs WebP 指南。
PNG 只在你的產品圖片需要透明度時才需要。例如,如果你銷售需要在沒有任何背景的情況下顯示的商品,PNG 可以保留透明度。否則,避免對產品照片使用 PNG,因為檔案大小要大得多。
產品目錄的批次處理
如果你的商店有數十或數百個產品,一次壓縮一張圖片是不現實的。一個有 200 個商品、每個商品 5 張圖片的產品目錄意味著要處理 1,000 張圖片。
這就是批次壓縮可以節省數小時的地方。使用 Bulk Image Compressor 你可以放入整個產品圖片資料夾,一次全部壓縮。所有處理都在你的瀏覽器中執行,因此你的產品照片永遠不會上傳到任何外部伺服器。當你處理尚未發布的產品或不希望在發布前分享的圖片時,這很重要。
以下是適用於產品目錄的工作流程:
-
先調整尺寸。 將所有圖片調整到正確的尺寸(對大多數平台來說是 2000 x 2000px)。不要在壓縮時發送 6000px 的圖片,而它們只會以 2000px 顯示。
-
按類型分類。 將白背景照片放在一個批次中,生活風格照片放在另一個批次中。這樣你可以對每種使用不同的品質設定。
-
以 75% 到 80% 品質壓縮白背景照片。 乾淨的背景在較低設定下壓縮效率很高。
-
以 80% 到 85% 品質壓縮生活風格照片。 這些圖片中的額外細節受益於稍高的品質。
-
抽樣檢查幾個結果。 打開一些壓縮後的圖片,與原始圖片進行比較。確保包裝上的文字仍然可讀,產品細節清晰。更多相關資訊,請參閱我們的指南 如何在保持品質的同時減少檔案大小。
-
上傳到你的平台。 用壓縮後的版本替換原始檔案。
對你的利潤的影響
更快的產品頁面意味著更多的銷售。就是這麼直接。當購物者從搜尋結果或廣告點擊你的產品時,你大約有兩到三秒鐘的時間,他們就會決定是等待還是按下返回按鈕。
優化的圖片還能減少你的主機和 CDN 成本。如果你每月服務 500,000 次產品頁面瀏覽,並將平均圖片傳輸量從每頁 8MB 減少到 1.5MB,那就是節省了 TB 級的頻寬。
你的產品照片是線上商店中最重要的資產。正確壓縮它們可以讓你保持購物者所需的視覺品質,同時提供能真正促成交換的快速體驗。
Ready to compress your images?
Bulk compress JPEG, PNG, WebP, and AVIF images right in your browser. No uploads, no sign-ups.
Try Bulk Image Compressor