Qual è il miglior formato immagine per un sito web?

"Formato migliore" è la domanda sbagliata finché non sai di che tipo di immagine si tratta. Un sito web contiene diversi tipi di immagini, molto differenti tra loro, e per ciascuno esiste una scelta chiaramente migliore:

• Fotografie (prodotti, persone, luoghi): un formato con perdita. AVIF è il più leggero, WebP è la scelta moderna più sicura e JPG è l'alternativa che ogni browser può mostrare.
• Loghi, icone e illustrazioni: SVG. È un formato vettoriale, quindi rimane nitido a qualsiasi dimensione su qualsiasi schermo e il file è solitamente molto leggero. Ricorri a un formato raster solo quando una piattaforma non accetta SVG.
• Schermate, grafica UI e qualsiasi elemento con trasparenza: PNG oppure WebP senza perdita. I colori uniformi e i bordi netti sono esattamente ciò che i formati senza perdita comprimono bene.
• Animazioni brevi: WebP o AVIF animato anziché GIF, che dispone di una tavolozza limitata e produce file molto più grandi.
• La favicon: un file ICO, idealmente affiancato da una versione SVG o PNG; scopri come creare una favicon da un'immagine.

L'errore classico è salvare una fotografia come PNG. PNG memorizza ogni pixel senza perdita, caratteristica perfetta per un logo ma disastrosa per una foto: il file diventa parecchie volte più grande di un JPG senza alcun miglioramento visibile.

Per le foto, la scelta dipende da quanto puoi affidarti ai browser più recenti:

• AVIF offre la compressione migliore: con una qualità tipica per il web, risulta circa il 50% più piccolo di JPEG e il 20–30% più piccolo di WebP, offrendo anche HDR e un'ampia gamma cromatica se necessari. Chrome, Firefox e Safari lo visualizzano tutti (Safari dalla versione 16.4, nel 2023). Gli svantaggi sono la codifica lenta, soprattutto per le immagini grandi, e il supporto limitato nei software desktop e nei dispositivi meno recenti.
• WebP è la scelta pragmatica predefinita: il 25–35% più piccolo di JPEG a parità di qualità visiva, con trasparenza e supporto da parte di tutti i principali browser dal 2020. Alcune applicazioni desktop e alcuni strumenti meno recenti non riescono ancora ad aprirlo, aspetto importante per il file che consegni a un designer, non per quello che mostri ai visitatori.
• JPG è l'alternativa universale. È il meno efficiente dei tre, ma un JPG salvato con una qualità intorno a 75–82 è solitamente indistinguibile dall'originale sullo schermo e qualsiasi dispositivo connesso al web riesce a mostrarlo.

La configurazione migliore fornisce AVIF ai browser che lo supportano, WebP agli altri e conserva un JPG per quelli ancora meno recenti. Se preferisci sceglierne uno solo, WebP con JPG come alternativa copre praticamente tutti. Trovi i confronti diretti in WebP e AVIF a confronto e WebP e JPG a confronto; per la grafica anziché le foto, consulta PNG e JPG a confronto.

Una volta stabilito il formato di destinazione, la conversione è rapida e non lascia mai il tuo dispositivo. Il convertitore di immagini EditItAll funziona interamente nel browser:

1. Apri il convertitore e trascina le tue immagini, che si tratti di un solo file o di un'intera cartella. I gruppi di file vengono elaborati insieme.
2. Scegli il formato di output: WebP o AVIF per le fotografie, PNG per la grafica che richiede la trasparenza. Sono disponibili percorsi diretti per le operazioni più comuni: da JPG a WebP, da PNG a WebP, da JPG ad AVIF e da PNG ad AVIF.
3. Imposta la qualità. Non esiste un campo per le dimensioni desiderate: le dimensioni sono un risultato. Ogni file mostra le proprie dimensioni prima e dopo, quindi regola leggermente il cursore finché sia il valore sia l'immagine non appaiono soddisfacenti.
4. Scarica i risultati singolarmente oppure come un unico ZIP.

Non viene caricato nulla: puoi disconnetterti da Internet dopo il caricamento della pagina e continuare a convertire. Inoltre, i metadati EXIF e GPS vengono rimossi da ogni immagine esportata, così la foto di un prodotto non rivela dove è stata scattata. È gratuito, non richiede un account e non applica filigrane. Hai già il formato giusto e devi soltanto ridurre le dimensioni? Vai direttamente al compressore di immagini. Se invece una piattaforma richiede una versione raster di un logo vettoriale, lo strumento da SVG a PNG la crea nelle dimensioni che preferisci.

Scegliere il formato è utile, ma tre abitudini consentono di risparmiare più byte di quanti ne farà mai il passaggio da JPG ad AVIF:

• Ridimensiona in base alle dimensioni effettivamente visualizzate. Una foto scattata con una fotocamera è molto più larga dello spazio che occupa su una pagina e ciascuno di quei pixel in eccesso viene scaricato e poi scartato. Proprio per questo, gli strumenti per immagini di EditItAll offrono un limite massimo opzionale per le dimensioni.
• Comprimi una volta, partendo dall'originale. Ogni salvataggio con perdita elimina qualche dettaglio in più. Conserva l'originale, esporta da questo la copia per il web e non salvare nuovamente, in sequenza, un JPG come WebP e poi come AVIF.
• Fornisci i formati moderni con un'alternativa. Proponi prima AVIF o WebP e consenti ai browser meno recenti di usare JPG o PNG come alternativa, così nessun visitatore vedrà mai un'immagine non disponibile.

Se un rapporto sulle prestazioni ti invita a "codificare le immagini in modo efficiente" o a "fornire immagini in formati di nuova generazione", si riferisce esattamente a questa scelta: la guida per correggere l'avviso sulla codifica efficiente delle immagini illustra la procedura, mentre quella sulla compressione di JPEG per il web spiega dettagliatamente il cursore della qualità. Altre guide sui formati sono disponibili nella raccolta dedicata alla conversione delle immagini.