Ottimizzazione delle schede prodotto
Come comprimere le foto prodotto senza perdere qualità
· 4 min read
Ridimensiona la foto prodotto alle dimensioni in pixel con cui viene davvero mostrata, poi esportala in WebP o AVIF, che di solito pesano dal 25 al 50 per cento in meno di un JPEG a parità di qualità visiva. Punta a circa 100 a 300KB per immagine, in base al ruolo che ha nella pagina. Il parametro Largest Contentful Paint di Google considera lenta una pagina oltre i 2,5 secondi, e una foto principale troppo pesante è spesso l'unica risorsa responsabile del mancato rispetto.
Fallo con RorlAIProduct: Clean studio backdrop for anything boxed or bottled.Perché il peso del file è un problema di conversione, non solo di caricamento
Il Largest Contentful Paint misura quanto tempo impiega l'elemento visibile più grande di una pagina a essere mostrato per intero. Secondo le soglie di Google, sotto i 2,5 secondi è buono, da 2,5 a 4 secondi da migliorare, oltre i 4 secondi scarso. In una scheda prodotto l'elemento visibile più grande è quasi sempre la foto principale. Quindi un solo file immagine troppo pesante può decidere da solo se la tua pagina supera o no il parametro, per quanto veloce si carichi tutto il resto.
Non è un esercizio astratto di punteggio. Una foto principale lenta a caricarsi è la prima cosa che il cliente vive nella tua inserzione, prima di aver letto una parola della descrizione o visto il prezzo.
Un budget di peso realistico
| Ruolo dell'immagine | Obiettivo ragionevole |
|---|---|
| Foto principale, con zoom | 150 a 300KB |
| Immagine secondaria della galleria o miniatura | 60 a 120KB |
| Foto principale su mobile, nella parte alta della pagina | sotto circa 150 a 200KB |
Sono obiettivi di lavoro raccolti dalle indicazioni attuali sull'ottimizzazione delle immagini, non una specifica ufficiale di una singola piattaforma, e variano un po' in base alla complessità dell'immagine. Un prodotto semplice su sfondo bianco si comprime più di una scena ricca di dettagli prima che la perdita di qualità diventi visibile. Considera quindi la tabella un tetto e non una regola da centrare esattamente.
L'ordine dei passaggi che fa davvero risparmiare byte
- 1Ridimensiona prima di comprimereUna fotocamera o uno strumento di generazione esporta di solito a 3000 o 4000 pixel di larghezza. Se la foto viene mostrata in uno spazio di 1200 pixel sulla tua pagina, ridimensionala prima a circa quella larghezza. Comprimere un'immagine sovradimensionata significa comunque consegnare un'immagine sovradimensionata, solo un po' più piccola.
- 2Esporta in WebP dove la tua piattaforma lo supportaIl WebP pesa spesso dal 25 al 35 per cento in meno di un JPEG a parità di qualità visiva, e l'AVIF può spingersi ancora oltre. La maggior parte delle piattaforme e-commerce e dei browser attuali supporta il WebP; verifica se la tua lo serve in automatico o se il file va caricato direttamente in quel formato.
- 3Imposta la qualità JPEG intorno a 70 a 85 quando il WebP non è possibileLe impostazioni di esportazione predefinite dei programmi di editing sono spesso inutilmente alte. Una qualità in questo intervallo è visivamente indistinguibile dall'originale per la maggior parte delle foto prodotto e molto più leggera di un'esportazione al 100 per cento.
- 4Rimuovi i metadati incorporatiLe impostazioni della fotocamera, i profili colore oltre quelli necessari alla pagina e i dati GPS che alcuni telefoni incorporano aggiungono peso che il cliente non vede mai. La maggior parte degli strumenti di compressione li elimina di default; verifica che il tuo lo faccia.
La distinzione che conta di più:
- La compressione senza perdita mantiene ogni pixel esattamente come catturato e riduce a malapena una fotografia. Va bene per grafiche a colori piatti e bordi netti, non per la fotografia
- La compressione con perdita scarta dati che l'occhio umano nota con difficoltà, ed è lì che stanno i risparmi veri per una foto
- Un encoder moderno impostato bene resta ben al di sotto del punto in cui un cliente nota la differenza, molto prima di arrivare al punto in cui la noteresti tu
Dove si colloca una foto generata o modificata
Una foto prodotta da un qualsiasi strumento di editing o di generazione richiede lo stesso passaggio di ridimensionamento e compressione di una foto appena uscita dalla fotocamera. Questi strumenti spesso esportano a piena risoluzione di default, e un'esportazione a piena risoluzione ha lo stesso problema di peso, che i pixel vengano da un sensore o da un modello. Trattala come un file grezzo in attesa dello stesso budget, non come una risorsa finita.
Common questions
- Comprimere le mie foto prodotto le farà sembrare peggiori?
- Non con un'impostazione ragionevole. La compressione con perdita negli intervalli descritti qui è tarata per scartare dettagli che l'occhio umano non registra, quindi una foto compressa correttamente appare identica alla dimensione di visualizzazione normale e si carica in una frazione del tempo.
- Devo usare WebP o restare sul JPEG?
- Usa il WebP se la tua piattaforma di negozio lo supporta, perché di solito pesa dal 25 al 35 per cento in meno di un JPEG a parità di qualità. Ripiega su un JPEG ben calibrato solo se la tua piattaforma o il tuo tema non serve il WebP in automatico.
- Mi servono dimensioni di immagine separate per mobile e desktop?
- Idealmente sì. Un cliente su mobile vede la foto in uno spazio molto più piccolo di uno su desktop, quindi servire un file più piccolo su mobile fa risparmiare tempo di caricamento reale senza perdita di qualità visibile su quello schermo.
- Il peso delle immagini influisce davvero sulle vendite o solo su un punteggio di velocità?
- Velocità della pagina e conversione sono legate abbastanza da spingere la maggior parte delle piattaforme e-commerce a trattarle ormai come fattore di posizionamento e di conversione, non solo come parametro di laboratorio. Un'immagine principale che da sola spinge la pagina oltre la soglia di 2,5 secondi del Largest Contentful Paint è un rallentamento reale e misurabile che il cliente percepisce, non un punteggio astratto.