Convertire in WebP su Mac

Nel 2010 Google ha presentato WebP, un nuovo e moderno formato di immagine lossless (senza perdita di dati) pensato appositamente per il web. Il formato WebP permette di ottenere immagini più leggere senza inficiare sulla qualità. Usando il formato WebP al posto dei più classici formati PNG o jpeg è possibile ridurre la dimensione dell’immagine fino al 30% (e in alcuni casi anche di più).

Cos’è il WebP e perché usarlo

Usare delle immagini in un sito web o in un blog è importante. Un’immagine ben studiata permette di creare la propria brand identity, e hanno un forte impatto sul modo di raccontarsi di un brand. Le immagini possono attirare l’attenzione, raccontare una storia e aiutare il lettore a comprendere meglio un concetto.

Allo stesso tempo è importante scegliere il formato corretto. Il formato sbagliato rischia di risultare poco funzionale ed eccessivamente grande. Una foto in PNG di grandi dimensioni può arrivare a pesare alcuni mega. Se è poco per un’uso normale, per un sito web sono un’enormità, e rallenta di molto i tempi di caricamento di una pagina. Di prassi io cerco di non caricare immagini più grandi di 200KB.

JPEG e PNG

I due formati principali che si trovano in rete sono il JPEG e il PNG, entrambi con i loro pregi e difetti.

Il JPEG è il formato immagine per antonomasia. È leggero e permette di mantenere una buona qualità. Il suo principale difetto è che non sopporta la trasparenza. Un qualsiasi file in questo formato dovrà avere uno sfondo. Se per determinati usi questo non ha molta importanza, è sconsigliato utilizzare un logo in formato JPEG.

Il PNG ha delle caratteristiche opposte al JPEG. Questo formato mantiene un’alta qualità d’immagine e supporta la trasparenza. Purtroppo le dimensioni dei file in PNG sono più pesanti rispetto al formato JPEG. Proprio per questo l’uso del PNG è destinato principalmente ai loghi.

Entrambi questi formati hanno un supporto del 100%. Questo significa che qualsiasi dispositivo è in grado di visualizzarli.

WebP

WebP è un formato di un file immagine senza perdita di dati con supporto alla trasparenza. È un formato creato appositamente per il web, e usarlo porta molti vantaggi. I file in formato WebP permettono di mantenere una buona qualità d’immagine, con una riduzione delle dimensioni dei file che può arrivare fino anche all’80% rispetto al JPEG. Il formato WebP inoltre supporta la trasparenza, e quindi può essere utilizzato per molti scopi, dalle immagini di prodotto, a quelle per un blog fino al suo utilizzo per i loghi.

Essendo un formato relativamente giovane, il supporto è ampio ma non completo. A differenza del formato JPEG, il WebP ha un supporto pari a circa il 97% dei browser. Ad esempio un pc con installato Chrome 8.0 (versione rilasciata nel 2010) non è in grado di leggere questo formato.

Le tre immagini qua sotto sono rispettivamente:

JPEG compresso – peso 18KB
PNG – peso 20KB
WebP – peso 8KB

Il formato JPEG è poco più leggero del formato PNG, ma bisogna considerare che nel primo è presente anche tutto lo sfondo bianco. Lo stesso PNG con lo sfondo bianco pesa 28KB, mentre l’immagine in formato WebP e sfondo bianco mantiene il peso di 8KB. La metà del formato in JPEG, un terzo del PNG. La differenza di peso si nota maggiormente sulle immagini di grandi dimensioni e con più colori.

Convertire un’immagine da Jpeg/PNG in WebP

Da parecchio tempo utilizzo prevalentemente immagini in formato WebP per i siti web. Questo mi permette ridurre la dimensioni delle immagini e, di conseguenza, lo spazio SSD nel mio webHostig e i tempi di caricamento delle pagine.
Da altrettanto tempo stavo cercando un modo facile e veloce per convertire una o più immagini. La soluzione l’ho sempre avuta sotto il naso: Automator, l’app di automazione integrata in MacOS.

App, servizi web e Automator

Prima di farmi venire in mente che avrei potuto usare Automator per la conversione, utilizzavo due metodi: tramite servizi web o tramite applicazione di terze parti. Entrambi i metodi non mi hanno mai soddisfatto molto, e vi spiego il perché.

Servizi Web

I servizi web di conversione funzionano, ma hanno due grossi limiti: sono scomodi e consumano internet. Ogni volta è necessario collegarsi al servizio, caricare le immagini, convertirle e scaricarle nel nuovo formato.

Una serie di passaggi che, se fatti occasionalmente non creano particolari fastidi, ma nel caso di 20, 50, 100 immagini o più (se hai un e-commerce sai di cosa sto parlando) inizia a diventare parecchio scomodo. Inoltre la maggior parte dei servizi gratuiti hanno un limite giornaliero di conversione (di solito una decina di immagini), dopo il quale non potete più utilizzarli fino al giorno successivo. È vero che si possono utilizzare più servizi, quindi convertire 10 immagini con uno e dieci immagini con l’altro, oppure aprire lo stesso servizi in modalità in incognito o con un altro browser e bla bla bla…emm…no grazie!

L’altro problema (marginale, lo ammetto) è il consumo di internet. Se sei connesso al WiFi di casa e hai una rete decente questo diventa irrilevante. Diventa più importante se usi un WiFi gratuito, come la rete pubblica di un bar, dove non sempre la velocità è decente, oppure se sei in un posto dove la rete WiFi non c’è e devi utilizzare l’hotspot del cellulare, e magari con poco campo.

App: Webp Converter

Esistono una serie di app di terze parti che è possibile installare sul proprio Mac. Per parecchio tempo il mio principale tool di conversione è stato Webp Converter. Si può scaricare direttamente dall’App Store, si installa in due click e permette di scegliere la qualità della compressione.

L’app è molto semplice. È una finestra in cui si trascinano una o più immagini, si setta il tipo di conversione (in questo caso “jpeg/png to WebP”) si seleziona il livello di compressione e si clicca Convert. Nel passaggio successivo si seleziona la cartella in cui salvare l’immagine di output e il gioco è fatto.

Ora penserete: Matteo, cos’ha che non va questa app?

Di per sè nulla, anzi. L’app funziona molto bene, ma nel mio processo di lavoro l’ho sempre trovata un po’ scomoda. Una volta scelte le immagini devi aprire l’app, selezionare i file, trascinarli, selezionare la compressione, cliccare su converti e selezionare la cartella in cui salvare i file.
Sono tanti passaggi quando hai molto lavoro da fare.

Matteo, tu sei un po’ fissato.
Si, forse. E proprio per questo cerco il pelo nell’uovo.

Se questa app la usi frequentemente, è probabile che tu la tenga nella Dock. L’icona occupa spazio (Dock più larga) e rimane aperta, o meglio “congelata” in backgroud, se non la chiudi.
Webp Converter occupa 3MB di memoria sul disco fisso. Pochissimi. Il flusso di Automator per la convezione occupa 34KB, per dire.

Convert to WebP con Automator

Quando ho deciso che mi ero stancato di questi metodi di conversioni scomodi e arcaici, mi sono imbattuto in un progettino di GitHub. GitHub è un portale in cui programmatori di tutto il mondo condividono programmi OpenSource. Guarda caso qualcuno ha pensato di sviluppare un tools che permette di sfruttare Automator per convertire le immagini in WebP.

Ma prima, perché utilizzare Automator invece degli altri metodi?

Perché è facile e immediato, più che bere un bicchiere d’acqua. Io solitamente lavoro così: una volta scelte le immagini da utilizzare, le metto in una cartella (in modo da avere tutto ordinato), le ridimensiono se è necessario, le seleziono con cmd+a, click destro/azioni rapide/Convert to WebP.

Nel giro di qualche secondo (e letteralmente in due passaggi) vi ritroverete nella stessa cartella una copia del file in formato WebP. Non si apre nessuna app e non serve una connessione a internet. Viene semplicemente eseguito il flusso di lavoro di Automator in background. L’unica cosa che appare è un’icona a forma di ingranaggio nella barra degli strumenti. L’icona sta li per meno di 7 secondi (che è il numero massimo di qualsiasi cosa) e poi scompare senza lasciare traccia, se non le immagini convertite.

Il progetto si chiama Convert to WebP, ed è un semplice flusso di lavoro di Automator. La sua installazione è leggermente più complicata rispetto ai metodi visti in precedenza, ma seguendo questa guida vedrai che è molto più facile di quello che sembra. Bastano 3 minuti, promesso.

 

Installa cwebp da teminale

Per prima cosa bisogna installare il pacchetto cwebp. Questo è il “motore” che effettivamente converte le immagini. Per farlo bisogna utilizzare il Terminale e scrivere dei testi in aramaico antico (scherzo, basta un semplice snippet di codice).

Per aprire il Terminale puoi cercarlo tramite Spotlight. Una volta aperto incolla questa riga di codice:

Dopo qualche minuto apparirà la scritta “Installation successful!”.

Ora copia e incolla questo pezzetto di codice:

Installa Convert to WebP

Ora bisogna scaricare il pacchetto con il flusso di lavoro di Automator. Puoi scaricarlo con il bottone qua sotto, oppure direttamente da GitHub.

Apri il file zip e la sottocartella, e clicca due volte sull’icona Convert to Webp.workflow.

Finito. Quanto ci hai messo?

Ora se fai click destro su una qualsiasi immagine e vai su “Azioni rapide”, ti comparirà l’icona di Convert to Webp. Cliccando, l’immagine selezionata (o le immagini) verrà convertita in un istante.