WebP

Cos’è il WebP?

Il WebP è un formato immagine moderno sviluppato da Google che supporta la compressione sia con perdita che senza perdita di dati (lossy e lossless) in un unico tipo di file (.webp). Gestisce anche la trasparenza (canale alfa) e le animazioni, quindi può sostituire JPEG, PNG e GIF. A parità di qualità visiva, i file WebP sono solitamente più piccoli del 25-34% rispetto ai file JPEG e circa il 26% più piccoli rispetto ai file PNG.

Perché il WebP è importante?

Le immagini costituiscono spesso la maggior parte del peso totale di una pagina prodotto, e le immagini pesanti sono una delle cause più comuni di caricamento lento. File più piccoli significano pagine più veloci, migliori Core Web Vitals e un minore consumo di dati sui dispositivi mobili — tutti elementi che influiscono sia sulle conversioni che sul posizionamento. WebP offre questo risparmio senza alcuna perdita visibile di qualità, e il formato è supportato oggi da tutti i browser moderni (Chrome, Firefox, Edge e Safari).

Casi d’uso comuni

• Foto dei prodotti ad alta risoluzione in cui i file JPEG diventano troppo pesanti per una visualizzazione rapida su dispositivi mobili.
• Grafica con trasparenza che altrimenti richiederebbe file PNG di grandi dimensioni (loghi, badge, icone).
• Banner e immagini lifestyle nella parte superiore della pagina che influiscono su LCP e stabilità del layout.
• Distribuzione tramite CDN, dove il formato viene negoziato per singolo browser per risparmiare larghezza di banda.

Prospettiva di Shopify

Non è necessario convertire autonomamente le immagini in WebP in Shopify. La CDN per le immagini di Shopify serve automaticamente il formato WebP — o il formato AVIF ancora più piccolo — ai browser che lo supportano, in base all’intestazione Accept, sia che carichi file JPEG o PNG. Se desideri controllare il formato manualmente nel tuo tema, puoi passare il parametro format al filtro image_url. In pratica, concentrati sul caricamento di immagini di origine nitide alle dimensioni corrette e compila sempre il testo alternativo, lasciando che la CDN si occupi di tutto il resto.