WebP är ett (relativt) modernt filformat för bilder på internet. Google introducerade det 2010. Syftet var att erbjuda ett effektivare alternativ till befintliga format som PNG och JPEG.
Huvudmålet med WebP är att öka webbplatsers laddningshastighet. Detta sker genom att komprimera bilder starkare utan stor kvalitetsförlust. Därmed förbrukar sajter mindre bandbredd.
Den tekniska basen för WebP ligger i VP8-videocodecen. Denna teknologi utvecklades ursprungligen av On2 Technologies. Google köpte företaget och använde tekniken som grund för detta bildformat.
Hur det tekniskt fungerar: lossy och lossless komprimering
WebP stöder både lossy och lossless komprimering. Vid lossy komprimering tas data bort permanent för att göra filen mindre. Detta sker via prediktiv kodning.
Teknologin förutsäger pixelvärden baserat på angränsande block. Endast skillnaden mellan förutsägelsen och verkligheten sparas. Denna process är effektivare än metoderna i äldre format.
Lossless komprimering bevarar all ursprunglig pixeldata. Detta är nödvändigt för bilder där grafisk precision är mycket viktig. WebP:s komprimeringsalgoritmer är mer avancerade än de i PNG.
Formatet stöder transparens via en alpha-kanal. Detta fungerar både för lossy och lossless filer. Dessutom erbjuder WebP stöd för animationer. Det är därmed också ett alternativ till GIF-formatet.
Jämförelse med traditionella format (JPEG och PNG)
WebP presterar tekniskt bättre än JPEG vid jämförbar visuell kvalitet. Googles forskning visar att WebP-filer i genomsnitt är 25% till 34% mindre än JPEG-filer.
I jämförelse med lossless PNG-filer är WebP i genomsnitt 26% mindre. Besparingen är betydande för bilder med många detaljer. Detta har direkt inverkan på den totala sidstorleken på en webbplats.
Vid samma filstorlek levererar WebP ofta en skarpare bild än JPEG. Färre kompressionsartefakter är synliga i jämna färgfält. Detta gör formatet lämpligt för både foton och grafiska illustrationer.
Dokumentation om dessa jämförelser finns på den officiella Google Developers sidan. Här beskrivs utförliga testresultat och metoder.
Effekten på SEO och Core Web Vitals
WebP har en indirekt inverkan på positionen i sökmotorer. Google använder sidans hastighet som en rankningsfaktor. Ceteris paribus får en snabbare webbplats en högre rankning i sökresultaten.
Inom Core Web Vitals är Largest Contentful Paint (LCP) en viktig statistik. Den mäter hur snabbt det största elementet på en sida laddas. Eftersom detta ofta är en bild, förbättrar WebP denna poäng direkt.
Små filer är väsentliga för mobil indexering. Användare på mobila nätverk har ibland begränsad nedladdningshastighet. WebP minskar laddningstiden på dessa enheter avsevärt.
Google främjar användningen av moderna format via verktyg som PageSpeed Insights. Verktyget anger specifikt när bilder bättre kan levereras i WebP-format.
Implementering i ditt CMS
Sedan WordPress version 5.8 finns det inbyggt stöd för WebP. Användare kan ladda upp WebP-filer direkt till mediebiblioteket. Systemet genererar automatiskt de nödvändiga formaten för visning.
Andra system som Magento och Joomla erbjuder liknande funktioner via tillägg. För äldre installationer finns det plugins som konverterar befintliga bibliotek. Denna process kan ofta automatiseras på servern.
Det finns server-sideskript som hanterar konverteringen vid varje begäran. Detta förhindrar att administratören manuellt måste justera filer. Content Delivery Networks (CDN:er) kan också ta över denna uppgift.
För användare av my.host finns en lösning via QUIC.cloud. Denna tjänst konverterar PNG- och JPEG-bilder automatiskt till WebP. Integrationen säkerställer att den optimala versionen visas för besökaren. Du kan använda detta med vilket hostingpaket som helst. Du kan komma åt detta via den kostnadsfria LiteSpeed Cache-plugin.
Webbläsarstöd och kompatibilitet
De flesta moderna webbläsare stöder fullt ut WebP. Detta gäller för Google Chrome, Mozilla Firefox, Microsoft Edge och Apple Safari. Stödet i Safari lades till 2020.
Föråldrade webbläsare som Internet Explorer känner inte igen formatet. Även äldre versioner av operativsystem kan orsaka problem vid visning. För dessa fall behövs en fallback-mekanism.
Utvecklare använder ofta HTML5 <picture> taggen. Med den kan webbläsaren välja mellan en WebP-fil och ett traditionellt format. Om WebP inte stöds, laddar webbläsaren automatiskt JPEG- eller PNG-varianten.
Bildredigeringsprogram har nu brett stöd. Adobe Photoshop stöder WebP naturligt sedan version 23.2. Även öppen källkodsprogram som GIMP kan arbeta med WebP-filer som standard.
Den aktuella statusen för webbläsarstöd kan kontrolleras via Can I Use. Denna databas håller koll på vilka webbläsarversioner som är kompatibla med webbteknologier.
Lämna ett svar