Shopify 給你的圖片上傳彈性比任何電商平台都高——5000×5000 像素、單檔 20MB、多種格式都支援。但這份自由也是陷阱。賣家把相機直出的原檔直接上傳，佈景主題把圖片裁成預期外的樣子，行動裝置訪客要等四秒才看到首屏圖，跳出率就這樣悄悄攀升。本文回答 Shopify 賣家關於產品圖片真正會問的十個問題——規格、佈景主題、效能、SEO 與款式——附上你做決定需要的具體數字。
Shopify 產品圖該用多大尺寸？
以 2048×2048 像素、正方形 上傳。這是 Shopify 官方文件列出的推薦母檔尺寸，所有主流佈景主題也都以此為基準設計。
| 圖片用途 | 建議尺寸 | 長寬比 | 為何採用此尺寸 |
|---|---|---|---|
| 產品圖（母檔） | 2048×2048 px | 1:1 | 支援縮放+Retina 顯示 |
| 產品圖（最小） | 800×800 px | 1:1 | 低於此尺寸縮放功能失效 |
| 分類圖 | 1024×1024 px | 1:1 | 佈景主題展示網格 |
| 首屏橫幅 | 1920×1080 px | 16:9 | 桌機滿版顯示 |
| 輪播 | 1600×500 至 1920×600 px | 3:1 至 4:1 | 依佈景主題而定 |
| Logo | 450×200 px | 約 2:1 | 頁首顯示 |
| Favicon | 32×32 px | 1:1 | 瀏覽器分頁 |
硬性上傳上限： 5000×5000 px、20MB。超出會被拒絕。但「可以上傳」和「應該上傳」是兩回事——參見下方檔案大小章節。
檔案多大才能確保網頁速度？
Shopify 官方建議的實務目標是單張產品圖 200–500KB，以行動裝置流量為主的網站則應更靠近 200–300KB。
為什麼重要：在 4G 行動網路下，圖片每多 100KB，載入時間約增加 150–300ms。一個 10 張圖、每張 2MB 的產品頁等於 20MB 的資料量——在較慢的行動網路上會變成 30 多秒的載入時間，Shopify 的遙測資料顯示這與購物車棄置率高度相關。
| 圖片大小 | 載入時間（4G） | 會發生什麼 |
|---|---|---|
| <200KB | <1 秒 | 快，幾乎感覺不到延遲 |
| 200–500KB | 1–2 秒 | 首屏/產品圖可接受 |
| 500KB–1MB | 2–4 秒 | 明顯延遲，跳出風險上升 |
| >1MB | >4 秒 | 行動裝置端大量跳出 |
Shopify 會自動壓縮並為支援瀏覽器提供 WebP 變體，但前提是你的原始檔已經優化過。你上傳一張 15MB 的 PNG，Shopify 會壓縮，但自動壓縮偏保守——上傳前先用 JPEG 品質 80–85 壓好效果會明顯更好。
該使用 JPEG、PNG、WebP 還是 SVG？
格式選擇取決於圖片類型。
| 格式 | 適用場合 | 避免場合 | 備註 |
|---|---|---|---|
| JPEG | 產品照、生活情境照 | 需要透明背景的圖 | 品質 80–85 為甜蜜點 |
| PNG | Logo、圖示、帶透明的資訊圖 | 照片（檔案過大） | 僅在需要 alpha 通道時使用 |
| WebP | 任何場合（若能匯出） | 舊版瀏覽器（2026 年已罕見） | 同品質下比 JPEG 小 25–35% |
| SVG | 圖示、Logo、簡單圖形 | 產品照 | 可無限縮放，檔案極小 |
| GIF | 動態演示（節制使用） | 其他任何場合 | 動畫改用 MP4/WebM |
Shopify 會自動向支援的瀏覽器提供 WebP，不論你上傳什麼格式——所以不用糾結上傳格式。重點在於原始檔是否高品質，以及是否在檔案大小目標內。產品攝影的安全預設為 JPEG 品質 85。
Shopify 一定要用正方形圖嗎？
不一定——但多數情況下你應該用。多數 Shopify 佈景主題預設使用正方形展示網格，非正方形上傳會被裁切。如果佈景主題預期 1:1 而你上傳 4:3，產品上下可能被切掉，或圖片浮在留白框內，和其他圖放在一起顯得不一致。
正方形適用於： 預設產品網格、分類頁、搜尋結果、相關產品輪播。這涵蓋 90% 的場景。
什麼時候可以選直式（3:4 或 4:5）： 專注全身模特穿搭的時裝店，垂直構圖很重要時。這需要專為直式長寬比設計的佈景主題（Dawn 透過佈景主題設定、Impact、Impulse）——不要把直式強塞進預設正方形的佈景主題。
什麼時候適合橫式（16:9）： 首屏橫幅、作為輔圖的生活情境氛圍照。千萬不要作為正方形網格佈景主題的主產品圖。
安全流程：拍攝時比需要構圖更寬，裁成 2048×2048 正方形當產品母檔，再做 2048×2048 的不同角度款式圖。橫式構圖只用在橫幅和輪播。
Shopify 佈景主題如何影響圖片顯示？
每個佈景主題裁切與縮放圖片的方式都不同——這是「我的照片在網站上看起來很糟」抱怨最常見的根源。敲定圖片規格前，務必在你實際使用的佈景主題內測試。
| 佈景主題 | 產品頁裁切 | 分類網格 | 備註 |
|---|---|---|---|
| Dawn（Shopify 預設） | 可設定（正方、直式、橫式、原比例） | 與產品頁設定一致 | 最有彈性 |
| Debut | 強制正方 | 正方 | 嚴格 1:1 顯示 |
| Impact | 對直式友善 | 可設定 | 為時裝優化 |
| Motion | 滿版、由佈景主題控制 | 卡片風格 | 動畫效果多 |
| Minimal | 置中帶留白 | 正方 | 非正方圖會加白邊 |
實務測試： 上傳後，在桌機與手機上分別檢視產品頁與分類頁。若產品裁切看起來不對，從原始圖片下手修——不要靠佈景主題 CSS 調整，佈景主題更新會把這些調整洗掉。
與 Amazon、eBay 相比如何？
若你從同一套產品圖庫在多個平台銷售，各家規格的差異相當關鍵。
| 規格 | Shopify | Amazon | eBay |
|---|---|---|---|
| 建議尺寸 | 2048×2048 px | 2000×2000 px | 1600×1600 px |
| 最小尺寸 | 800×800 px | 1000×1000 px（支援縮放） | 500×500 px |
| 最大尺寸 | 5000×5000 px、20MB | 最長邊 10000 px | 7MB |
| 長寬比 | 依佈景主題靈活 | 必須 1:1 | 建議 1:1 |
| 背景 | 自選 | 純白（主圖） | 乾淨即可，不強制白色 |
| Logo/浮水印 | 允許 | 主圖禁止 | 主圖不允許 |
| 文字疊加 | 允許 | 主圖禁止、副圖允許 | 主圖受限 |
| 檔案格式 | JPEG、PNG、WebP、GIF、SVG | JPEG、PNG、TIFF、GIF | JPEG、PNG、GIF、BMP、TIFF |
實務含義： 一張符合 Amazon 規範的圖（2000×2000 純白、無文字）在各處都能用，但在 Shopify 顯得過於「乾淨」——Shopify 上生活情境圖與資訊圖的轉換效果更好。圖庫建構方式：以 2048×2048 乾淨背景的母檔為基礎，再疊加各種款式圖。
SEO 的 alt 文字該怎麼寫？
alt 文字服務三類受眾：螢幕閱讀器、Google 圖片搜尋，以及圖片載入失敗時的替代文字。為前兩者寫——第三者自然就顧到了。
良好 alt 文字公式： [產品名稱] [關鍵描述] [相關情境]
| 圖片類型 | 弱 alt 文字 | 強 alt 文字 |
|---|---|---|
| 主產品圖 | "white mug" | "White ceramic coffee mug 12oz with matte finish" |
| 顏色款式 | "red version" | "Red ceramic coffee mug 12oz matte finish" |
| 生活情境照 | "mug on table" | "White ceramic mug on wooden breakfast table with morning coffee" |
| 細節圖 | "close up" | "Matte white ceramic mug close-up showing handle texture" |
| 資訊圖 | "diagram" | "Coffee mug dimensions infographic showing 3.5 inch height and 4 inch diameter" |
原則：
- 控制在 125 字元以內（螢幕閱讀器超過此長度會截斷）
- 自然融入主要關鍵字，不要塞關鍵字
- 描述圖中實際呈現的內容，別照抄產品標題
- 同一產品的每張圖使用不同 alt 文字（不要重複）
- 省略「image of」或「photo of」等開頭——輔助科技會自動加上
款式圖（顏色、尺寸、樣式）怎麼處理？
Shopify 允許為特定產品款式指派圖片。多數店家在這裡做得不夠到位。
最低可用配置： 每個顏色款式至少一張顯示該顏色的圖。這是顧客的預期——點「紅色」就該看到紅色產品，不是白色。
時裝與居家類的進階配置：
- 主款式圖：所有顏色相同角度、相同打光、相同構圖（方便視覺比較）
- 生活情境圖：使用中的產品，顏色與款式相符
- 細節圖：特寫精準呈現顏色/紋理
尺寸款式通常不需單獨圖片，除非產品在不同尺寸下外觀明顯不同（例如小包 vs 大包比例不同）。服飾方面，一套模特圖加上一張尺寸表就夠了。
色彩準確至關重要： 買家期望款式圖與螢幕顯示一致。若你的攝影棚打光導致偏色，上傳前就要校正。顏色款式的「圖實不符」是顏色相關退貨的主因。
網頁速度與圖片大小真的會影響轉換嗎？
會，可量化。Google Core Web Vitals 資料與電商基準研究一致顯示：
- LCP（最大內容繪製）低於 2.5 秒： 良好排名的基準
- LCP 介於 2.5–4 秒： 互動指標明顯下滑
- LCP 超過 4 秒： 行動裝置跳出率大幅上升
首屏產品圖通常就是產品頁的 LCP 元素。每減少 500KB，行動裝置 4G 下的 LCP 通常會下降 200–500ms，累加在整段工作階段影響相當可觀。
| 網頁速度改善 | 典型轉換效果 |
|---|---|
| 1 秒 → 2 秒 | 基準，無效果 |
| 3 秒 → 2 秒 | 轉換 +3–7% |
| 5 秒 → 2 秒 | 行動裝置轉換 +10–15% |
| 8 秒 → 3 秒 | 行動裝置轉換 +25–30% |
這就是為什麼 200–500KB 的檔案大小目標比感覺上更重要。10 張 500KB 的圖是 5MB 的頁面；10 張 2MB 則是 20MB——差距對每位行動裝置訪客都是明顯有感。
上傳前檢查清單
新增圖片到任何產品前，跑一次：
- 母檔尺寸為 2048×2048 像素（多通路銷售則為 2000×2000）
- 正方形長寬比與佈景主題預設網格相符
- 以 JPEG 品質 80–85 匯出（或 WebP 品質 80）
- 單張檔案大小介於 200–500KB
- 檔案名稱具描述性：
product-name-color-angle.jpg（而非IMG_4821.jpg） - 每張圖撰寫 alt 文字，控制在 125 字元內
- 顏色與實物相符（在校準螢幕上確認）
- 款式圖在 Shopify 後台正確指派
- 上傳後在桌機與手機上都預覽過
- 在實際使用的佈景主題內測試過裁切效果
FAQ
Shopify 會自動壓縮我的圖片嗎？
會。Shopify 會提供 CDN 最佳化版本，通常對支援的瀏覽器提供 WebP，並依視窗大小適配。但壓縮是在你上傳的檔案上再做有損壓縮——事先優化過的原始檔永遠比依賴自動壓縮效果更好。
我可以在 Shopify 和 Amazon 使用相同產品圖嗎？
主產品圖可以——一張 2000×2000 純白背景的圖兩邊通用。副圖通常需要分開製作：Amazon 禁止主圖出現 Logo 與大部分文字疊加，對副圖規則也較嚴；Shopify 則完全開放創意。按通路分資料夾標記管理。
首頁 Hero 橫幅的理想尺寸是多少？
1920×1080 像素是安全預設。部分佈景主題支援 2400×1200 的超寬顯示。務必另備行動裝置最佳化裁切（1080×1080 或 1080×1350）——手機使用者應該看到聚焦產品的緊湊裁切，而不是桌機橫幅中間切出的一條。
每個產品該有多少張圖？
多數類別七到八張是甜蜜點：1 張白底主圖、2–3 張其他角度、1–2 張生活情境/使用中、1 張比例/尺寸參考、1 張資訊圖。少於四張意味著商品頁不完整；超過十張通常只會增加雜訊，不會拉升轉換。
我的產品圖在手機上為何模糊？
常見三種原因：(1) 原圖低於 2048px 被拉伸；(2) 原始檔過大，佈景主題提供了過度壓縮的版本；(3) 手機 Retina 螢幕與桌機呈現不同——桌機看起來銳利的圖，在 3 倍像素密度的手機螢幕上會顯軟。解法：上傳銳利的 2048×2048 原始檔，讓 Shopify 自行處理縮小。