Tutti amiamo le immagini nitide e di alta qualità. Sono una parte importante di ciò che rende i siti web moderni così belli e accattivanti. Il problema è che questi file possono pesare molto. A seconda dei formati utilizzati e dell’ottimizzazione o meno, le immagini possono influire in modo significativo sulle prestazioni del tuo sito.

La maggior parte dei siti web si basa su formati comuni, come JPEG o PNG. Tuttavia, i formati di immagine “next-gen”, come WebP, consentono di offrire supporti di qualità superiore a dimensioni inferiori. La configurazione di WordPress per supportare tali file è un modo eccellente per migliorare l’esperienza utente (UX) .

In questo articolo parleremo del formato immagine WebP e di ciò che lo rende unico. Quindi eseguiremo tre passaggi per abilitare il supporto WebP in WordPress, in modo da trarre tutti i vantaggi. 

Incominciamo subito!

Introduzione alle immagini WebP

Potresti aver sentito il termine formato immagine “next-gen” durante la lettura di articoli sui file multimediali o ottimizzazione delle prestazioni. È un’ampia categorizzazione che copre formati che vanno oltre i tradizionali JPEG, PNG e GIF. WebP rientra in quella categoria insieme ad altri, come JPEG 2000 e XR.

Sebbene il termine “next-gen” sia principalmente per il marketing, si adatta al caso dei file WebP. Con questo formato, è possibile ottenere una qualità dell’immagine superiore a dimensioni notevolmente inferiori rispetto a JPEG o PNG.

La differenza può essere così drastica che alcuni dei siti web più famosi al mondo, incluso eBay, utilizzano già immagini WebP nei loro progetti:

Un'immagine WebP su Ebay

Google (che ha creato il formato WebP) afferma che le immagini WebP senza perdita di dati sono fino al 26 percento più piccole delle loro controparti PNG. Nella compressione con perdita, quel numero sale fino al 25–34 percento.

Google consiglia persino di utilizzare le immagini WebP quando fai il test del sito web utilizzando PageSpeed ​​Insights :

Che dice PageSpeed ​​Insights sulle immagini WebP

Oltre alle dimensioni di file inferiori, le immagini WebP hanno anche il netto vantaggio di supportare trasparenza e animazioni . Questo le rende fantastiche soluzioni per qualsiasi cosa, dai logo animati alle foto tradizionali.

Come con la maggior parte dei nuovi formati di immagine, tuttavia, il problema principale in cui ti imbatterai è l’adozione. Sebbene la maggior parte dei browser principali supporti le immagini WebP , Safari, che è il terzo browser più popolare e soprattutto prevalente sui dispositivi mobili, non lo fa.

WordPress inoltre non supporta WebP nativamente. Ciò significa che per usufruire dei vantaggi di questo formato devi configurare il tuo sito per abilitare i file di immagini next-gen e e fornire una soluzione alternativa per pubblicare immagini per gli utenti di Safari.

Come utilizzare le immagini WebP su WordPress

L’uso dei formati di file di nuova generazione in WordPress è semplice se si dispone del plugin giusto. Il problema principale, tuttavia, è che sebbene tu abbia diverse soluzionii per abilitare il supporto WebP e convertire le tue immagini, molte di loro tralasciano gli utenti i cui browser non supportano il tipo di file.

Tenendo presente questo, consigliamo WebP Express . È gratuito e converte automaticamente i nuovi file PNG e JPEG mantenendo gli originali. Se un visitatore utilizza un browser che non supporta WebP, servirà il file immagine nel formato originale.

WebP Express è anche abbastanza facile da configurare. Una volta installato e attivato, vai su Impostazioni> WebP Express .

Qui, controlla la  sezione Metodo di conversione. WebP Express può utilizzare diversi approcci per cambiare le immagini PNG e JPEG in WebP, a seconda di quale (i) supporta il tuo host web (basato sulla libreria di conversione WebP ):

I metodi di conversione supportati da WebP express

Hai solo bisogno di uno di loro affinchè tutto funzioni. Dopo aver scelto il metodo, puoi selezionare la casella di controllo Convert on upload per gestire gli upload dei file in futuro e cambiare le immagini esistenti con il pulsante Bulk Convert.

Se scorri verso l’alto, è possibile configurare se desideri che WebP Express converta PNG e JPEG o solo un tipo di file. Puoi anche impostare soglie di compressione per i nuovi file:

Configurazione delle impostazioni di conversione delle immagini WebP.

Abbiamo provato le impostazioni predefinite e direi che funzionano perfettamente, con tassi di compressione superiori al 50 percento:

Un test di conversione WebP

WebP Express imposterà inoltre automaticamente le regole di redirect .htaccess per i file JPEG e PNG.

Sebbene altri plugin ti consentano di caricare immagini WebP o convertire file esistenti – alcuni esempi includono Optimole , Shortpixel e Smush Pro – per farlo richiedono licenze premium. Con WebP Express, puoi iniziare a utilizzare gratuitamente le immagini next-gen poiché gestisce le conversioni all’interno del tuo server.

Conclusione

Il software che utilizziamo per realizzare i nostri siti web si evolve continuamente. Non dovrebbe sorprendere il fatto che stiamo iniziando a utilizzare formati di immagine come WebP che forniscono file multimediali di alta qualità con file di dimensioni inferiori.

Sono molti i plugin che puoi utilizzare per aggiungere il supporto WebP a WordPress. Il plugin che consigliamo è WebP Express . Ti permette di convertire automaticamente file PNG e JPEG, abilitare il formato WebP per i nuovi caricamenti e servire PNG standard o JPEG ai browser che non supportano le soluzioni di nuova generazione.

Buon lavoro!