Vad Àr WebP? Plus hur man anvÀnder WebP-bilder i WordPress

 Vad Àr WebP?  Plus hur man anvÀnder WebP-bilder i WordPress

WebP Ă€r ett webbbildformat utvecklat av Google som kan erbjuda mindre bildfilstorlekar med samma kvalitetsnivĂ„ som befintliga bildformat. I det hĂ€r inlĂ€gget kommer vi att grĂ€va vidare i frĂ„gan om “vad Ă€r WebP?” och dela mer om formatet.

Vi kommer ocksÄ att prata om för- och nackdelar med WebP-bilder och hur du kan börja anvÀnda WebP-bilder pÄ din WordPress-webbplats.

Vad Àr WebP? Förklaras mer detaljerat

NĂ€r det gĂ€ller att spara bilder för anvĂ€ndning pĂ„ webben finns det ett antal filtyper du kan anvĂ€nda. De tre vanligaste alternativen Ă€r PNG, JPEG (eller JPG) och GIF. Även om dessa format Ă€r populĂ€ra, har alla sina egna unika fördelar och nackdelar:

JPEG: er kan visa mycket detaljerade bilder med mÄnga fÀrger, vilket gör dem perfekta för fotografier. Samtidigt Àr filerna ofta mycket stora och hÄller inte alltid bra under komprimering.
PNG Àr idealiska för bilder utan mycket data inblandade, till exempel logotyper eller skÀrmdumpar för grÀnssnitt. De Àr utmÀrkta för att behÄlla kvaliteten nÀr de komprimeras och stöder transparens, men fungerar inte bra för fotografier.
GIF Àr utmÀrkta för animationer, men inte bra för att spara statiska bilder.

WebP-bilder Àr ett bildformat frÄn Google utformat för att lÄta dig visa bilder pÄ webben med samma kvalitetsnivÄ som befintliga bildformat, men med en mindre filstorlek.

För att uppnĂ„ detta tillhandahĂ„ller WebP bĂ„de ‘lossy’ och ‘lossless’ komprimeringsalternativ. Den senare bevarar mer data, medan den förra gör de resulterande filstorlekarna Ă€nnu mindre.

Enligt Googles data Àr WebP-bilder:

25-34% mindre i storlek Àn jÀmförbara JPEG-bilder.
26% mindre i storlek jÀmfört med PNG.

Du kan se en fullstÀndig jÀmförelse sida vid sida i WebP Gallery.

Fördelarna och nackdelarna med att anvÀnda WebP-bilder pÄ din webbplats

Nu nĂ€r vi har svarat pĂ„ frĂ„gan “vad Ă€r WebP?”, LĂ„t oss prata om varför det betyder nĂ„got genom att diskutera för- och nackdelar med WebP-bilder.

Fördelar med WebP-bilder

Som vi redan har antytt Àr det primÀra mÄlet med detta bildformat att tillhandahÄlla ett webbfokuserat alternativ som Àr överlÀgset bÄde PNG och JPEG i de flesta situationer.

Bildfiler tar plats – oavsett hur de sparas. Ju fler bilder och andra media du lĂ€gger till pĂ„ din webbplats, desto större Ă€r chansen för laggy prestanda. Att hĂ„lla dina sidor laddade snabbt Ă€r oerhört viktigt eftersom lĂ„ga hastigheter driver bort besökare innan de ens har sett vad du har att erbjuda.

Komprimering av bildfiler gör dem mindre och effektivare, men har vanligtvis en förlust av kvalitet. Generellt, ju mer du komprimerar en bild, desto sÀmre ser den ut. Den specifika filtypen du anvÀnder har dock en inverkan pÄ hur extrem effekten Àr.

Bilder som sparas i ett WebP-format kan göras betydligt mindre Ă€n JPEG och PNG med samma kvalitet. Återigen fungerar förlustfria WebP-bilder som en ersĂ€ttning för PNG-filer, och filerna Ă€r cirka 26% mindre. Förlorade WebP-bilder Ă€r Ă„ andra sidan cirka 25-34% mindre Ă€n JPEG-bilder.

Det Ă€r ocksĂ„ anmĂ€rkningsvĂ€rt att bĂ„da typerna av WebP-bilder stöder transparens. Transparenta bilder Ă€r otroligt anvĂ€ndbara pĂ„ webben – du kan anvĂ€nda dem för logotyper och andra varumĂ€rken, precis som ett exempel. JPEG-filer erbjuder inte öppenhet som en funktion, men förlorade WebP-bilder gör det.

Nackdelar med WebP-bilder

Om WebP erbjuder sÄ mÄnga fördelar, varför anvÀnds det inte av fler mÀnniskor? Den frÀmsta nackdelen Àr att WebP-bilder Àr stöds för nÀrvarande inte av alla webblÀsare, Àven om fler och fler webblÀsare har lagt till stöd.

HÀr Àr en jÀmförelse av det aktuella webblÀsarstödet frÄn och med januari 2020, tillsammans med varje webblÀsares marknadsandel pÄ skrivbordet och mobilen nÀr det finns:

Support WebP:

Chrome – 68,78% desktop / 61,71% mobil Firefox (endast stationĂ€r dator) – 9,87% Edge – 4,7% desktop Opera – 2,44% desktop / 2,14% mobil Samsung Internet – 6,4% mobil Baidu-webblĂ€sare

Inget WebP-stöd:

Safari – 8,64% stationĂ€r / 22,84% mobil Internet Explorer – 3,7% stationĂ€r Firefox för Android – <1% mobil UC-webblĂ€sare för Android - 4,79% mobil

SÄ medan webblÀsare nu erbjuder WebP-support finns det fortfarande ett icke-trivialt nummer som inte har stöd (.

Lyckligtvis tappar du ingenting genom att anvÀnda WebP pÄ din webbplats, eftersom du helt enkelt kan inkludera PNG- och / eller JPEG-bilder som visas för besökare med webblÀsare som inte stöder WebP-bilder. Detta krÀver lite mer arbete, men kan vara vÀrt det för prestandabesparingarna.

Hur man anvÀnder WebP-bilder pÄ din WordPress-webbplats

Naturligtvis rĂ€cker det som WordPress-anvĂ€ndare inte att frĂ„ga ”vad Ă€r WebP?” Du mĂ„ste ocksĂ„ veta om den hĂ€r typen av bilder kan anvĂ€ndas tillsammans med WordPress. Precis som webblĂ€sare stöder inte alla webbplatsbyggare och innehĂ„llshanteringssystem (CMS) WebP-formatet.

Den dĂ„liga nyheten Ă€r att WordPress för nĂ€rvarande inte stöder WebP-bilder. Du kan dock fortfarande anvĂ€nda WebP-formatet pĂ„ din webbplats – det krĂ€ver bara ett eller flera ytterligare verktyg.

Optimole

Optimole Àr vÄr nya bildoptimeringslösning som har en hel del coola funktioner under huven. Förutom att kunna optimera alla dina bilder automatiskt och sedan fÄ dem serverade via en CDN, fÄr du ocksÄ uppleva fördelarna med WebP-bilder.

SÀttet som Optimole möjliggör WebP-bilder Àr ganska snyggt. Plugin konverterar dina bilder till WebP automatiskt om besökarens webblÀsare stöder dem. Om webblÀsaren inte stöder WebP kommer en normal version av bilden att visas.

Det finns ocksÄ alternativa verktyg som möjliggör WebP-bilder om du vill experimentera mer med vad som finns dÀr ute.

Jetpack har en bild-CDN-modul som fungerar med WebP-bilder. Du kan ocksÄ aktivera WebP genom att kombinera ShortPixel / EWWW Image Optimizer med Cache Enabler. BÄda dessa instÀllningar för bildoptimering lÄter dig konvertera dina JPEG: er och PNG: er till WebP-bilder. Sedan kan du anvÀnda plugin-programmet Cache Enabler för att faktiskt servera dessa filer upp till besökare med webblÀsare som stöder WebP. NÀr du har installerat Cache Enabler, gÄ till i instrumentpanelen och vÀlj.

NÄgon av dessa metoder kommer att fÄ jobbet gjort, sÄ du Àr fri att anvÀnda de plugins du föredrar. PrestandaförbÀttringen pÄ din webbplats kan vara betydande, sÄ det Àr vÀrt att stÀlla in en av dessa lösningar om du har en bildtung webbplats.

Slutsats

Vad Àr WebP? Det Àr en bildfiltyp som har potential att pÄskynda din webbplats, Ànnu mer Àn genom att anvÀnda komprimerade PNG eller JPEG. WebP finns i bÄde förlustfria och förlustfria sorter och producerar mindre filstorlekar av jÀmförbar kvalitet.

Även om dess popularitet vĂ€xer stöds WebP Ă€nnu inte i alla webblĂ€sare. Det kan dock fortfarande vara vĂ€rt att anvĂ€nda det hĂ€r bildformatet pĂ„ din webbplats, speciellt om du laddar upp mĂ„nga bilder. Som WordPress-anvĂ€ndare har du flera alternativ för att stĂ€lla in WebP-support – en av de bĂ€sta Ă€r Optimole.