← Tutti gli episodi

Stagione 93  /  Episodio 7

Gli attrezzi

La cassetta degli attrezzi di libwebp: i parametri di cwebp che contano davvero, la trappola dei metadati e del profilo colore, webpinfo, webpmux, gif2webp, img2webp e un metodo per scegliere la qualità.

Note dell'episodio

Bentornati in bottega. Abbiamo visitato tutti i laboratori: la cornice, il disegno a mano libera, la tessera esatta, il vetro, il mosaico che si muove. Oggi apriamo la cassetta degli attrezzi.

Gli attrezzi ufficiali di WebP vivono insieme alla libreria di riferimento, libwebp, che è mantenuta dal progetto WebM di Google ed è arrivata alla serie uno punto sei. Su Ubuntu e Debian li trovate nel pacchetto webp, su macOS con Homebrew, e naturalmente potete compilarli dai sorgenti. Sono piccoli programmi a riga di comando, uno per ogni mestiere.

Il primo e più importante è cwebp, l'encoder. Prende un'immagine PNG, JPEG, TIFF o un'altra immagine WebP, e produce un WebP. La forma più semplice è: cwebp, l'immagine di partenza, meno o, il file di uscita. Senza altre indicazioni usa la compressione con perdita con qualità settantacinque.

Vediamo i parametri raggruppati per laboratorio, così ritrovate quello che abbiamo raccontato negli episodi precedenti.

Il più famoso è meno q, la qualità, da zero a cento. Come abbiamo visto nel terzo episodio, decide la quantizzazione. Non è una percentuale di niente: è una scala propria dell'encoder. Un settantacinque di cwebp non equivale a un settantacinque di un encoder JPEG, quindi non copiate i numeri da un formato all'altro.

Poi c'è meno m, il metodo, da zero a sei, con quattro come valore predefinito. Decide quanto l'encoder si sforza nelle sue ricerche: modi di predizione, probabilità, ottimizzazioni. A zero è velocissimo, a sei è il più lento e produce file un po' più piccoli. Per immagini che comprimete una volta e servite per sempre, sei vale quasi sempre la pena.

Meno sharp underscore yuv attiva la conversione di colore più accurata: lo ricordate, attenua le sbavature sui bordi saturi. Costa un po' di tempo e conviene quasi sempre.

Poi ci sono i parametri più fini. Meno sns regola la modellazione spaziale del rumore, cioè quanto spostare byte tra zone lisce e zone confuse. Meno f regola la forza del filtro contro i quadretti, e meno af lascia all'encoder la scelta automatica del filtro. Meno segments indica quanti segmenti usare, fino a quattro.

E c'è un parametro che pochi conoscono ma che è molto utile: meno preset. Imposta valori di partenza adatti a un tipo di immagine: photo per le fotografie, picture per i ritratti e gli interni, drawing per disegni con bordi netti, icon per le icone piccole, text per le immagini che contengono soprattutto testo. Va messo per primo nella riga di comando, perché le opzioni successive lo personalizzano.

A volte non vi interessa la qualità in sé, vi interessa un peso. "Questa immagine di copertina non deve superare i cento kilobyte." Per questo c'è meno size, che indica una dimensione obiettivo in byte. L'encoder fa più passate, regolando la qualità finché non si avvicina al bersaglio. Con meno pass decidete quante passate al massimo.

Esiste anche meno psnr, che invece di un peso fissa un obiettivo di qualità misurata, in decibel. È più coerente tra immagini diverse di un numero di qualità fisso, perché a parità di parametro immagini diverse escono con fedeltà diverse.

Meno lossless attiva la compressione senza perdita, e meno z, da zero a nove, sceglie quanto l'encoder si sforza, come abbiamo visto nel quarto episodio. Il livello nove è lento ma produce i file più piccoli.

Meno near underscore lossless, da zero a cento, attiva la via di mezzo: cento è senza perdita vera, valori più bassi permettono all'encoder di arrotondare un po' i pixel. Sessanta è un buon punto di partenza per screenshot con sfumature.

E meno exact conserva il colore dei pixel completamente trasparenti, quando serve.

Meno alpha underscore q, da zero a cento, regola la qualità dell'alfa nella compressione con perdita: cento lascia la trasparenza senza perdita, valori più bassi riducono le sfumature. Meno alpha underscore filter sceglie il filtro dell'alfa, e il valore best prova tutti i filtri e tiene il migliore.

Ora un avvertimento importante, che ha fatto impazzire molti. Di default, cwebp non copia i metadati. Né EXIF, né XMP, né il profilo colore ICC.

Per EXIF e XMP spesso è un bene: niente coordinate GPS, niente modello di fotocamera. Ma per il profilo colore no. Se la vostra immagine di partenza era in uno spazio colore diverso da sRGB, per esempio Display P3 come molte foto scattate con gli smartphone recenti, e il profilo viene scartato, il browser interpreterà i colori come sRGB. Risultato: colori spenti o sbagliati, e nessun errore da nessuna parte.

La soluzione è meno metadata seguito da quello che volete conservare: icc, exif, xmp, oppure all. Il mio consiglio per il web: conservate sempre icc, e valutate exif solo se vi serve davvero, magari dopo averlo ripulito. In alternativa, convertite la sorgente in sRGB prima di comprimerla.

cwebp sa anche ridimensionare con meno resize, ritagliare con meno crop, e usare più thread con meno mt. Sono comodi per una conversione al volo, ma in una pipeline seria di solito ridimensionate prima, con uno strumento dedicato, e usate cwebp solo per comprimere.

dwebp è il contrario di cwebp: decodifica un WebP in PNG, PPM, TIFF o altri formati grezzi. Serve per confrontare l'immagine compressa con l'originale, o per passarla a strumenti che non conoscono WebP.

webpinfo è il cugino ufficiale del nostro riffwalk: legge il file, elenca i chunk, ne mostra i campi e soprattutto controlla che il file sia conforme alla specifica. Con l'opzione per i dettagli del bitstream vi dice anche il tipo di compressione e le dimensioni. È il primo strumento da usare quando un'immagine si comporta in modo strano.

webpmux lavora sul contenitore senza toccare le tessere. Aggiunge, estrae o sostituisce i chunk ICCP, EXIF e XMP. Estrae un singolo fotogramma da un'animazione o ne costruisce una da più WebP. Cambia il numero di ripetizioni. Siccome non ricomprime nulla, è anche il modo più sicuro per togliere i metadati da un WebP già pronto.

gif2webp e img2webp li abbiamo incontrati nell'episodio scorso: il primo converte i GIF, il secondo costruisce un'animazione da immagini separate.

E infine vwebp è un piccolo visualizzatore, utile soprattutto per controllare le animazioni e la trasparenza.

Chiudiamo con un metodo. La domanda che tutti si fanno è: che qualità uso? La risposta onesta è: dipende dall'immagine. Ma si può trasformare il "dipende" in un procedimento.

Prendete un campione rappresentativo delle vostre immagini, diciamo una trentina. Comprimetele con una serie di qualità, per esempio da cinquanta a novanta a passi di cinque, con metodo sei e sharp YUV. Per ognuna misurate due cose: il peso e una metrica di fedeltà rispetto all'originale. cwebp stesso può stampare il PSNR o l'SSIM con l'opzione print, ma oggi esistono metriche più vicine alla percezione umana, come SSIMULACRA 2 o Butteraugli, che vale la pena usare.

Poi guardate la curva: c'è sempre un punto dove la qualità smette di crescere molto mentre il peso continua a salire. È lì il vostro valore. Per molti siti il punto cade tra settanta e ottanta per le foto. E se le vostre immagini sono molto diverse tra loro, usate un obiettivo di fedeltà invece di un numero fisso, come abbiamo visto con meno psnr.

Ultimo consiglio: guardate sempre, almeno una volta, le immagini a schermo intero su un monitor decente. Le metriche sono preziose, ma il mosaico si giudica anche con gli occhi.

Ricapitolando la cassetta: cwebp per comprimere, con qualità, metodo, sharp YUV, preset, obiettivi di peso o fedeltà, parametri senza perdita e dell'alfa, e attenzione ai metadati e al profilo colore. dwebp per decodificare, webpinfo per ispezionare, webpmux per lavorare sul contenitore, gif2webp e img2webp per le animazioni, vwebp per guardare.

Nel prossimo episodio portiamo il mosaico fuori dalla bottega e lo esponiamo: come si serve WebP sul web, tra HTML, intestazioni HTTP, cache e CDN. Ci sentiamo lì.