Hvernig nota á WebP skrár í WordPress og fækka hleðslutímum

webp skrár wordpress

Flest okkar vitum núna að hagræðing myndarinnar er mjög mikilvæg þar sem hún á stóran þátt í heildar hleðslutímum WordPress vefsíðunnar þinnar. Í dag viljum við deila með þér auðveldum valkosti um hvernig eigi að samþætta WebP skrár Google á WordPress síðuna þína. Sumir notendur hafa séð rúmlega 70% minnkun á stærð skráar!


Hvað er WebP?

Ef þú þekkir það ekki WebP, það er myndasnið sem stofnað var af frammistöðuhópnum hjá Google með það fyrir augum að búa til myndir sem eru minni og hraðari. Það var fyrst tilkynnt árið 2010 og inniheldur bæði taplausar og taplausar þjöppunaraðferðir. Myndirnar eru sendar í vafra frá vefþjóni sem byggist á MIME gerðinni sem hann notar sem er mynd / vefrit.

WebP taplausar myndir eru 26% minni að stærð miðað við PNG og WebP taplausar myndir 25-34% minni en JPEG.

Fyrirtæki eins og YouTube og eBay nota nú þegar WebP til að þegja mikið af síðum sínum hljóðalaust. Hér að neðan er dæmi frá eBay þar sem á heimasíðu þeirra eru að meðaltali um 30 WebP skrár.

webp notkun ebay

Af hverju er WebP svona mikilvægt? Samkvæmt httparchive, frá og með ágúst 2016, myndir eru meira en 64% af þyngd meðaltals vefsíðu. Venjulega er það meira en CSS, JS og HTML saman. Svo að velja öfluga myndfínstillingaraðferð og myndasnið eins og WebP er lykilatriði svo að þú getir lækkað þyngd síðunnar eins og mögulegt er. Almennt, því minni síðunni er því hraðari sem hún hleðst inn. Og það þóknast ekki aðeins gestum þínum, heldur einnig Google, sem síðuhraði er röðunarstuðull.

WebP stuðningur

Þó að WebP sé mjög spennandi er einnig mikilvægt að minnast á stuðning við vafra. Ekki allir nútíma vafrar styðja WebP eins og er. Samkvæmt caniuse, WebP er sem stendur stutt í Chrome 23+, Opera 39+, allar útgáfur af Opera mini, Android vafra 4.3+ og Chrome fyrir Android.

stuðningur við vefskoðara

En bíddu! Vertu ekki fyrir vonbrigðum, því í kennslustundinni sem við ætlum að sýna þér hér að neðan, þá er til aðferð til skila WebP skrám til studdra vafra og JPG / PNGs sem fallback. Þetta þýðir að vafrar sem ekki eru studdir sjá ekki brotna mynd, þeir munu bara sjá það sem þeir sáu áður. Hugsaðu um WebP sem viðbót við WordPress síðuna þína, frekar en fólksflutninga.

Samkvæmt W3Skólar, Chrome hefur einokun á markaðshlutdeild vafra og nemur rúmlega 70%. En ekki taka markaðshlutdeild bara sem trausta sönnun, skoðaðu gögn gesta þinna og sjáðu hvaða vafra þeir nota, því það gæti verið mismunandi miðað við sess þinn. Þú gætir verið hissa á því hversu skakkt ástandið er. Í Google Analytics undir „Áhorfendur“ geturðu smellt á „Vafra og stýrikerfi“ og séð hvaða vafra fólk notar þegar þeir lenda á síðuna þína. Við drógum af handahófi vefsíðu og eins og þú sérð hér að neðan eru 67% gesta frá Chrome og önnur 1% frá Opera. Svo 68% af þessu fólki getur skoðað og notið góðs af WebP snið myndar!

króm vefskoðarar

Hvernig á að nota WebP skrár í WordPress

Í dæminu í dag ætlum við að nota blöndu af tveimur mismunandi WordPress viðbótum til að koma WebP upp og keyra í WordPress. Þetta er búið til og þróað af teyminu hjá KeyCDN, sem er alþjóðlegt netkerfi fyrir afhendingu efnis (CDN).

  1. [iðgjald] Optimus Image Optimizer: Lauslaust myndþjöppunarviðbót fyrir WordPress, breytir myndum í WebP
  2. [ókeypis] WordPress skyndiminni: Skyndiminni viðbót sem gerir þér kleift að þjóna WebP til stuðningsmanna vafra

Optimus Image Optimizer

Þú getur halað Optimus Image Optimizer frá WordPress geymsla, frá optimus.io, eða innan í stjórnborðið fyrir viðbætur. Athugasemd: Það þarfnast aukagjaldsleyfis ef þú vilt umbreyta myndunum þínum í WebP. Þegar það hefur verið sett upp er hægt að virkja „Búa til WebP skrár“ í viðbótarstillingunum.

stofnun vefsíðuskráa

Eftir að WebP er virkt skapar þetta í raun viðbótarmynd fyrir allt sem er breytt. Svo ef þú hleður upp PNG skrá eða JPG, þá er nú líka .webp útgáfa af myndinni þinni. Mundu að PNG / JPG er enn þörf vegna þess að þau eru notuð til að þjóna óstuddum vöfrum. Optimus gerir taplaus þjöppun, svo PNG og JPG eru líka þjöppuð.

webp og png skrár

Það er líka mikill fínstillingarvalkostur ef þú hefur þegar þjappað saman myndunum þínum áður og þarft enn að umbreyta þeim í WebP.

fínstillingu íhluta

WordPress skyndiminni

Svo nú þegar þú ert með WebP myndir þarftu leið til að segja WordPress að þjóna upp WebP myndum fyrir studda vafra og PNG / JPG fyrir hina vafra. Þetta er hægt að ná með ókeypis WordPress Cache Enabler viðbótinni. Þú getur halað niður viðbótinni frá WordPress geymsla eða settu það upp inni í stjórnborði tappans. Þegar það er sett upp geturðu gert „Búa til viðbótar útgáfu af skyndiminni af WebP“ í viðbótarstillingunum.

stillingar skyndiminnis

Þegar þú hefur gert þann möguleika virka verður viðbótarskynda vefútgáfa af síðunni þinni búinn til.webp útgáfur

Og það er það! Nú ættirðu að hafa WebP skrár sem keyra á WordPress vefsíðunni þinni.

JPG til WebP samanburðar

Við keyrðum samanburð á JPG til WebP til að sýna muninn sem þú getur náð.

SKRÁARNAFNORIGINAL JPGSAMANTEKT JPGWEBP FORMATStærðarmunur%
jpg-til-webp-1.jpg758 KB685 KB109 KB86%
jpg-til-webp-2.jpg599 KB529 KB58,8 KB90%
jpg-til-webp-3.jpg960 KB881 KB200 KB79%
jpg-til-webp-4.jpg862 KB791 KB146 KB83%
jpg-til-webp-5.jpg960 KB877 KB71,7 KB93%

WebP leiddi til a 85,87% lækkun á meðaltali myndastærðar.

PNG við WebP samanburð

Aftur, við keyrðum líka samanburð á PNG við WebP til að sýna muninn sem þú getur náð.

SkráarnafnUpprunaleg PNGÞjappað PNGWebP sniðStærðarmismunur%
png-til-webp-1.png44 KB34 KB30 KB32%
png-til-webp-2.png46 KB35 KB33 KB28%
png-til-webp-3.png43 KB31 KB25 KB42%
png-til-webp-4.png30 KB24 KB18 KB40%
png-til-webp-5.png15 KB11 KB8 KB47%
png-til-webp-6.png34 KB24 KB18 KB47%
png-til-webp-7.png15 KB13 KB8 KB47%
png-til-webp-8.png63 KB47 KB44 KB30%
png-til-webp-9.png48 KB36 KB33 KB31%
png-til-webp-10.png17 KB14 KB11 KB35%
png-til-webp-11.png18 KB13 KB9 KB50%
png-til-webp-12.png61 KB45 KB39 KB36%
png-til-webp-13.png32 KB25 KB21 KB35%
png-til-webp-14.png26 KB21 KB17 KB35%
png-til-webp-15.png14 KB12 KB9 KB36%
png-til-webp-16.png36 KB27 KB24 KB33%
png-til-webp-17.png14 KB12 KB8 KB43%
png-til-webp-18.png21 KB18 KB13 KB38%
png-til-webp-19.png42 KB30 KB27 KB36%
png-til-webp-20.png23 KB20 KB18 KB22%

WebP leiddi til a 42,8% lækkun á meðaltali myndastærðar.

Yfirlit

Eins og þú sérð er WebP mjög auðvelt að útfæra á WordPress síðuna þína og þú getur náð verulega minni myndastærðum! Það er engin mynd þjöppun þarna úti sem getur borið saman við sparnað WebP. Ó, og minntumst við á að WebP hefur getu til að nota taplaus þjöppun? Það þýðir að þú munt ekki sjá merkjanlegt gæðatap. Ef þú ert að leita að betri leið til að flýta fyrir WordPress getur WebP verið frábær lausn.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map