Shopify product image optimization in 2026 — specs, SEO, and Core Web Vitals
2026 Shopify image specs, WebP vs JPEG vs PNG, alt-text formulas, Core Web Vitals impact, and how AI-generated product photos plug into your variant image workflow without breaking page speed.
Shopify will serve your image at whatever quality you give it, but Google's Lighthouse score, your conversion rate, and your Google Shopping placement all depend on whether you gave it the right one. This is the 2026 spec sheet.
Shopify's documentation lists technical maximums but does not tell you what to actually ship. The numbers below are the targets our agency uses across roughly two hundred active Shopify stores. They are tuned for the intersection of brand polish, mobile speed, and Google Shopping eligibility.
The 2026 Shopify image specs cheat-sheet
- Master size: 2048×2048 square is the conversion sweet spot — sharp on 4K monitors, sane on mobile.
- Aspect ratio: 1:1 for PDP gallery, 4:5 for collection thumbnails, 16:9 for Instagram/Pinterest cross-posts. Generate all three from one source.
- File size target: under 500 KB. Above that, mobile LCP suffers (more below).
- Maximum dimensions: 4472 × 4472 — Shopify will reject above this.
- Maximum file size on upload: 20 MB.
WebP vs JPEG vs PNG — what Shopify actually serves
Upload PNG or JPEG; Shopify's CDN automatically generates and serves WebP variants to compatible browsers (every browser shipped after 2021). You should not pre-convert to WebP yourself — Shopify's CDN is smarter about per-image quality settings than most local tools, and pre-WebP uploads sometimes confuse the CDN's transformation cache. The exception: PNG for transparent backgrounds (alpha channel). Use PNG only where transparency matters.
Core Web Vitals — the image dimension that affects SEO
Google's Core Web Vitals — LCP (Largest Contentful Paint), CLS (Cumulative Layout Shift), and INP (Interaction to Next Paint) — are ranking signals. On a Shopify PDP, the hero image is almost always the LCP element. A slow-loading hero pulls down your search rank directly.
- 01Set fetchpriority='high' on the hero <img>. Most Shopify themes shipped after late 2024 do this automatically — verify in Lighthouse.
- 02Preload the hero in the theme's <head> with <link rel='preload' as='image'>. This shaves 200–600 ms off mobile LCP.
- 03Specify width and height on every <img>. Prevents CLS — Shopify's image_tag helper does this by default.
- 04Lazy-load every image below the fold. loading='lazy' on the <img>; Shopify's image_tag handles this when you pass loading: 'lazy'.
- 05Serve responsive widths with srcset — let mobile devices download the 750-px variant instead of the 2048-px master.
Alt text — the underused SEO multiplier
Shopify reads alt text into structured product schema, accessibility tools, and Google Image search ranking. Most stores ship empty alt text or duplicate the product title across every image. The formula that wins is: '[Primary keyword] [angle/context] on [background]'. Examples: 'Hammered copper hoop earrings, side profile on linen'; 'Lavender shampoo bottle, label macro on ivory'; 'Oak dining chair, 45 degree editorial in lifestyle scene'. Three to twelve words. Different alt text per image.
Variant images — the Shopify-only quirk
Shopify lets you assign one image per variant. When a buyer changes the colour drop-down, that image swaps into the gallery. Most stores upload one variant image (the front-facing colour swap) and leave the rest of the gallery static. The high-converting setup: assign a different hero image per variant, but generate every variant from the same source photograph using AI colourway generation. This way the buyer sees the right colour in the right gallery, and your photographer only shot the master once. See our colourway playbook for the workflow.
Google Shopping feed compatibility
Shopify's Google channel app pushes your product images to Google Merchant Center. The feed-eligibility rules are stricter than Shopify's display rules: minimum 250 × 250, recommended 1200 × 1200, no watermarks, no text overlays in the primary image, no promotional badges. Use the gallery hero (untouched product on neutral background) as the Merchant Center 'image_link' and reserve marketing overlays for an 'additional_image_link'. AngleForge's Google Shopping preset generates the right pair automatically.
IPTC and C2PA metadata — Shopify's silent upgrade
Since 2024, Google has surfaced IPTC metadata in image search results. Since 2026, EU AI Act compliance requires C2PA content credentials on AI-generated imagery. Shopify's CDN now preserves IPTC and C2PA metadata through its transformation pipeline (it strips them on older themes — confirm in your theme's image_tag implementation). Tools that write metadata: AngleForge (both, default), Adobe (both), Pebblely (C2PA only), Photoroom (both). Tools that don't: most generic AI image generators. Use one that does.
File naming conventions that compound
Shopify stores the uploaded filename and uses it in the asset URL. Google reads URLs for context. Three rules: use lowercase hyphenated names with the primary keyword and angle suffix (`hammered-copper-earrings-side.jpg`); never use Shopify's auto-generated random hashes; standardise across the catalog so similar SKUs sort together in the admin.
"We renamed every image in a 600-SKU catalog over a weekend. Google Image traffic doubled the following quarter. Nothing else changed."
A 30-minute Shopify image audit
- 01Run any PDP through PageSpeed Insights mobile. Note the LCP element and time.
- 02Open the LCP image directly. Is it served as WebP? Is the file size under 500 KB? Is the resolution appropriate (i.e. you're not shipping a 4K image to a 320-pixel mobile slot)?
- 03View source on the PDP. Confirm width / height are set on the hero, fetchpriority='high' is present, and lazy-loading is on for below-the-fold images.
- 04Open the Liquid image_tag in your theme. Confirm it generates srcset with at least three breakpoints (375, 750, 1500).
- 05Audit alt text on a sample of ten products. Anything empty, duplicated, or template-default is a fix.
- 06Open Google Merchant Center → Diagnostics. Image-related warnings are silent demotions of your Shopping ads.
Where AngleForge fits in a Shopify pipeline
Generate variant and angle images in batch with AngleForge's Shopify preset. The preset outputs 2048-square masters with embedded IPTC and C2PA metadata, named by SKU and angle. Upload through Shopify's bulk media import or Matrixify if you run thousands of SKUs. The conversion-side wins compound: faster catalog cycles, consistent variant imagery, and metadata that future-proofs you against Google's image-search and AI-Act-driven preferences.