Come servire immagini WebP invece di JPG o PNG con WordPress

Pubblicato: 2019-11-20

Google si trova in cima alla catena alimentare di Internet. L'azienda influenza (o impone) molto di ciò che accade online. E il loro nuovo formato di immagine, WebP, continua questa tendenza. Con la velocità di caricamento della pagina sempre più importante (principalmente a causa del Page Rank di Google), sviluppatori e designer considerano la compressione delle immagini come il modo più semplice per ridurre i tempi di caricamento. Le immagini WebP di Google sono più piccole del 30% circa rispetto alle tipiche immagini JPG o PNG e mantengono una qualità equivalente. E soprattutto, non devi preoccuparti di convertire manualmente le tue immagini in WebP.

In questo articolo ti mostreremo come utilizzare questo nuovo formato immagine con WordPress, anche se non è ancora supportato per impostazione predefinita.

Andiamo ad esso.

Iscriviti al nostro canale Youtube

Utilizzo di Optimole per servire WebP su WordPress

WebP, come formato immagine, non è supportato per impostazione predefinita in WordPress. Puoi caricare un'immagine .webp, ma proprio come un file SVG, ti ritroverai a ricevere messaggi di errore. E ancora, come usare i file SVG con WordPress, c'è una soluzione semplice tramite plug-in per ottenere lo zoom del tuo sito WP.

Utilizzo di immagini WebP con WordPress

Dei servizi WebP che abbiamo provato, il nostro preferito è Optimole. Abbiamo avuto la fortuna di farlo funzionare con il minimo tweaking, quindi vogliamo guidarti attraverso come configurarlo e rendere la tua installazione di WordPress compatibile con WebP nel modo più semplice possibile.

Per prima cosa, ovviamente, vorrai scaricare e installare il plugin stesso. È nel repository WP.org ed è totalmente gratuito. Così come il servizio basato su API che lo alimenta (fino a un certo punto). Sebbene sia possibile convertire al volo immagini tradizionali in WebP utilizzando PHP, non tutti gli host web concedono al tuo server tale autorizzazione. Se disponi di tale autorizzazione, puoi anche esaminare il plug-in WebP Express . Ottieni molto controllo con esso, ma è uno che richiede più modifiche per funzionare senza problemi.

Una volta installato e attivato Optimole sul tuo sito Web WordPress, troverai una nuova opzione di menu su Media – Optimole .

La tua chiave API Optimole

Utilizzo di immagini WebP con WordPress

Prima di poter accedere a qualsiasi impostazione o configurazione, è necessario disporre di un account Optimole. Se ne hai già impostato uno, puoi fare clic sul pulsante Ho già una chiave API . In caso contrario, registrati e invia tramite e-mail la chiave API . L'account di base per una chiave API è gratuito e ricevi circa 5.000 visite su quel livello. Se hai bisogno di più di questo, sono disponibili fasce di prezzo.

Utilizzo di immagini WebP con WordPress

Optimole definisce una visita come " chiunque visiti il ​​tuo sito una volta [. . .] Ogni utente viene conteggiato una sola volta. Non importa cosa fanno sul tuo sito, quante immagini scaricano o quante pagine visitano; è solo un utente. Se lasciano il tuo sito e tornano lo stesso giorno, sono ancora solo un utente. "

Una volta esaurite le visite misurate, solo le immagini WebP smettono di essere pubblicate. Le tue stesse immagini non lo fanno. Troverai la chiave API nella tua dashboard Optimole in alto.

Utilizzo di immagini WebP con WordPress

Basta incollarlo di nuovo sulla dashboard di WordPress e sarai pronto per iniziare a servire immagini WebP con WordPress.

Utilizzo di immagini WebP con WordPress

I tuoi cruscotti WordPress Optimole

Nella dashboard di WordPress, ottieni alcune informazioni di base sull'ottimizzazione di WebP. Ciò ti consente di risolvere i problemi e valutare il successo effettivo dell'accelerazione. In questo modo puoi entrare e modificare varie impostazioni.

Utilizzo di immagini WebP con WordPress

Innanzitutto, vedi l'account allegato all'API e, nella parte inferiore dello schermo, il plug-in visualizza le immagini ottimizzate più di recente. Puoi vedere quanto sono più piccole le immagini WebP che sono state servite rispetto a quelle originali che hai caricato su WordPress.

Poi c'è la scheda Possibili problemi in alto. A nessuno piace vedere la scheda evidenziata, ma tutti abbiamo anche bisogno di vedere quali conflitti potrebbero sorgere.

Utilizzo di immagini WebP con WordPress

Il problema principale che abbiamo dovuto affrontare è con altri plug-in di compressione e consegna delle immagini. Come puoi vedere nell'immagine sopra, il plug-in Jetpack funziona in modo simile a Optimole tramite l'APIT Photon, quindi possono urtare le teste. Per noi, questo si è manifestato come nessuna immagine consegnata al visitatore. Non abbiamo avuto problemi con altri servizi di compressione come TinyPNG o Smush.

Utilizzo dei dashboard

Se desideri informazioni più dettagliate su come sta andando il tuo sito con WebP, la dashboard esterna di Optimole ha queste informazioni per te.

Utilizzo di immagini WebP con WordPress

Invece di essere semplicemente 9,5 volte più piccolo, puoi vedere le dimensioni effettive dei file che sono state pubblicate. Oltre a quali file stessi in un periodo di 30 giorni.

Utilizzo di immagini WebP con WordPress

Puoi anche impostare filigrane nella dashboard di Optimole (o WP) in modo che quando qualcuno riceve un WebP dal tuo sito WordPress, il tuo logo verrà automaticamente visualizzato. È un processo semplice e puoi controllare l'opacità, la posizione e così via.

Utilizzo di immagini WebP con WordPress

Puoi essenzialmente fare le stesse cose da entrambe le dashboard. O nella scheda Impostazioni in WordPress o visitando il trattino esterno su Optimole. Dipende interamente da cosa ti senti più a tuo agio e dal livello di dati di cui hai bisogno in un dato momento.

Inoltre, sarai in grado di controllare il livello di compressione, caricamento lento e quando/se determinate immagini vengono servite come WebP in base ai nomi dei file. Troverai tutto questo nella scheda Impostazioni di Media – Optimole .

Utilizzo di immagini WebP con WordPress

Avvolgendo

La parte migliore dell'utilizzo di WebP con i siti Web WordPress è che non è necessario lavorare manualmente con i file. Nessun caricamento extra, nessun tempo di compressione extra, niente. A causa del funzionamento delle API, tutti i calcoli e i processi vengono eseguiti al volo in tempo reale. Google ha davvero reso Internet più veloce utilizzando WebP anziché JPG o PNG. Il vantaggio più grande, tuttavia, è che le immagini mantengono la stessa qualità anche con dimensioni notevolmente ridotte. Potrebbe essere egoistico da parte di Google farti usare il loro formato per velocizzare il tuo sito in modo che possano classificarti più in alto, anche l'esperienza dell'utente finale è migliore. Ed è questo che conta alla fine.

Che ne pensi di offrire immagini WebP ai visitatori del tuo sito web?

Immagine in primo piano dell'articolo di vladwel / shutterstock.com