Cum se servesc imagini WebP în loc de JPG sau PNG cu WordPress

Publicat: 2019-11-20

Google se află în partea de sus a lanțului alimentar pe internet. Compania influențează (sau dictează) o mulțime de ceea ce se întâmplă online. Și noul lor format de imagine, WebP, continuă această tendință. Având în vedere că viteza de încărcare a paginii devine din ce în ce mai importantă (în principal din cauza Google Page Rank), dezvoltatorii și designerii consideră compresia imaginii ca fiind cea mai simplă modalitate de a reduce timpul de încărcare. Imaginile WebP ale Google vin cu ~ 30% mai mici decât imaginile tipice JPG sau PNG și păstrează o calitate echivalentă. Și, cel mai bine, nu trebuie să vă faceți griji cu privire la convertirea manuală a imaginilor dvs. în WebP.

În acest articol vă vom arăta cum să utilizați acest nou format de imagine cu WordPress, chiar dacă nu este încă acceptat în mod implicit.

Să ajungem la asta.

Abonați-vă la canalul nostru Youtube

Utilizarea Optimole pentru a servi WebP pe WordPress

WebP, ca format de imagine, nu este acceptat implicit în WordPress. Puteți încărca o imagine .webp, dar la fel ca un fișier SVG, veți găsi mesaje de eroare. Și din nou, la fel ca utilizarea fișierelor SVG cu WordPress, există o soluție ușoară prin intermediul pluginului pentru a vă mări site-ul WP.

Utilizarea imaginilor WebP cu WordPress

Dintre serviciile WebP pe care le-am încercat, favoritul nostru este Optimole. Am avut cel mai mare noroc când am reușit să funcționeze cu o ajustare minimă, așa că vrem să vă prezentăm cum să o configurați și să obțineți instalarea WordPress WebP compatibilă cât mai nedureros posibil.

În primul rând, evident, veți dori să descărcați și să instalați pluginul în sine. Este în repo WP.org și este complet gratuit. La fel și serviciul bazat pe API care îl alimentează (până la un punct). Deși este posibil să convertiți imagini tradiționale în WebP din mers folosind PHP, nu fiecare gazdă web oferă permisiunea serverului dvs. Dacă aveți permisiunea respectivă, puteți consulta și pluginul WebP Express . Aveți mult control cu ​​el, dar este unul care necesită mai multe modificări pentru a lucra fără probleme.

Odată ce ați instalat și activat Optimole pe site-ul dvs. WordPress, veți găsi o nouă opțiune de meniu la Media - Optimole .

Cheia dvs. API Optimole

Utilizarea imaginilor WebP cu WordPress

Înainte de a putea accesa orice setări sau configurații, trebuie să aveți un cont Optimole. Dacă ați configurat deja una, puteți face clic pe butonul Am deja o cheie API . În caz contrar, Înregistrați și e-mail cheia API . Contul de bază pentru o cheie API este gratuit și primiți aproximativ 5.000 de vizite pe acel nivel. Dacă aveți nevoie de mai mult decât atât, există nivele de preț disponibile.

Utilizarea imaginilor WebP cu WordPress

Optimole definește o vizită drept „ oricine vă vizitează site-ul o dată [. . .] Fiecare utilizator este numărat o singură dată. Nu contează ce fac pe site-ul dvs., câte imagini descarcă sau câte pagini vizitează; este doar un utilizator. Dacă părăsesc site-ul dvs. și se întorc în aceeași zi, ei sunt încă un singur utilizator.

Odată ce ați epuizat vizitele măsurate, doar imaginile WebP nu mai sunt difuzate. Imaginile tale în sine nu. Veți găsi cheia API în tabloul de bord Optimole chiar în partea de sus.

Utilizarea imaginilor WebP cu WordPress

Pur și simplu lipiți-l înapoi pe tabloul de bord WordPress și veți fi gata să începeți să difuzați imagini WebP cu WordPress.

Utilizarea imaginilor WebP cu WordPress

Tablourile de bord Optimole WordPress

În tabloul de bord WordPress, primiți câteva informații de bază despre optimizarea dvs. WebP. Acest lucru vă permite să depanați și să evaluați cât de reușită este de fapt accelerarea. În acest fel puteți intra și modifica diverse setări.

Utilizarea imaginilor WebP cu WordPress

Mai întâi, vedeți contul atașat API-ului, iar în partea de jos a ecranului, pluginul afișează cele mai recente imagini optimizate. Puteți vedea cât de mici sunt imaginile WebP care au fost difuzate din cele originale pe care le-ați încărcat pe WordPress.

Apoi, există fila Probleme posibile în partea de sus. Nimănui nu îi place să vadă fila evidențiată, dar trebuie să vedem și ce conflicte ar putea apărea.

Utilizarea imaginilor WebP cu WordPress

Problema principală cu care ne-am confruntat este cu alte pluginuri de compresie și livrare a imaginilor. După cum puteți vedea în imaginea de mai sus, pluginul Jetpack funcționează într-un mod similar cu Optimole prin intermediul Photon APIT, astfel încât să poată bate capetele. Pentru noi, acest lucru s-a manifestat ca nicio imagine care nu a fost livrată deloc vizitatorului. Nu am avut probleme cu alte servicii de compresie precum TinyPNG sau Smush.

Utilizarea tablourilor de bord

Dacă doriți informații mai detaliate despre modul în care funcționează site-ul dvs. cu WebP, tabloul de bord extern Optimole are aceste informații pentru dvs.

Utilizarea imaginilor WebP cu WordPress

În loc să fie pur și simplu de 9,5 ori mai mici, puteți vedea dimensiunile reale ale fișierelor care au fost difuzate. La fel ca și ce fișiere în sine pe o perioadă de 30 de zile.

Utilizarea imaginilor WebP cu WordPress

De asemenea, puteți seta filigranele în tabloul de bord Optimole (sau WP) astfel încât, atunci când cineva primește un WebP de pe site-ul dvs. WordPress, să aibă sigla dvs. blazonată automat. Este un proces simplu și obțineți controlul asupra opacității, locației și așa mai departe.

Utilizarea imaginilor WebP cu WordPress

În esență, puteți face aceleași lucruri din ambele tablouri de bord. Fie sub fila Setări din WordPress, fie vizitând linia externă de la Optimole. Depinde în totalitate de ceea ce vă faceți cel mai confortabil, precum și de ce nivel de date aveți nevoie la un moment dat.

În plus, veți putea controla nivelul de compresie, încărcarea leneșă și când / dacă anumite imagini sunt servite ca WebP pe baza numelor de fișiere. Toate acestea le veți găsi în fila Setări din Media - Optimole .

Utilizarea imaginilor WebP cu WordPress

Încheierea

Cea mai bună parte a utilizării WebP cu site-uri web WordPress este că nu trebuie să lucrați manual cu fișierele. Fără încărcări suplimentare, fără timp suplimentar de compresie, nimic. Datorită modului în care funcționează API-urile, toate calculele și procesele sunt rulate în timp real în timp real. Google chiar a făcut ca internetul să funcționeze mai repede folosind WebP, mai degrabă decât JPG sau PNG. Cu toate acestea, cel mai mare beneficiu este că imaginile păstrează aceeași calitate chiar și cu dimensiunile lor reduse semnificativ. Google poate fi auto-servit pentru a vă ajuta să utilizați formatul lor pentru a accelera site-ul dvs., astfel încât să vă poată clasifica mai sus, experiența utilizatorului final este, de asemenea, mai bună. Și asta contează în cele din urmă.

Ce părere aveți despre servirea imaginilor WebP vizitatorilor site-ului dvs. web?

Imagine prezentată de articol de vladwel / shutterstock.com