Risposta rapida: scegli in base alla pipeline, non allo hype del formato
Per la maggior parte dei siti web nel 2026, WebP è il passaggio di formato-unico più sicuro rispetto a JPG e PNG. AVIF è la prima scelta migliore quando la tua pipeline sa servire anche fallback WebP o JPEG.
Quest’ultima frase è la parte che molti confronti AVIF vs WebP saltano. Il formato migliore non è solo quello che vince un benchmark. È quello che il tuo CMS, la tua CDN, il tuo processo di build, il tuo mix di browser e i tuoi tipi di immagine sanno consegnare in modo affidabile.
Punto di partenza pratico:
- Usa WebP quando vuoi un formato moderno semplice, conversione batch rapida, supporto ampio e meno sorprese su browser vecchi, client email, plugin CMS o browser in-app.
- Usa AVIF con fallback quando le immagini pesano molto sulle performance, puoi codificare al build o via una CDN per immagini e puoi controllare l’output visivo prima di andare online.
- Mantieni fallback JPEG o PNG quando l’immagine deve funzionare ovunque, inclusi vecchi Safari/iOS, browser aziendali bloccati, crawler, client email e piattaforme di terze parti.
AVIF vs WebP in sintesi
| Aspetto | WebP | AVIF |
|---|---|---|
| Miglior uso predefinito | Un formato moderno per la maggior parte dei siti | Primo source in una pipeline multiformato |
| Compressione | Più piccolo di JPEG/PNG; ottimo tuttofare | Spesso più piccolo di WebP sulle foto |
| Supporto browser, luglio 2026 | Circa 96 % di utilizzo globale su Can I use | Circa 93 % di utilizzo globale su Can I use |
| Velocità di codifica | Abbastanza veloce per flussi locali e batch | Più lento; migliore al build, in CDN o offline |
| Rischio di decodifica | Molto maturo su tutti i browser | Di solito ok, ma testa hero grandi su dispositivi di fascia bassa |
| Trasparenza | Sì | Sì |
| Animazione | Sì e ampiamente usata | Il formato la supporta, ma i flussi tool/browser sono meno prevedibili |
| Profondità colore e HDR | Orientato a 8 bit per la delivery web | Meglio per alta profondità di bit, HDR e gamut ampio |
| Migliori tipi di immagini | Foto prodotto, immagini di blog, screenshot, thumbnail, asset web generici | Pagine ricche di foto, hero grandi, gallerie, asset statici ad alto traffico |
Da dove arrivano
WebP è stato sviluppato da Google e rilasciato nel 2010. La modalità con perdita si basa sul codec video VP8, quella senza perdita usa un metodo di compressione a parte. La documentazione WebP di Google indica che WebP supporta compressione con perdita, senza perdita, trasparenza e animazione, ed è supportato nativamente dai principali browser.
AVIF, sigla di AV1 Image File Format, si basa sul codec video aperto AV1. web.dev descrive AVIF come un formato raster più recente pensato per coprire bisogni comuni del web — trasparenza, animazione e qualità per byte migliore rispetto ai formati più vecchi.
La differenza pratica è l’anzianità. WebP ha avuto più di un decennio per accasarsi in browser, plugin CMS, strumenti di design, librerie di immagini e sistemi di build. AVIF non è più esotico, ma resta il formato in cui è più probabile imbattersi in un encoder lento, un’opzione di export mancante o una piattaforma che chiede un fallback.
Efficienza di compressione
AVIF produce spesso file più piccoli di WebP a qualità visiva simile, in particolare sulle immagini fotografiche. Non significa che ogni AVIF sarà il 30, 40 o 50 % più piccolo. Il numero reale dipende dall’encoder, dal setting di qualità, dal contenuto dell’immagine e da come giudichi la "stessa qualità".
Il divario si vede di più su:
- foto hero grandi con cieli, incarnati, ombre e sfumature;
- immagini di galleria dove ogni kilobyte si ripete su molte foto;
- pagine mobili dove un transfer più leggero aiuta direttamente LCP e consumo dati.
Il divario spesso si riduce su:
- piccole thumbnail, dove overhead di richiesta e resize contano più dell’efficienza del codec;
- screenshot, immagini di UI e diagrammi con testo nitido;
- immagini rumorose o molto texturizzate;
- grafica lossless, dove PNG o WebP senza perdita spesso hanno ancora più senso.
Per un sito vero, testa su una cartella rappresentativa invece che su una singola immagine perfetta. Un buon set di test include una foto hero, un’immagine prodotto, un ritratto, uno screenshot, un’illustrazione e una thumbnail. Confronta dimensione file e qualità visiva alle dimensioni con cui pubblichi davvero.
Supporto browser nel 2026
Entrambi i formati hanno un supporto ampio, ma non identico. Al controllo di luglio 2026, Can I use riporta circa il 96,15 % di utilizzo globale per WebP e circa il 93,42 % per AVIF. Entrambi sono adatti alla delivery web moderna, ma non equivalenti.
Il divario residuo conta soprattutto su:
- vecchi iPhone e iPad, in particolare iOS 15 e precedenti;
- vecchie versioni di Safari desktop;
- macchine aziendali con versioni di browser bloccate;
- browser embedded in app, chioschi e vecchie WebView Android;
- client email e piattaforme di terze parti che non si comportano come browser normali.
Per WebP, molti siti possono cavarsela con WebP più fallback JPEG per i client vecchi. Per AVIF, il setup sicuro in produzione resta AVIF prima, WebP secondo, JPEG o PNG per ultimo.
<picture>
<source srcset="/images/hero.avif" type="image/avif">
<source srcset="/images/hero.webp" type="image/webp">
<img src="/images/hero.jpg" alt="Foto prodotto in uso">
</picture>
L’ordine conta. I browser usano il primo source supportato, quindi AVIF deve venire prima di WebP se vuoi che i browser capaci di AVIF ricevano AVIF.
Velocità di codifica
La velocità di codifica è la differenza che senti quando mantieni davvero un sito.
WebP è abbastanza veloce per conversione locale, tool batch, flussi CMS e build semplici di siti statici. AVIF può essere molto più lento perché l’encoder lavora di più per trovare un risultato più piccolo. Esistono preset AVIF più veloci, ma di solito restituiscono parte della compressione.
Pesa in quattro punti:
- Build statici: un blog con 30 immagini può andare bene. Un sito di viaggi con 2.000 foto originali può far diventare la generazione AVIF un costo di build significativo.
- Upload utente: se le persone caricano immagini e si aspettano un’anteprima immediata, la codifica AVIF aggiunge latenza e costo CPU.
- Funzioni serverless: codifiche lente possono sbattere contro timeout o soglie di costo.
- Flussi locali: se converti manualmente una cartella prima di caricarla, WebP è meno faticoso.
Regola utile: AVIF brilla quando si codifica una volta e il file più piccolo si serve molte volte. WebP brilla quando contano velocità, semplicità e conversione batch ripetibile.
Qualità visiva per tipo di immagine
AVIF vs WebP non è una decisione unica per tutte le immagini del sito.
| Tipo di immagine | Prima scelta migliore | Perché |
|---|---|---|
| Hero fotografica grande | AVIF + fallback WebP | AVIF può alleggerire l’asset above-the-fold più pesante |
| Foto inline di blog | WebP, o AVIF + fallback se automatizzato | WebP è semplice; AVIF vale se il build genera già varianti |
| Foto prodotto e‑commerce | WebP di base; testa AVIF | Il dettaglio prodotto deve restare pulito — confronta bordi, tessuto, etichette e colori |
| Screenshot o immagine di UI | WebP o PNG | Un AVIF a bassa qualità può ammorbidire testi piccoli e bordi netti |
| Logo o icona | SVG o PNG/WebP | L’AVIF raster non è lo strumento giusto per artwork di tipo vettoriale |
| Immagine animata | WebP o video | I flussi AVIF animato sono meno maturi su tool e piattaforme |
| Immagine per condivisione social | JPEG o WebP | Molte piattaforme social e messaging ricomprimeranno comunque |
Funzioni avanzate
AVIF supporta capacità che WebP non copre altrettanto bene. Per le solite immagini web sRGB può contare poco. Diventano rilevanti per fotografia, contenuti HDR e pipeline display di fascia alta.
- Alta profondità di bit: AVIF può supportare più degli 8 bit tipici della delivery web.
- HDR e gamut ampio: AVIF si adatta meglio quando la tua pipeline conserva quei segnali.
- Strumenti AV1 moderni: AVIF eredita parti dell’ecosistema AV1, inclusa una compressione intra-frame efficiente.
Non scegliere AVIF per queste funzioni se l’intera pipeline non le può preservare. Se le immagini sorgente sono normali JPEG sRGB, esportati da un CMS che rimuove metadati e informazioni colore, il beneficio pratico rimane in genere il peso del file, non la magia HDR.
Maturità del toolchain
WebP è l’opzione noiosa e matura, ed è un complimento. Ben supportata da browser, strumenti di design, librerie di immagini, plugin di build, plugin CMS e CDN. Quando qualcosa va storto, di solito è facile fare debug.
Il supporto AVIF è molto migliore di prima, ma gli spigoli sono più frequenti:
- il tuo CMS può caricare AVIF ma non generare tutte le dimensioni di thumbnail;
- un plugin può produrre AVIF senza scrivere il markup di fallback;
- una CDN può supportare AVIF solo su certi piani o con certi header Accept;
- l’encoding locale via browser può funzionare in uno e fallire in un altro;
- il tuo build può diventare più lento generando AVIF per ogni immagine.
Prima di impegnarti con AVIF su un sito grande, testa la pipeline esatta: upload, resize, generazione varianti, render HTML, deploy, crawl e apertura del risultato in Safari, Chrome, Firefox e su un mobile di fascia bassa.
Cosa scegliere
Per la maggior parte dei progetti web nel 2026, WebP è la scelta pragmatica. AVIF è la scelta di performance quando la pipeline è pronta.
Scegli WebP quando
- Vuoi un formato immagine moderno che funzioni quasi ovunque.
- Ti serve conversione rapida in locale o via browser.
- Il sito è abbastanza piccolo da non avere nel transfer immagini il problema di performance principale.
- Il tuo CMS o piattaforma e‑commerce non produce fallback AVIF puliti.
- Le tue immagini includono molti screenshot, diagrammi, capture di UI o piccole thumbnail.
- Invii immagini in email, marketplace o piattaforme terze dove il supporto AVIF è incerto.
Scegli AVIF (con fallback WebP o JPEG) quando
- Le immagini dominano il peso di pagina o l’LCP.
- Hai molte foto grandi, gallerie, hero o landing ricche di media.
- Codifichi al build, tramite CDN o in una pipeline offline.
- Il tuo tooling emette automaticamente AVIF, WebP e markup di fallback JPEG/PNG.
- Puoi valutare la qualità su immagini reali invece di fidarti di un singolo benchmark.
- Il tuo pubblico è per lo più su browser moderni.
Tieni JPEG o PNG quando
- L’immagine deve sopravvivere a client vecchi, email, documenti o download.
- Ti serve un file master per editing o archiviazione.
- L’immagine è un logo, un’icona, un diagramma o uno screenshot dove conta l’output senza perdita.
- Una piattaforma ricomprimerà comunque l’upload.
Come testare AVIF vs WebP sul tuo sito
Non decidere solo da un benchmark generico. Testa sulle tue immagini reali.
- Prendi 10-20 immagini vere: foto hero, scatti prodotto, thumbnail, screenshot e qualsiasi immagine con testo.
- Esporta WebP e AVIF a setting di qualità sensati. Come prima passata, confronta WebP intorno a 80-85 e AVIF intorno a 60-75, poi correggi a occhio.
- Controlla l’output alla dimensione di render finale, non solo al 100 %.
- Guarda da vicino volti, cieli, sfumature, tessuti, etichette prodotto, testo e bordi netti.
- Confronta il peso totale delle immagini di pagina, non solo un file.
- Lancia Lighthouse o il tuo tool di performance prima e dopo.
- Testa il rendering del fallback disabilitando il supporto AVIF o aprendo la pagina in un browser/dispositivo che non lo supporta.
Se AVIF risparmia solo pochi kilobyte su una thumbnail, salta la complessità. Se toglie centinaia di kilobyte alla hero LCP, adottalo con markup di fallback.
Usare PhotoTools per conversioni rapide
PhotoTools è utile quando vuoi ispezionare o preparare file a mano prima di aggiungerli a un sito.
- Usa il convertitore JPG in WebP quando vuoi un export veloce lato browser che funzioni sulla maggior parte dei siti moderni.
- Usa il convertitore JPG in AVIF quando vuoi confrontare una versione AVIF con WebP prima di impegnarti su una pipeline.
- Usa la conversione AVIF in JPG o PNG quando un file AVIF deve essere condiviso con un tool, un cliente o una piattaforma che non riesce ad aprirlo.
Il convertitore gira nel browser con la Canvas API nativa. È comodo per batch veloci e flussi senza upload, ma non sostituisce una CDN automatizzata o una pipeline di build su un sito grande.
Fonti consultate
Questo articolo è stato rivisto il 18 luglio 2026 rispetto alle linee guida attuali su formati e supporto: documentazione WebP di Google, guida AVIF di web.dev, linee guida Chrome Lighthouse sulle immagini moderne, Can I use AVIF e Can I use WebP.