{"id":36432,"date":"2020-07-21T01:16:47","date_gmt":"2020-07-21T08:16:47","guid":{"rendered":"https:\/\/kinsta.com\/?p=72780"},"modified":"2023-09-21T12:28:14","modified_gmt":"2023-09-21T12:28:14","slug":"webp","status":"publish","type":"post","link":"https:\/\/kinsta.com\/se\/blog\/webp\/","title":{"rendered":"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)"},"content":{"rendered":"<p>Om du vill <a href=\"https:\/\/kinsta.com\/se\/lar\/snabba-upp-wordpress\/\">snabba upp din WordPress-webbplats<\/a>\u00a0s\u00e5 kan du f\u00e5 en betydande avkastning p\u00e5 din investering genom att minska filstorleken p\u00e5 dina bilder. I genomsnitt s\u00e5 st\u00e5r bilderna f\u00f6r ungef\u00e4r h\u00e4lften av filstorleken p\u00e5 en webbsida. Som ett resultat s\u00e5 kan \u00e4ven mindre f\u00f6rb\u00e4ttringar ge enorma resultat. WebP kan hj\u00e4lpa dig enormt mycket med detta!<\/p>\n<p>WebP \u00e4r ett modernt bildformat som kan hj\u00e4lpa dig att minska storleken p\u00e5 dina bilder utan att \u00e4ndra deras utseende. Om du l\u00e4r dig att konvertera en bild till WebP s\u00e5 kan du i genomsnitt minska dess filstorlek med ~25-35 % utan n\u00e5gon m\u00e4rkbar kvalitetsf\u00f6rlust.<\/p>\n<p>De flesta <a href=\"https:\/\/kinsta.com\/se\/marknadsandel-for-webblasare\/\">moderna webbl\u00e4sare<\/a> och <a href=\"https:\/\/kinsta.com\/se\/blog\/wordpress-5-8\/\">WordPress 5.8+<\/a> har st\u00f6d f\u00f6r WebP. I den h\u00e4r artikeln s\u00e5 kommer vi att djupdyka in i detta sp\u00e4nnande nya bildformat och visa hur du kan utnyttja dess fantastiska egenskaper.<\/p>\n<p>\u00c4r du redo? D\u00e5 s\u00e4tter vi ig\u00e5ng!<\/p>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc>\n<h2>Vad \u00e4r WebP?<\/h2>\n<p>Vad \u00e4r en WebP-fil? I ett n\u00f6tskal s\u00e5 \u00e4r WebP ett bildformat som har utvecklats av Google f\u00f6r att g\u00f6ra bilder mer optimerade \u00e4n popul\u00e4ra bildformat (p\u00e5 den tiden). Det finns exempelvis bildformat som <a href=\"https:\/\/kinsta.com\/se\/blog\/jpg-vs-jpeg\/\">JPEG eller JPG<\/a> och PNG.<\/p>\n<p><strong>Obs:<\/strong> Kolla in hur <a href=\"https:\/\/kinsta.com\/se\/blog\/basta-bildfilstyperna\/\">olika bildfilstyper<\/a> kan p\u00e5verka hastigheten p\u00e5 din webbplats.<\/p>\n<p>WebP fokuserar p\u00e5 att leverera samma bildfil, bara med mindre filstorlekar. Genom att minska storleken p\u00e5 dina bildfiler s\u00e5 kan du fortfarande ge bes\u00f6karna p\u00e5 din webbplats samma upplevelse, men <a href=\"https:\/\/kinsta.com\/learn\/page-speed\/\">din webbplats laddas snabbare<\/a>.<\/p>\n<p>I <a href=\"https:\/\/developers.google.com\/speed\/webp\/docs\/webp_study\" target=\"_blank\" rel=\"noopener noreferrer\">Google\u2019s unders\u00f6kning av WebP-komprimering<\/a>\u00a0s\u00e5 fann Google exempelvis att en WebP-bildfil i genomsnitt \u00e4r:<\/p>\n<ul>\n<li>25-34 % mindre \u00e4n en j\u00e4mf\u00f6rbar JPEG-bild.<\/li>\n<li>26 % mindre \u00e4n en j\u00e4mf\u00f6rbar PNG-bild.<\/li>\n<\/ul>\n<p>Detta \u00e4r anledningen till att om du <a href=\"https:\/\/kinsta.com\/se\/blog\/google-pagespeed-insights\/\">k\u00f6r din webbplats genom PageSpeed Insights<\/a>\u00a0s\u00e5 \u00e4r en av de m\u00e5nga rekommendationerna att <strong>servera bilder i n\u00e4sta generations format som WebP<\/strong>:<\/p>\n<figure id=\"attachment_72785\" aria-describedby=\"caption-attachment-72785\" style=\"width: 1024px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-72785 size-large\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/05\/google-pagespeed-insights-1024x621.png\" alt=\"Google PageSpeed Insights f\u00f6resl\u00e5r att man anv\u00e4nder WebP-bilder\" width=\"1024\" height=\"621\"><figcaption id=\"caption-attachment-72785\" class=\"wp-caption-text\">Google PageSpeed Insights f\u00f6resl\u00e5r att man anv\u00e4nder WebP-bilder<\/figcaption><\/figure>\n<p>S\u00e5 hur uppn\u00e5r Google\u2019s WebP-format dessa minskningar av filstorleken?<\/p>\n<p>F\u00f6r det f\u00f6rsta s\u00e5 har det st\u00f6d f\u00f6r <a href=\"https:\/\/kinsta.com\/blog\/lossy-vs-lossless\/\">f\u00f6rst\u00f6rande komprimering och f\u00f6rlustfri komprimering<\/a>. Den exakta minskningen beror med andra ord p\u00e5 om du anv\u00e4nder f\u00f6rst\u00f6rande komprimering eller f\u00f6rlustfri komprimering.<\/p>\n<p>Med f\u00f6rst\u00f6rande komprimering s\u00e5 anv\u00e4nder WebP n\u00e5got som kallas &#8221;prediktiv kodning&#8221; f\u00f6r att minska filstorleken. Prediktiv kodning anv\u00e4nder v\u00e4rdena f\u00f6r n\u00e4rliggande pixlar i en bild f\u00f6r att f\u00f6ruts\u00e4ga v\u00e4rden och kodar sedan bara skillnaden. Den \u00e4r baserad p\u00e5 VP8 key frame-kodning.<\/p>\n<p>F\u00f6rlustfri WebP anv\u00e4nder en mycket mer komplicerad upps\u00e4ttning av metoder som har utvecklats av WebP-teamet.<\/p>\n<p>Om du vill l\u00e4ra dig mer om WebP-komprimeringsteknikerna i detalj s\u00e5 \u00e4r den <a href=\"https:\/\/developers.google.com\/speed\/webp\/docs\/compression\" target=\"_blank\" rel=\"noopener noreferrer\">h\u00e4r artikeln en bra utg\u00e5ngspunkt<\/a>.<\/p>\n<h2>Vilka webbl\u00e4sare st\u00f6der WebP?<\/h2>\n<p>F\u00f6r att WebP-bilder ska fungera s\u00e5 m\u00e5ste bes\u00f6karens webbl\u00e4sare ha st\u00f6d f\u00f6r dem. \u00c4ven om webbl\u00e4sarst\u00f6det har \u00f6kat mycket s\u00e5 \u00e4r <strong>kompatibiliteten med WebP<\/strong> <strong>tyv\u00e4rr<\/strong> <strong>fortfarande inte universell<\/strong>.<\/p>\n<p>WebP-bilder st\u00f6ds av popul\u00e4ra webbl\u00e4sare som exempelvis:<\/p>\n<ul>\n<li>Chrome (<em>dator och mobil<\/em>)<\/li>\n<li>Firefox (<em>dator och mobil<\/em>)<\/li>\n<li>Microsoft Edge<\/li>\n<li>iOS och macOS Safari (<em>endast macOS 11 Big Sur och senare<\/em>)<\/li>\n<li>Opera (<em>dator och mobil<\/em>)<\/li>\n<\/ul>\n<p>N\u00e4r vi skriver det h\u00e4r inl\u00e4gget s\u00e5 har Safari endast delvis st\u00f6d f\u00f6r WebP-bilder.<\/p>\n<p>Internet Explorer saknar ocks\u00e5 WebP-st\u00f6d (men Edge st\u00f6der WebP eftersom den \u00e4r baserad p\u00e5 Chromium). IE-anv\u00e4ndningen har dock krympt till mindre \u00e4n 1 % av alla internetanv\u00e4ndare. Det \u00e4r en v\u00e4lsignelse f\u00f6r alla p\u00e5 webben!<\/p>\n<p>Totalt sett s\u00e5 anv\u00e4nder <a href=\"https:\/\/caniuse.com\/#feat=webp\" target=\"_blank\" rel=\"noopener noreferrer\">cirka 95 % av internetanv\u00e4ndarna<\/a> en webbl\u00e4sare med st\u00f6d f\u00f6r WebP. S\u00e5 \u00e4ven om det verkligen har ett majoritetsst\u00f6d s\u00e5 \u00e4r dessa 5 % ett mindre hinder. S\u00e4rskilt n\u00e4r det handlar om Safari-anv\u00e4ndare p\u00e5 \u00e4ldre macOS-versioner. I v\u00e5r WordPress WebP-handledning nedan s\u00e5 visar vi dig hur du hanterar detta s\u00e5 att alla dina bes\u00f6kare f\u00e5r en bra upplevelse.<\/p>\n<figure id=\"attachment_99587\" aria-describedby=\"caption-attachment-99587\" style=\"width: 1100px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-99587 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/06\/WebP-Browsers-Support-CanIUse.jpg\" alt=\"WebP-st\u00f6d i alla st\u00f6rre webbl\u00e4sare.\" width=\"1100\" height=\"584\"><figcaption id=\"caption-attachment-99587\" class=\"wp-caption-text\">WebP-st\u00f6d i alla st\u00f6rre webbl\u00e4sare.<\/figcaption><\/figure>\n<h2>J\u00e4mf\u00f6relse av WebP vs JPG vs PNG storlek<\/h2>\n<p>Enligt Google\u2019s tester s\u00e5 \u00e4r WebP-bilder:<\/p>\n<ul>\n<li>25-34 % mindre \u00e4n j\u00e4mf\u00f6rbara JPEG-bilder.<\/li>\n<li>26 % mindre \u00e4n liknande PNG-bilder.<\/li>\n<\/ul>\n<p>Om du vill veta mer om Google\u2019s metodik s\u00e5 hittar du direktl\u00e4nkar till de fullst\u00e4ndiga resultaten nedan:<\/p>\n<ul>\n<li><a href=\"https:\/\/developers.google.com\/speed\/webp\/docs\/webp_study\" target=\"_blank\" rel=\"noopener noreferrer\">JPEG<\/a><\/li>\n<li><a href=\"https:\/\/developers.google.com\/speed\/webp\/docs\/webp_lossless_alpha_study#results\" target=\"_blank\" rel=\"noopener noreferrer\">PNG<\/a><\/li>\n<\/ul>\n<p>B\u00e5da testerna \u00e4r baserade p\u00e5 \u00f6ver 11 000 bilder, bland annat:<\/p>\n<ul>\n<li>Den ber\u00f6mda <a href=\"https:\/\/en.wikipedia.org\/wiki\/Lenna\" target=\"_blank\" rel=\"noopener noreferrer\">Lenna-bilden<\/a><\/li>\n<li>24 bilder fr\u00e5n <a href=\"http:\/\/r0k.us\/graphics\/kodak\/\" target=\"_blank\" rel=\"noopener noreferrer\">Kodaks bildsvit med \u00e4kta f\u00e4rger<\/a><\/li>\n<li>100 bilder fr\u00e5n Tecnick.com<\/li>\n<li>Ett slumpm\u00e4ssigt urval av \u00f6ver 11 000 bilder fr\u00e5n Google Image Search<\/li>\n<\/ul>\n<h2>S\u00e5 h\u00e4r anv\u00e4nder du WebP-bilder i WordPress<\/h2>\n<p>Fr\u00e5n och med <a href=\"https:\/\/kinsta.com\/se\/blog\/wordpress-5-8\/\">WordPress 5.8<\/a>\u00a0s\u00e5 kan du anv\u00e4nda bildformatet WebP p\u00e5 samma s\u00e4tt som JPEG-, PNG- och GIF-format. Det \u00e4r bara att <a href=\"https:\/\/kinsta.com\/se\/blog\/wordpress-mediebibliotek\/\">ladda upp bilderna till mediebiblioteket<\/a> och inkludera dem i ditt inneh\u00e5ll. WordPress 5.8+ har st\u00f6d f\u00f6r WebP-formatet som standard. Som ett resultat s\u00e5 beh\u00f6ver du inte installera plugins fr\u00e5n tredje part f\u00f6r att ladda upp WebP-bilder. Det borde r\u00e4cka f\u00f6r de flesta vanliga anv\u00e4ndningsomr\u00e5den.<\/p>\n<p>Om du vill komma ig\u00e5ng direkt s\u00e5 kan du l\u00e4sa v\u00e5r snabbguide om hur man <a href=\"https:\/\/kinsta.com\/se\/blog\/wordpress-5-8\/#how-to-use-webp-images-in-wordpress\">anv\u00e4nder WebP-bilder i WordPress 5.8+<\/a>. Vi f\u00f6resl\u00e5r att du g\u00e5r igenom <a href=\"https:\/\/kinsta.com\/se\/blog\/wordpress-5-8\/#caveats-about-webp-in-wordpress-58\">varningarna om WebP-st\u00f6det i WordPress<\/a>.<\/p>\n<p>Omkring 5 % av alla (fr\u00e4mst Safari-anv\u00e4ndare p\u00e5 \u00e4ldre macOS) anv\u00e4nder dock en webbl\u00e4sare som inte st\u00f6der WebP. Om du konverterar WebP-bilder och anv\u00e4nder dem direkt i <a href=\"https:\/\/kinsta.com\/se\/topics\/innehallsstrategi\/\">ditt inneh\u00e5ll<\/a>\u00a0s\u00e5 kan dessa bes\u00f6kare inte se dina bilder. Detta f\u00f6rst\u00f6r deras surfupplevelse.<\/p>\n<p>Det \u00e4r dessutom inte lika enkelt att generera WebP-bilder som att f\u00e5 fram en JPG\/JPEG-bild, som \u00e4r standardformatet f\u00f6r bildfiler i de flesta kameror, smartphones och <a href=\"https:\/\/kinsta.com\/se\/blog\/gratis-bilder-for-wordpress\/\">bildbibliotek online<\/a>. WordPress st\u00f6der inte automatisk bildkonvertering till WebP-format (\u00e4nnu!).<\/p>\n<p>Det \u00e4r dock ingen fara! Det finns en l\u00f6sning.<\/p>\n<p>Du kan anv\u00e4nda ett WordPress-plugin som konverterar dina originalbilder till WebP-formatet <strong>och som \u00e4ven<\/strong>\u00a0<strong>tillhandah\u00e5ller originalbilden<\/strong> som en reservl\u00f6sning om en bes\u00f6kares webbl\u00e4sare inte st\u00f6der WebP.<\/p>\n<p>Om du exempelvis laddar upp en JPEG-fil till din webbplats s\u00e5 kommer pluginet att:<\/p>\n<ul>\n<li>Konvertera JPEG-filen till WebP och servera WebP-versionen f\u00f6r Chrome, Firefox, Edge osv.<\/li>\n<li>Visa den ursprungliga JPEG-filen f\u00f6r bes\u00f6kare som surfar med Safari (p\u00e5 \u00e4ldre macOS-versioner) och andra webbl\u00e4sare som inte st\u00f6der WebP.<\/li>\n<\/ul>\n<p>P\u00e5 s\u00e5 s\u00e4tt kan alla se din bild och alla f\u00e5r den snabbaste upplevelsen.<\/p>\n<p>Nedan s\u00e5 g\u00e5r vi igenom n\u00e5gra av de <strong>b\u00e4sta WebP WordPress-pluginen<\/strong>, som alla fungerar med Kinsta och <a href=\"https:\/\/kinsta.com\/docs\/wordpress-hosting\/wordpress-cdn\/kinsta-cdn\/#kinstas-cdn\">Kinsta CDN<\/a>.<\/p>\n<div><\/div><kinsta-auto-toc list-style=\"disc\" selector=\"h3\" count-number=\"4\" sub-toc=\"true\"><\/kinsta-auto-toc>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Om du \u00e4r hostad av Kinsta s\u00e5 m\u00e5ste du <a href=\"https:\/\/kinsta.com\/se\/kinsta-support\/\">kontakta v\u00e5r support<\/a> s\u00e5 att vi kan skapa en Nginx-regel f\u00f6r WebP-cachelager f\u00f6r n\u00e5gra av dessa plugins.<\/p>\n<\/aside>\n\n<h3>Kinas funktion f\u00f6r bildoptimering<\/h3>\n<figure id=\"attachment_141887\" aria-describedby=\"caption-attachment-141887\" style=\"width: 1400px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-141887 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/12\/MyKinsta-enable-image-optimization.png\" alt=\"Kinsta\u2019s funktion f\u00f6r bildoptimering.\" width=\"1400\" height=\"797\"><figcaption id=\"caption-attachment-141887\" class=\"wp-caption-text\">Kinsta\u2019s funktion f\u00f6r bildoptimering.<\/figcaption><\/figure>\n<p>Den h\u00e4r f\u00f6rsta \u00e4r inte precis ett plugin, utan snarare en inbyggd funktion: Kinsta&#8217;s <a href=\"https:\/\/kinsta.com\/docs\/wordpress-hosting\/wordpress-cdn\/kinsta-cdn\/#image-optimization-1\">Bildoptimering<\/a>.<\/p>\n<p>Den h\u00e4r funktionen &#8211; som n\u00e5s via Kinsta\u2019s anpassade instrumentpanel, <a href=\"https:\/\/kinsta.com\/se\/mykinsta\/\">MyKinsta<\/a> &#8211; skapar automatiskt optimerade WebP-kopior av webbplatsens originalbilder. Den visar sedan den mindre av de tv\u00e5 bildfilerna f\u00f6r dina bes\u00f6kare.<\/p>\n<p>Genom att alltid se till att den minsta m\u00f6jliga filen h\u00e4mtas s\u00e5 \u00f6kar bildoptimeringen laddningstiderna omedelbart. Detta kan b\u00e5de f\u00f6rb\u00e4ttra dina <a href=\"https:\/\/kinsta.com\/se\/blog\/wordpress-seo\/\">SEO-resultat<\/a> och dina anv\u00e4ndares upplevelse avsev\u00e4rt. Funktionen drar direkt nytta av Kinsta\u2019s <a href=\"https:\/\/kinsta.com\/docs\/wordpress-hosting\/wordpress-cdn\/kinsta-cdn\/#kinstas-cdn\">blixtsnabba CDN<\/a> f\u00f6r att leverera filerna \u00e4nnu snabbare.<\/p>\n<p>Webbplats\u00e4gare kan v\u00e4lja mellan <a href=\"https:\/\/kinsta.com\/blog\/lossy-vs-lossless\/\">f\u00f6rst\u00f6rande komprimering och f\u00f6rlustfri komprimering<\/a> f\u00f6r sina WebP-bilder, beroende p\u00e5 deras behov. Optimering kan \u00e4ven sl\u00e5s p\u00e5 eller av n\u00e4r som helst om du beh\u00f6ver g\u00f6ra n\u00e5gra tester.<\/p>\n<p>Funktionen f\u00f6r bildoptimering \u00e4r helt kostnadsfri f\u00f6r alla Kinsta-kunder. S\u00e5 h\u00e4r g\u00f6r du f\u00f6r att aktivera den:<\/p>\n<ol>\n<li>Ladda upp dina bilder till ditt Kinsta-hostade WordPress-mediebibliotek.<\/li>\n<li>Logga in p\u00e5 din MyKinsta-instrumentpanel.<\/li>\n<li>Navigera till <strong>WordPress Webbplatser &gt; <em>webplatsnamn<\/em> &gt; CDN<\/strong>.<\/li>\n<li>Klicka p\u00e5 knappen <strong>Inst\u00e4llningar<\/strong> under avsnittet <strong>Bildoptimering<\/strong>.<\/li>\n<li>V\u00e4lj mellan f\u00f6rlustfri och f\u00f6rst\u00f6rande komprimering och klicka sedan p\u00e5 <strong>Spara inst\u00e4llningar<\/strong>.<\/li>\n<\/ol>\n<figure id=\"attachment_141891\" aria-describedby=\"caption-attachment-141891\" style=\"width: 1600px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-141891 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/12\/MyKinsta-image-optimization-options-lossless.png\" alt=\"V\u00e4lj mellan f\u00f6rlustfri komprimering och f\u00f6rst\u00f6rande komprimering.\" width=\"1600\" height=\"761\"><figcaption id=\"caption-attachment-141891\" class=\"wp-caption-text\">V\u00e4lj mellan f\u00f6rlustfri komprimering och f\u00f6rst\u00f6rande komprimering.<\/figcaption><\/figure>\n<p>Om du inte redan har Kinsta-plattformen s\u00e5 kan du <a href=\"https:\/\/kinsta.com\/docs\/wordpress-hosting\/wordpress-cdn\/kinsta-cdn\/#image-optimization-1#enabling-image-optimization\">prova funktionen<\/a> sj\u00e4lv utan kostnad genom att <a href=\"https:\/\/kinsta.com\/se\/prata-med-salj\/\">boka en demo<\/a>.<\/p>\n<h3>F\u00f6rlustfri komprimering vs f\u00f6rst\u00f6rande komprimering<\/h3>\n<p>Du kan v\u00e4lja mellan <a href=\"https:\/\/kinsta.com\/blog\/lossy-vs-lossless\/\">f\u00f6rlustfri och f\u00f6rst\u00f6rande komprimering<\/a> f\u00f6r dina filer. \u00c4ven om b\u00e5da metoderna komprimerar dina bildfiler och tar bort deras metadata s\u00e5 finns det en stor skillnad mellan dem:<\/p>\n<ul>\n<li><strong>F\u00f6rlustfri bildoptimering:<\/strong>\u00a0F\u00f6rlustfri bildkomprimering har ingen inverkan p\u00e5 kvaliteten p\u00e5 dina bilder. Du b\u00f6r v\u00e4lja det h\u00e4r alternativet om bildkvaliteten \u00e4r viktigare f\u00f6r dig \u00e4n hastigheten.<\/li>\n<li><strong>F\u00f6rst\u00f6rande bildoptimering:<\/strong> <a href=\"https:\/\/kinsta.com\/se\/blog\/destruktiv-komprimering\/\">F\u00f6rst\u00f6rande bildkomprimering<\/a> kan f\u00f6rs\u00e4mra kvaliteten p\u00e5 dina bilder. V\u00e4lj det h\u00e4r alternativet om du vill maximera och prioritera hastighet framf\u00f6r bildkvalitet.<\/li>\n<\/ul>\n<p>D\u00e4refter s\u00e5 ska vi titta p\u00e5 n\u00e5gra installerbara WordPress-plugins f\u00f6r optimering.<\/p>\n<h3>ShortPixel<\/h3>\n<figure id=\"attachment_73553\" aria-describedby=\"caption-attachment-73553\" style=\"width: 1500px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/06\/ShortPixel-plugin.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-73553 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/06\/ShortPixel-plugin.jpg\" alt=\"WordPress-pluginet ShortPixel\" width=\"1500\" height=\"500\"><\/a><figcaption id=\"caption-attachment-73553\" class=\"wp-caption-text\">WordPress-pluginet ShortPixel<\/figcaption><\/figure>\n<p><a href=\"https:\/\/kinsta.com\/se\/blog\/optimerar-bilder-for-webb\/#shortpixel\" target=\"_blank\" rel=\"noopener noreferrer\">ShortPixel<\/a> \u00e4r ett popul\u00e4rt WordPress-plugin f\u00f6r <a href=\"https:\/\/kinsta.com\/se\/blog\/optimerar-bilder-for-webb\/\">bildoptimering<\/a>. Det kan hj\u00e4lpa dig att automatiskt \u00e4ndra storlek och komprimera bilderna som du laddar upp till din WordPress-webbplats.<\/p>\n<p>Som en del av dess funktionslista s\u00e5 kan ShortPixel \u00e4ven hj\u00e4lpa dig att automatiskt konvertera bilder till WebP och servera dessa bilder till webbl\u00e4sare som st\u00f6der det.<\/p>\n<p>ShortPixel r\u00e4knar varje WordPress-bildstorlek som du optimerar som en kredit. S\u00e5 om du vill optimera flera bildstorlekar f\u00f6r miniatyrbilder kan en bild t\u00e4nkas anv\u00e4nda m\u00e5nga krediter. Det finns inga filstorleksgr\u00e4nser f\u00f6r bilder.<\/p>\n<p>Du kan sprida dina ShortPixel-krediter \u00f6ver ett obegr\u00e4nsat antal webbplatser. Det finns inga begr\u00e4nsningar per webbplats<em>(och alla dina webbplatser kan anv\u00e4nda samma ShortPixel-konto<\/em>).<\/p>\n<p>F\u00f6r att anv\u00e4nda ShortPixel f\u00f6r att servera WebP-bilder p\u00e5 WordPress s\u00e5 m\u00e5ste du installera <a href=\"https:\/\/wordpress.org\/plugins\/shortpixel-image-optimiser\/\" target=\"_blank\" rel=\"noopener noreferrer\">pluginet fr\u00e5n WordPress.org<\/a>. L\u00e4gg sedan till din API-nyckel<em>(som du f\u00e5r genom att registrera dig f\u00f6r ett kostnadsfritt ShortPixel-konto<\/em>).<\/p>\n<p>P\u00e5 fliken <strong>Allm\u00e4nt<\/strong> kan du st\u00e4lla in grundl\u00e4ggande inst\u00e4llningar f\u00f6r hur bildoptimering fungerar. Exempelvis vilken komprimeringsniv\u00e5 som ska anv\u00e4ndas och om du ska \u00e4ndra storlek p\u00e5 bilderna eller inte:<\/p>\n<figure id=\"attachment_72787\" aria-describedby=\"caption-attachment-72787\" style=\"width: 1024px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-72787 size-large\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/05\/webp-images-1-shortpixel-1024x771.png\" alt=\"S\u00e5 h\u00e4r st\u00e4ller du in komprimeringsniv\u00e5 och bilddimensioner i ShortPixel\" width=\"1024\" height=\"771\"><figcaption id=\"caption-attachment-72787\" class=\"wp-caption-text\">S\u00e5 h\u00e4r st\u00e4ller du in komprimeringsniv\u00e5 och bilddimensioner i ShortPixel<\/figcaption><\/figure>\n<p>Om du vill aktivera WebP-bilder s\u00e5 g\u00e5r du till fliken <strong>Avancerat<\/strong> och:<\/p>\n<ol>\n<li>Markerar rutan f\u00f6r <strong>WebP Bilder<\/strong><\/li>\n<li>Markerar rutan f\u00f6r att <strong>leverera WebP-versioner&#8230;<\/strong>\u00a0(den h\u00e4r rutan visas efter att du har markerat den f\u00f6rsta rutan)<\/li>\n<li>Markera radioknappen f\u00f6r <strong>Anv\u00e4ndning av &lt;PICTURE&gt;-taggens syntax <\/strong>(detta visas efter att du har markerat f\u00f6reg\u00e5ende ruta)<\/li>\n<li>L\u00e4mna kvar\u00a0standardvalet<strong> Endast via WordPress-krokar<\/strong><\/li>\n<\/ol>\n<figure id=\"attachment_72788\" aria-describedby=\"caption-attachment-72788\" style=\"width: 1024px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-72788 size-large\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/05\/webp-images-2-shortpixel-webp-settings-1024x809.png\" alt=\"S\u00e5 h\u00e4r aktiverar du WordPress WebP-bilder i ShortPixel\" width=\"1024\" height=\"809\"><figcaption id=\"caption-attachment-72788\" class=\"wp-caption-text\">S\u00e5 h\u00e4r aktiverar du WordPress WebP-bilder i ShortPixel<\/figcaption><\/figure>\n<p>Spara sedan dina \u00e4ndringar.<\/p>\n<p>Om du hostas av Kinsta s\u00e5 kommer ShortPixel att ge dig ett varningsmeddelande om att konfigurera serverkonfigurationsfiler p\u00e5 Nginx. Om du vill konfigurera dessa inst\u00e4llningar s\u00e5 kan du kontakta <a href=\"https:\/\/kinsta.com\/se\/kinsta-support\/\">Kinsta-supporten<\/a>, s\u00e5 konfigurerar vi g\u00e4rna serverkonfigurationen \u00e5t dig.<\/p>\n<h3>Imagify<\/h3>\n<figure id=\"attachment_73552\" aria-describedby=\"caption-attachment-73552\" style=\"width: 1500px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/06\/Imagify-plugin.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-73552 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/06\/Imagify-plugin.jpg\" alt=\"WordPress-pluginet Imagify\" width=\"1500\" height=\"500\"><\/a><figcaption id=\"caption-attachment-73552\" class=\"wp-caption-text\">WordPress-pluginet Imagify<\/figcaption><\/figure>\n<p><a href=\"https:\/\/kinsta.com\/se\/blog\/optimerar-bilder-for-webb\/#imagify\">Imagify<\/a> \u00e4r ett popul\u00e4rt plugin f\u00f6r bildoptimering fr\u00e5n samma utvecklare som <a href=\"https:\/\/wp-rocket.me\/\" target=\"_blank\" rel=\"noopener noreferrer\">WP Rocket<\/a>.<\/p>\n<p>Det kan automatiskt komprimera och \u00e4ndra storlek p\u00e5 bilderna som du laddar upp till din WordPress-webbplats. Det kan sedan hj\u00e4lpa dig att konvertera dem till WebP och servera dessa versioner till bes\u00f6kare med webbl\u00e4sare som st\u00f6der det.<\/p>\n<p>N\u00e4r det g\u00e4ller funktioner s\u00e5 har ShortPixel och Imagify m\u00e5nga likheter. Den mest betydande skillnaden kommer n\u00e4r du tittar p\u00e5 priss\u00e4ttningen. ShortPixel debiterar dig baserat p\u00e5 bilder utan n\u00e5gon storleksbegr\u00e4nsning per bild. Imagify debiterar dig baserat p\u00e5 den totala filstorleken, utan n\u00e5gon bildbegr\u00e4nsning.<\/p>\n<p>S\u00e5 om du beh\u00f6ver optimera m\u00e5nga stora bilder kan ShortPixels metod vara billigare. Men om du beh\u00f6ver optimera m\u00e5nga sm\u00e5 bilder kan Imagifys metod vara mer prisv\u00e4rd.<\/p>\n<p>Imagify har en begr\u00e4nsad kostnadsfri niv\u00e5 som till\u00e5ter 25 MB optimeringar per m\u00e5nad. D\u00e4refter s\u00e5 b\u00f6rjar betalda planer p\u00e5 4,99 dollar per m\u00e5nad f\u00f6r upp till 1 GB eller 9,99 dollar f\u00f6r en eng\u00e5ngskredit p\u00e5 1 GB.<\/p>\n<p>Precis som hos ShortPixel s\u00e5 kan du sprida dina kontogr\u00e4nser \u00f6ver ett obegr\u00e4nsat antal webbplatser.<\/p>\n<p>F\u00f6r att anv\u00e4nda Imagify f\u00f6r att leverera WordPress WebP-bilder s\u00e5 m\u00e5ste du installera <a href=\"https:\/\/wordpress.org\/plugins\/imagify\/\" target=\"_blank\" rel=\"noopener noreferrer\">pluginet fr\u00e5n WordPress.org<\/a> och l\u00e4gga till din API-nyckel f\u00f6r att komma ig\u00e5ng.<\/p>\n<p>N\u00e4r du har aktiverat pluginet s\u00e5 kan du anv\u00e4nda rutan <strong>Allm\u00e4nna inst\u00e4llningar<\/strong> f\u00f6r att v\u00e4lja komprimeringsniv\u00e5.<\/p>\n<figure id=\"attachment_72782\" aria-describedby=\"caption-attachment-72782\" style=\"width: 1024px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-72782 size-large\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/05\/webp-images-imagify-compression-1024x639.png\" alt=\"S\u00e5 h\u00e4r st\u00e4ller du in komprimeringsniv\u00e5n i Imagify\" width=\"1024\" height=\"639\"><figcaption id=\"caption-attachment-72782\" class=\"wp-caption-text\">S\u00e5 h\u00e4r st\u00e4ller du in komprimeringsniv\u00e5n i Imagify<\/figcaption><\/figure>\n<p>F\u00f6r att aktivera WebP-bilder s\u00e5 scrollar du ner till avsnittet <strong>Optimering<\/strong> och hittar avsnittet <strong>WebP-format<\/strong>:<\/p>\n<ol>\n<li>Markera rutan f\u00f6r att\u00a0<strong>Skapa webp-versioner av bilder<\/strong><\/li>\n<li>Markera rutan f\u00f6r att <strong>visa bilder i webp-format&#8230;<\/strong><\/li>\n<li>Markera radioknappen f\u00f6r att <strong>anv\u00e4nda &lt;picture&gt;-taggar<\/strong><\/li>\n<\/ol>\n<figure id=\"attachment_72783\" aria-describedby=\"caption-attachment-72783\" style=\"width: 1024px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-72783 size-large\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/01\/webp-images-imagify-webp-1024x369.png\" alt=\"S\u00e5 h\u00e4r aktiverar du WordPress WebP-bilder i Imagify\" width=\"1024\" height=\"369\"><figcaption id=\"caption-attachment-72783\" class=\"wp-caption-text\">S\u00e5 h\u00e4r aktiverar du WordPress WebP-bilder i Imagify<\/figcaption><\/figure>\n<p>Precis som med ShortPixel s\u00e5 m\u00e5ste du, om du hostas av Kinsta, skapa en <a href=\"https:\/\/kinsta.com\/se\/blog\/vad-ar-nginx\/\">Nginx-regel<\/a> f\u00f6r WebP-cachelagringsbuckets (kontakta Kinsta-supporten).<\/p>\n<h3>Optimole<\/h3>\n<figure id=\"attachment_73554\" aria-describedby=\"caption-attachment-73554\" style=\"width: 1500px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/06\/Optimole-plugin.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-73554 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/06\/Optimole-plugin.jpg\" alt=\"WordPress-pluginet Optimole\" width=\"1500\" height=\"500\"><\/a><figcaption id=\"caption-attachment-73554\" class=\"wp-caption-text\">WordPress-pluginet Optimole<\/figcaption><\/figure>\n<p><a href=\"https:\/\/kinsta.com\/se\/blog\/optimerar-bilder-for-webb\/#optimole\">Optimole<\/a> \u00e4r ett plugin f\u00f6r bildoptimering i WordPress som fungerar lite annorlunda \u00e4n Imagify och ShortPixel. Optimole kan automatiskt komprimera och \u00e4ndra storlek p\u00e5 dina bilder. Det har dock \u00e4ven tv\u00e5 andra anm\u00e4rkningsv\u00e4rda funktioner:<\/p>\n<ol>\n<li>Det kan servera dina bilder via sitt CDN (som drivs av Amazon CloudFront).<\/li>\n<li>Det erbjuder adaptiva bilder i realtid, varvid Optimole levererar den optimalt stora bilden f\u00f6r varje bes\u00f6kare. En person som surfar p\u00e5 en liten sk\u00e4rm f\u00e5r exempelvis en bild med l\u00e4gre uppl\u00f6sning \u00e4n en person som surfar p\u00e5 en Retina-sk\u00e4rm.<\/li>\n<\/ol>\n<p>Detta tillv\u00e4gag\u00e5ngss\u00e4tt liknar andra optimerings-\/manipuleringstj\u00e4nster i realtid som Cloudinary, imgix, KeyCDN Image Processing osv.<\/p>\n<p>Optimole kan \u00e4ven leverera WebP-bilder till bes\u00f6kare med webbl\u00e4sare som st\u00f6der det som en del av denna bildoptimering i realtid.<\/p>\n<p>Optimole har en begr\u00e4nsad kostnadsfri plan som kan hantera levererans av bilder till cirka ~5 000 bes\u00f6kare per m\u00e5nad. D\u00e4refter s\u00e5 b\u00f6rjar betalda planer p\u00e5 19 dollar per m\u00e5nad f\u00f6r ~25 000 bes\u00f6kare.<\/p>\n<p>F\u00f6r att komma ig\u00e5ng s\u00e5 m\u00e5ste du installera <a href=\"https:\/\/wordpress.org\/plugins\/optimole-wp\/\" target=\"_blank\" rel=\"noopener noreferrer\">pluginet fr\u00e5n WordPress.org<\/a> och aktivera det med en API-nyckel<em>(som du kan f\u00e5 genom att registrera dig f\u00f6r ett kostnadsfritt Optimole-konto<\/em>).<\/p>\n<p>N\u00e4r du har gjort detta s\u00e5 b\u00f6rjar Optimole automatiskt att optimera dina bilder och leverera dem via sitt <a href=\"https:\/\/kinsta.com\/se\/blog\/wordpress-cdn\/\">CDN<\/a>. WebP-st\u00f6det \u00e4r aktiverat som standard, s\u00e5 du beh\u00f6ver inte aktivera det manuellt.<\/p>\n<p>Om du vill konfigurera andra inst\u00e4llningar, som komprimeringsniv\u00e5er och skalningsbeteende, s\u00e5 kan du g\u00e5 till <strong>Media \u2192 Optimole \u2192 Inst\u00e4llningar<\/strong>:<\/p>\n<figure id=\"attachment_72786\" aria-describedby=\"caption-attachment-72786\" style=\"width: 1024px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-72786 size-large\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2020\/05\/optimole-1024x685.png\" alt=\"Optimole aktiverar WordPress WebP-bilder som standard.\" width=\"1024\" height=\"685\"><figcaption id=\"caption-attachment-72786\" class=\"wp-caption-text\">Optimole aktiverar WordPress WebP-bilder som standard.<\/figcaption><\/figure>\n<p>Eftersom Optimole sk\u00f6ter leveransen av dina bilder via sitt CDN s\u00e5 beh\u00f6ver du inte st\u00e4lla in n\u00e5gra Nginx-regler om du hostas av Kinsta.<\/p>\n\n<h2>Sammanfattning<\/h2>\n<p>Bilderna p\u00e5 din WordPress-webbplats utg\u00f6r en stor del av filstorleken p\u00e5 en genomsnittlig sida. Om du kan hitta s\u00e4tt att minska storleken p\u00e5 dina bilder s\u00e5 kan du <a href=\"https:\/\/kinsta.com\/se\/lar\/snabba-upp-wordpress\/\">snabba upp din webbplats<\/a> utan att skada anv\u00e4ndarupplevelsen. WebP \u00e4r ett modernt bildformat som g\u00f6r just detta genom att erbjuda en ~25 % minskning av filstorleken j\u00e4mf\u00f6rt med j\u00e4mf\u00f6rande JPEG- eller PNG-filer.<\/p>\n<p>Omkring 95 % av Internetanv\u00e4ndarna anv\u00e4nder redan en webbl\u00e4sare som st\u00f6der WebP. WordPress 5.8+-versioner har \u00e4ven st\u00f6d f\u00f6r WebP fr\u00e5n och med nu. S\u00e5 det finns ingen anledning att inte anv\u00e4nda detta.<\/p>\n<p>En minoritet av alla webbl\u00e4sare, s\u00e4rskilt Safari i \u00e4ldre macOS-versioner, har dock fortfarande inte st\u00f6d f\u00f6r WebP. Du kan d\u00e4rf\u00f6r inte servera WebP-bilder till alla bes\u00f6kare \u00e4nnu. Det finns dock en l\u00f6sning p\u00e5 det h\u00e4r problemet. Du kan anv\u00e4nda ett WordPress-plugin som konverterar bilder till WebP och serverar WebP-versioner till bes\u00f6kare vars webbl\u00e4sare har st\u00f6d f\u00f6r det. Du anv\u00e4nder samtidigt originalbilderna f\u00f6r bes\u00f6kare vars webbl\u00e4sare inte har st\u00f6d f\u00f6r det.<\/p>\n<p>Om du vill ha fler taktiker f\u00f6r att optimera bilder s\u00e5 kan du l\u00e4sa <a href=\"https:\/\/kinsta.com\/se\/blog\/optimerar-bilder-for-webb\/\">v\u00e5r fullst\u00e4ndiga guide f\u00f6r att optimera bilder f\u00f6r webbprestanda<\/a>. Gl\u00f6m inte att Kinsta\u2019s kunder automatiskt kan generera komprimerade WebP-bilder, utan kostnad f\u00f6r diskutrymme. De beh\u00f6ver bara utnyttja Kinsta\u2019s kostnadsfria, inbyggda <a href=\"https:\/\/kinsta.com\/docs\/wordpress-hosting\/wordpress-cdn\/kinsta-cdn\/#image-optimization-1\">funktion f\u00f6r bildoptimering<\/a>.<\/p>\n<p><em>Om du har n\u00e5gra fr\u00e5gor om hur du anv\u00e4nder WebP p\u00e5 WordPress s\u00e5 kan du fr\u00e5ga oss i kommentarerna nedan!<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Om du vill snabba upp din WordPress-webbplats\u00a0s\u00e5 kan du f\u00e5 en betydande avkastning p\u00e5 din investering genom att minska filstorleken p\u00e5 dina bilder. I genomsnitt s\u00e5 &#8230;<\/p>\n","protected":false},"author":117,"featured_media":36446,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[285,286],"topic":[779,821,845],"class_list":["post-36432","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-pagespeed","tag-webp","topic-bildoptimering","topic-webbdesign","topic-wordpress-webbdesign"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)<\/title>\n<meta name=\"description\" content=\"Beh\u00f6ver du f\u00e5 mindre bildfilstorlekar? L\u00e4r dig mer om WebP-bildformatet och hur du kan nyttja detta p\u00e5 din WordPress-webbplats.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/se\/blog\/webp\/\" \/>\n<meta property=\"og:locale\" content=\"sv_SE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)\" \/>\n<meta property=\"og:description\" content=\"Beh\u00f6ver du f\u00e5 mindre bildfilstorlekar? L\u00e4r dig mer om WebP-bildformatet och hur du kan nyttja detta p\u00e5 din WordPress-webbplats.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/se\/blog\/webp\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kinstasweden\/\" \/>\n<meta property=\"article:published_time\" content=\"2020-07-21T08:16:47+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-09-21T12:28:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1024\" \/>\n\t<meta property=\"og:image:height\" content=\"512\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Salman Ravoof\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"Beh\u00f6ver du f\u00e5 mindre bildfilstorlekar? L\u00e4r dig mer om WebP-bildformatet och hur du kan nyttja detta p\u00e5 din WordPress-webbplats.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg\" \/>\n<meta name=\"twitter:creator\" content=\"@salmanravoof\" \/>\n<meta name=\"twitter:site\" content=\"@kinsta_se\" \/>\n<meta name=\"twitter:label1\" content=\"Skriven av\" \/>\n\t<meta name=\"twitter:data1\" content=\"Salman Ravoof\" \/>\n\t<meta name=\"twitter:label2\" content=\"Ber\u00e4knad l\u00e4stid\" \/>\n\t<meta name=\"twitter:data2\" content=\"15 minuter\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/\"},\"author\":{\"name\":\"Salman Ravoof\",\"@id\":\"https:\/\/kinsta.com\/se\/#\/schema\/person\/9cafd2eedd617e640eeea4cf3a5fd987\"},\"headline\":\"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)\",\"datePublished\":\"2020-07-21T08:16:47+00:00\",\"dateModified\":\"2023-09-21T12:28:14+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/\"},\"wordCount\":2927,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/se\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg\",\"keywords\":[\"pagespeed\",\"webp\"],\"articleSection\":[\"De b\u00e4sta handledningarna f\u00f6r WordPress\"],\"inLanguage\":\"sv-SE\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/se\/blog\/webp\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/\",\"url\":\"https:\/\/kinsta.com\/se\/blog\/webp\/\",\"name\":\"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/se\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg\",\"datePublished\":\"2020-07-21T08:16:47+00:00\",\"dateModified\":\"2023-09-21T12:28:14+00:00\",\"description\":\"Beh\u00f6ver du f\u00e5 mindre bildfilstorlekar? L\u00e4r dig mer om WebP-bildformatet och hur du kan nyttja detta p\u00e5 din WordPress-webbplats.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/#breadcrumb\"},\"inLanguage\":\"sv-SE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/se\/blog\/webp\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg\",\"contentUrl\":\"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg\",\"width\":1024,\"height\":512,\"caption\":\"WebP\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/se\/blog\/webp\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/se\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Bildoptimering\",\"item\":\"https:\/\/kinsta.com\/se\/topics\/bildoptimering\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/se\/#website\",\"url\":\"https:\/\/kinsta.com\/se\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Snabba, s\u00e4kra, premium hosting-l\u00f6sningar\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/se\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/se\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"sv-SE\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/se\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/se\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@id\":\"https:\/\/kinsta.com\/se\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/se\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kinstasweden\/\",\"https:\/\/x.com\/kinsta_se\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/se\/#\/schema\/person\/9cafd2eedd617e640eeea4cf3a5fd987\",\"name\":\"Salman Ravoof\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@id\":\"https:\/\/kinsta.com\/se\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/0c5885f75cb78473fb7408e5e49ad190?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/0c5885f75cb78473fb7408e5e49ad190?s=96&d=mm&r=g\",\"caption\":\"Salman Ravoof\"},\"description\":\"Salman Ravoof is a self-taught web developer, writer, creator, and a huge admirer of Free and Open Source Software (FOSS). Besides tech, he's excited by science, philosophy, photography, arts, cats, and food. Learn more about him on his website, and connect with Salman on Twitter.\",\"sameAs\":[\"https:\/\/salmanravoof.com\",\"https:\/\/www.linkedin.com\/in\/salman-ravoof-5a749133\/\",\"https:\/\/x.com\/salmanravoof\"],\"url\":\"https:\/\/kinsta.com\/se\/blog\/author\/salmanravoof\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)","description":"Beh\u00f6ver du f\u00e5 mindre bildfilstorlekar? L\u00e4r dig mer om WebP-bildformatet och hur du kan nyttja detta p\u00e5 din WordPress-webbplats.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/se\/blog\/webp\/","og_locale":"sv_SE","og_type":"article","og_title":"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)","og_description":"Beh\u00f6ver du f\u00e5 mindre bildfilstorlekar? L\u00e4r dig mer om WebP-bildformatet och hur du kan nyttja detta p\u00e5 din WordPress-webbplats.","og_url":"https:\/\/kinsta.com\/se\/blog\/webp\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinstasweden\/","article_published_time":"2020-07-21T08:16:47+00:00","article_modified_time":"2023-09-21T12:28:14+00:00","og_image":[{"width":1024,"height":512,"url":"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg","type":"image\/jpeg"}],"author":"Salman Ravoof","twitter_card":"summary_large_image","twitter_description":"Beh\u00f6ver du f\u00e5 mindre bildfilstorlekar? L\u00e4r dig mer om WebP-bildformatet och hur du kan nyttja detta p\u00e5 din WordPress-webbplats.","twitter_image":"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg","twitter_creator":"@salmanravoof","twitter_site":"@kinsta_se","twitter_misc":{"Skriven av":"Salman Ravoof","Ber\u00e4knad l\u00e4stid":"15 minuter"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/se\/blog\/webp\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/se\/blog\/webp\/"},"author":{"name":"Salman Ravoof","@id":"https:\/\/kinsta.com\/se\/#\/schema\/person\/9cafd2eedd617e640eeea4cf3a5fd987"},"headline":"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)","datePublished":"2020-07-21T08:16:47+00:00","dateModified":"2023-09-21T12:28:14+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/se\/blog\/webp\/"},"wordCount":2927,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/se\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/se\/blog\/webp\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg","keywords":["pagespeed","webp"],"articleSection":["De b\u00e4sta handledningarna f\u00f6r WordPress"],"inLanguage":"sv-SE","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/se\/blog\/webp\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/se\/blog\/webp\/","url":"https:\/\/kinsta.com\/se\/blog\/webp\/","name":"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)","isPartOf":{"@id":"https:\/\/kinsta.com\/se\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/se\/blog\/webp\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/se\/blog\/webp\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg","datePublished":"2020-07-21T08:16:47+00:00","dateModified":"2023-09-21T12:28:14+00:00","description":"Beh\u00f6ver du f\u00e5 mindre bildfilstorlekar? L\u00e4r dig mer om WebP-bildformatet och hur du kan nyttja detta p\u00e5 din WordPress-webbplats.","breadcrumb":{"@id":"https:\/\/kinsta.com\/se\/blog\/webp\/#breadcrumb"},"inLanguage":"sv-SE","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/se\/blog\/webp\/"]}]},{"@type":"ImageObject","inLanguage":"sv-SE","@id":"https:\/\/kinsta.com\/se\/blog\/webp\/#primaryimage","url":"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg","contentUrl":"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2020\/07\/webp.jpg","width":1024,"height":512,"caption":"WebP"},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/se\/blog\/webp\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/se\/"},{"@type":"ListItem","position":2,"name":"Bildoptimering","item":"https:\/\/kinsta.com\/se\/topics\/bildoptimering\/"},{"@type":"ListItem","position":3,"name":"Hur man anv\u00e4nder WebP-bilder i WordPress (krymper bildfilstorleken med upp till 35 %)"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/se\/#website","url":"https:\/\/kinsta.com\/se\/","name":"Kinsta\u00ae","description":"Snabba, s\u00e4kra, premium hosting-l\u00f6sningar","publisher":{"@id":"https:\/\/kinsta.com\/se\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/se\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"sv-SE"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/se\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/se\/","logo":{"@type":"ImageObject","inLanguage":"sv-SE","@id":"https:\/\/kinsta.com\/se\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/se\/wp-content\/uploads\/sites\/9\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/se\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kinstasweden\/","https:\/\/x.com\/kinsta_se","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/se\/#\/schema\/person\/9cafd2eedd617e640eeea4cf3a5fd987","name":"Salman Ravoof","image":{"@type":"ImageObject","inLanguage":"sv-SE","@id":"https:\/\/kinsta.com\/se\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/0c5885f75cb78473fb7408e5e49ad190?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0c5885f75cb78473fb7408e5e49ad190?s=96&d=mm&r=g","caption":"Salman Ravoof"},"description":"Salman Ravoof is a self-taught web developer, writer, creator, and a huge admirer of Free and Open Source Software (FOSS). Besides tech, he's excited by science, philosophy, photography, arts, cats, and food. Learn more about him on his website, and connect with Salman on Twitter.","sameAs":["https:\/\/salmanravoof.com","https:\/\/www.linkedin.com\/in\/salman-ravoof-5a749133\/","https:\/\/x.com\/salmanravoof"],"url":"https:\/\/kinsta.com\/se\/blog\/author\/salmanravoof\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/posts\/36432","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/users\/117"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/comments?post=36432"}],"version-history":[{"count":10,"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/posts\/36432\/revisions"}],"predecessor-version":[{"id":49925,"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/posts\/36432\/revisions\/49925"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/en"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/fr"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/es"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/it"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/pt"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/de"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/nl"},{"embeddable":true,"hreflang":"sv","title":"Swedish","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/se"},{"embeddable":true,"hreflang":"da","title":"Danish","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/dk"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/translations\/jp"},{"href":"https:\/\/kinsta.com\/se\/wp-json\/kinsta\/v1\/posts\/36432\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/media\/36446"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/media?parent=36432"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/tags?post=36432"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/se\/wp-json\/wp\/v2\/topic?post=36432"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}