電商商品攝影與商品圖規格指南：主圖、情境圖、影片到圖片 SEO 一次搞懂

在實體店，顧客會拿起商品翻看、摸材質、比大小；在網路上，這些動作全部只能透過照片完成。商品攝影拍得好不好，直接決定顧客能不能放心下單，也影響退貨率：照片看起來比實物大、顏色偏差太多，收到貨的失望就會變成退貨與負評。

很多台灣中小品牌的商品圖，是供應商給的去背圖加上幾張手機隨手拍。這篇文章整理 Baymard Institute 的商品圖研究、Shopify 官方的攝影指南，以及 Google Search Central 與 Merchant Center 的圖片規範，說明一組完整的電商商品圖應該包含哪些類型、尺寸格式怎麼訂，以及怎麼讓圖片在 Google 上被找到。

商品圖為什麼這麼關鍵

Baymard Institute 的測試觀察到，56% 的受測者進入商品頁後的第一個動作，就是瀏覽商品圖片；另有 42% 的使用者會試著從圖片判斷商品的整體大小（Baymard，2017）。換句話說，顧客把照片當成「檢查商品」的工具，而不只是好看的裝飾。

Baymard 2026 年的商品頁評比也發現，仍有 37% 的網站沒有提供能看出商品尺寸比例的圖片，23% 的網站沒有為服飾、配件、彩妝等穿戴類商品提供真人模特兒圖。這些缺口，正是中小品牌可以用心補上、做出差異的地方。

一組完整的商品圖要拍哪些？

Baymard 早在 2012 年就整理出電商常見的商品圖類型，Shopify 的攝影指南也有類似的分類。綜合起來，一個商品建議準備以下幾種圖：

如果預算有限，Baymard 建議優先為熱銷商品與主力品類補齊比例圖與細節圖，再逐步擴大到其他商品。

主圖：乾淨、清楚、一致

主圖的任務是讓顧客在列表頁一眼認出商品。Shopify 稱白背景照片是電商攝影的主力，許多電商平台也要求主圖使用白色背景。主圖拍攝時要注意：

• 同一店內所有主圖的角度、留白比例、背景顏色一致，列表頁才會整齊。
• 商品佔畫面大部分，但不要切到邊緣。Google Merchant Center 的建議是讓商品約佔圖片的 75%–90%。
• 不要在主圖加上促銷文字、價格、浮水印或邊框，這些在 Google 購物廣告與免費商品資訊中是不允許的。

情境圖：讓顧客想像擁有的樣子

情境圖示範商品在生活中的樣子，例如保溫瓶掛在背包側邊、香氛蠟燭放在臥室床頭。情境圖同時能交代尺寸比例，一張圖達成兩個目的。台灣品牌可以選用在地感的場景，例如通勤捷運、辦公桌、租屋小套房，更能讓目標顧客產生共鳴。

拍攝設備與流程：不一定要花大錢

Shopify 的攝影指南指出，智慧型手機就足以拍出可用的商品照，構圖、光線與後製比相機本身更重要。基本配備建議：

• 三腳架：讓每張照片的角度一致，也能避免手震。
• 光源：靠窗的自然側光是最省錢的選擇，搭配白色窗簾或描圖紙柔化光線。
• 背景：白色背景紙或從桌面延伸到牆面的無接縫背景。
• 反光板：白色紙板就能把光補進陰影處。

Shopify 也提醒，白背景拍出來偏灰時，可以稍微過曝約 1 到 1.5 格。如果商品數量多，建議建立一份「拍攝規範」，記錄相機位置、燈光配置、背景與後製參數，之後新品上架就能維持一致的風格。

假設情境：手工皂品牌的拍攝規劃

假設一家賣手工皂的小品牌，每月上架 5 款新品，可以這樣規劃：每款拍一張白背景主圖、一張手持比例圖、一張切面特寫展示質地、一張浴室情境圖，以及一張包裝圖。用同一組三腳架位置與燈光，一個下午就能完成當月所有商品的拍攝。

商品圖規格：尺寸、比例與格式

各平台規格不同，以下是查詢時（2026 年 10 月）的官方建議，實際以各平台最新公告為準：

尺寸夠大是為了支援放大，但檔案太大會拖慢網頁。上傳前務必壓縮，並讓網站依裝置尺寸提供不同大小的圖片。商品圖通常是商品頁最重的資源，速度優化可參考網站速度優化。

商品影片與 360 度展示

影片適合以下情況：需要示範操作（例如料理機、收納用品）、材質會動（例如洋裝的垂墜感）、或需要展示組裝前後的變化。Baymard 的研究提醒，很多使用者會略過影片，因此影片應該是照片的補充，比例圖與細節圖仍然不能少。

影片建議控制在短時間內呈現重點、預設靜音、加上字幕，並提供清楚的縮圖，讓顧客知道點開會看到什麼。

圖片 SEO：讓商品圖在 Google 上被找到

Google 圖片與購物版面都是商品被發現的管道。依 Google Search Central 的圖片 SEO 說明，重點如下：

• 使用標準的 img 元素：Google 不會為 CSS 背景圖片建立索引，商品圖要用一般的圖片標籤呈現。
• 替代文字（alt）最重要：描述圖片內容，例如「深藍色 28L 防潑水登山背包側面」，不要堆砌關鍵字。替代文字同時也幫助視障使用者理解圖片。
• 檔名要有意義：用「navy-hiking-backpack-28l.jpg」取代「IMG_0231.jpg」。
• 圖片放在相關文字附近：商品圖旁邊就是品名與描述，讓 Google 理解圖片脈絡。
• 回應式圖片：使用 srcset 或 picture 提供不同尺寸，並保留一般的 src 作為備援。
• 結構化資料要包含圖片：商品結構化資料中的 image 屬性要填寫，才有機會在搜尋結果中顯示商品圖。實作可參考結構化資料與複合式搜尋結果。
• 圖片 Sitemap：圖片放在 CDN 或其他網域時，可以用圖片 Sitemap 協助 Google 找到。

常見問題

可以直接用供應商或原廠提供的商品圖嗎？

可以作為基礎，但要先確認有使用授權。另外，原廠圖通常很多店家都在用，難以做出差異，建議至少補拍比例圖、細節圖或情境圖。

用 AI 生成或修改商品圖可以嗎？

可以用來去背、調整背景或製作情境圖，但商品本身的外觀、顏色、尺寸必須和實物一致。過度修飾可能讓顧客收到商品時覺得與照片不符，增加退貨與客訴。

手機拍的照片夠用嗎？

對多數中小品牌來說夠用。關鍵在於穩定的光線、乾淨的背景、固定的角度與一致的後製。需要大量拍攝或高單價商品時，再考慮委託專業攝影。

一個商品要放幾張圖？

沒有固定數字，原則是讓顧客不用問就能看清楚商品。一般建議至少包含主圖、多角度、比例圖與細節圖；服飾類通常需要更多，例如正面、背面、側面與穿搭圖。

結語：讓照片代替顧客的眼睛與雙手

商品攝影的目標，是讓顧客在螢幕前就能看清楚、看懂大小、感受質地，並想像自己使用的樣子。先為熱銷商品補齊比例圖與細節圖，再建立固定的拍攝規範與圖片 SEO 流程，就能逐步提升整體商品頁品質。商品圖在商品頁中如何搭配其他資訊，可以延伸閱讀商品頁設計檢查清單；電商網站的完整規劃，則可參考電商網站架設完整指南。

如果你正在規劃新的購物網站或改版商品頁，網軍行銷的電商網站建置服務可以協助訂定商品圖規格與版面呈現方式。

參考資料

• Baymard Institute，UX: 7 Types of Product Images：https://baymard.com/blog/ux-product-image-categories
• Baymard Institute，Product Page UX: Provide at Least One "In Scale" Image：https://baymard.com/blog/in-scale-product-images
• Shopify，Ecommerce Photography: A Complete Guide：https://www.shopify.com/blog/ecommerce-photography
• Shopify，Product Photography: A DIY Guide for Beginners：https://www.shopify.com/blog/12206313-the-ultimate-diy-guide-to-beautiful-product-photography
• Google Search Central，Google Images SEO best practices：https://developers.google.com/search/docs/appearance/google-images
• Google Merchant Center Help，Image link [image_link]：https://support.google.com/merchants/answer/6324350