Perché le tue immagini Shopify affossano la conversione
Su una scheda prodotto Shopify media, le immagini rappresentano il 60-80 % del peso totale della pagina. Ogni secondo guadagnato nel caricamento vale circa il 4-7 % in più di tasso di conversione (fonte: studio Deloitte Milliseconds Make Millions, 2020).
Il problema classico:
- Il tema accetta un’immagine sorgente in JPG 4000×3000 (8 MB).
- Shopify la ridimensiona lato CDN ma mantiene il formato in ingresso.
- Il visitatore mobile scarica un JPG da 350 KB dove basterebbe un WebP da 90 KB — per un risultato visivo strettamente identico.
Su 20 prodotti × 5 immagini per scheda, sono oltre 25 MB trasferiti inutilmente per sessione.
Le tre leve da azionare
1. Convertire le sorgenti in WebP (o AVIF)
Il formato WebP offre in media il 30 % di peso in meno rispetto a un JPG equivalente a parità di qualità percepita. L’AVIF scende ancora più in basso (fino a -50 % rispetto al JPG) ma il suo supporto resta imperfetto su alcuni browser datati.
Regola pratica: carica i tuoi master in WebP qualità 82-88. È il punto ideale tra peso e fedeltà cromatica.
2. Calibrare la dimensione reale di visualizzazione
Inutile servire un’immagine 2400×1800 se viene mostrata a 600×450 nel tema. Per la maggior parte dei temi Shopify (Dawn, Sense, Refresh):
| Posizione | Larghezza nativa consigliata |
|---|---|
| Hero homepage | 1920 px |
| Carosello prodotto | 1200 px |
| Miniatura collezione | 600 px |
| Immagine blog | 1200 px |
3. Attivare il loading="lazy" ovunque fuori dal fold
Shopify lo aggiunge per impostazione predefinita sui temi recenti, ma
controlla le tue sezioni personalizzate (Liquid) — un <img> senza
questo attributo blocca l’LCP.
Il workflow concreto in 4 passaggi
- Verificare: Lighthouse → scheda Opportunities → “Serve images in next-gen formats”.
- Preparare un batch delle foto prodotto in
.jpgad alta risoluzione. - Convertire l’intero lotto in WebP con MediaBay — trascina e rilascia, formato di uscita WebP, qualità 85, dimensione max 1200 px.
- Ricaricare su Shopify (admin → File, o direttamente nella scheda prodotto). Il CDN Shopify servirà poi la dimensione giusta in base al viewport.
Caso reale: -1,8s sull’LCP di uno shop di moda
Su uno shop cliente (catalogo ~40 referenze):
- LCP prima: 3,2 s (4G mobile)
- LCP dopo la conversione in batch in WebP: 1,4 s
- Peso medio di una scheda prodotto: 2,8 MB → 720 KB
Il beneficio SEO è immediato: dal 2023 Google penalizza le pagine il cui LCP supera i 2,5 s.
E la riservatezza delle tue immagini?
Molti strumenti di conversione online inviano le tue immagini ai loro server — rischio GDPR se le tue foto contengono persone, prototipi riservati o semplicemente il tuo catalogo prima del lancio.
MediaBay converte al 100 % in locale nel tuo browser, tramite WebAssembly. Nessun caricamento, nessuna memorizzazione lato server. Verificabile nella scheda Rete dei DevTools.
TL;DR
- Converti i tuoi JPG in WebP qualità 85, dimensione max 1200 px sulla larghezza prodotto.
- Verifica
loading="lazy"su ogni<img>fuori dal fold. - Misura con Lighthouse prima/dopo — punta a un LCP < 2,5 s.
- Fallo senza caricare le tue foto: convertile in locale.