Come utilizzare le immagini WebP su WordPress

Abbiamo già parlato di come fare per velocizzare un sito WordPress, soffermandoci anche sulla questione legata al peso delle immagini e di quanto quest’ultime possono incidere sulla velocità di caricamento di una pagina web.

Il peso delle immagini all’interno di una pagina web rappresenta, mediamente, un buon 40% del peso totale della pagina. Ecco perché è molto importante effettuare tutte le ottimizzazioni possibili al fine di migliorare questo aspetto.

Ecco perché in questo articolo parleremo di immagini WebP, cos’è e come può essere utilizzato su WordPress andando a sostituire i più famosi formati con jpg e png.

Cos’è WebP

In parole molto semplici, WebP è un formato immagine sviluppato da Google a partire dal 2010, ed è stato concepito appositamente per ottimizzare il caricamento delle immagini sulle pagine web utilizzando una serie di metodi di compressione molto particolari, e si pone come un’alternativa più leggera rispetto a formati come png e jpg.

Secondo uno studio effettuato sulla compressione WebP infatti, possiamo notare come le immagini WebP siano mediamente più piccole del 25% rispetto alle medesime in formato png o jpg, un risultato da non sottovalutare soprattutto se si considera l’equivalente in KB risparmiati sul peso di ogni singola pagina web contenente immagini.

Google stesso, infatti, se si prova ad effettuare un test del proprio sito web su PageSpeed Insights, mostra come raccomandazione la famosa frase “Pubblica immagini in formati più recenti” chiamando in causa il formato WebP.

Immagini WebP: da quali browser sono supportati?

Nel corso degli anni i browser hanno, via via, aggiunto il supporto al formato WebP.
Attualmente, nel momento in cui viene scritto questo articolo, tutti i browser più famosi hanno il supporto a WebP:

• Google Chrome (sia mobile che desktop)
• FireFox (sia mobile che desktop)
• Opera (sia mobile che desktop)
• Edge
• Safari mobile mentre la versione per Mac ha un supporto parziale

In sostanza Internet Explorer rimane escluso totalmente dal supporto a WebP, mentre Safari per Mac ha un sopporto parziale dato che è compatibile solo a partire dal sistema operativo MacOS 11 Big Sur e successivi.

Ad ogni modo, ad oggi e a livello globale, il formato WebP è compatibile con il 94% circa degli utenti che fanno accesso ad internet.

Come utilizzare le immagini WebP su WordPress

WordPress non permette (almeno nel momento in cui viene scritto questo articolo) di caricare un’immagine in formato WebP direttamente nella libreria media, e da un certo punto di vista potrebbe essere positivo.

Dato che alcuni browser non supportano le immagini in formato WebP, andarle a caricare direttamente all’interno di una pagina o un articolo potrebbe essere rischioso, alcuni utenti potrebbero non visualizzarle e quindi rendere poco piacevole la navigazione all’interno del sito web.

Fortunatamente esiste una soluzione a questo tipo di problema grazie all’ausilio di specifici plugin per WordPress che non solo convertono tutte le immagini presenti nella nostra libreria media creandone una versione in formato WebP, ma effettuano un controllo del browser dell’utente andando a fornire il formato giusto.

Ad esempio, se caricassimo un’immagine in formato jpg nella nostra libreria media, il plugin creerà automaticamente la versione in formato WebP e successivamente:

• Mostrerà la versione in formato WebP a tutti gli utenti che navigano con browser che supportano tale formato.
• Mostrerà la versione originale in jpg a tutti gli utenti che navigano con browser come Internet Explorer oppure Safari per Mac ma con MacOS precedente a Big Sur.

In questo modo tutti gli utenti visualizzeranno correttamente le immagini del sito web a seconda del browser di navigazione utilizzato.

WebP Converter for Media

Uno dei plugin consigliati se si vuole convertire la propria libreria di immagini in formato WebP è WebP Converter for Media, un plugin totalmente gratuito ed efficace.

Una volta installato ed attivato, sarà sufficiente andare in “Impostazioni-> WebP Converter” per entrare nel pannello delle impostazioni del plugin.

Da questa schermata potremo impostare il metodo con cui rilavare quale browser è compatibile con il formato immagine WebP, quali formati immagini convertire (jpg, jpeg, png e gif), le directory da scansionare per trovare le immagini da convertire, impostare la qualità dell’immagine, e tante altre impostazioni.

Ovviamente non manca l’opzione per rigenerare tutte le immagini precedenti e convertirle in WebP, in modo convertire anche tutte le immagini caricare nella libreria media prima dell’installazione di questo plugin.

Conclusioni

In questo articolo abbiamo visto cos’è il formato WebP, quali sono i pregi dell’utilizzo di questo formato, abbiamo anche visto quali sono i browser compatibili, e infine come fare per utilizzare le immagini WebP su WordPress.

E tu? Stai già utilizzando le immagini WebP sul tuo sito web? Hai utilizzato un plugin in particolare? Raccontaci la tua esperienza in un commento 🙂