JPEG, PNG, WebP eller AVIF? Valet av bildformat påverkar filstorlek, laddningstid, bildkvalitet och kompatibilitet. Fel format kan göra att din webbplats laddar långsamt, att bilder ser suddiga ut i tryck, eller att transparenta bakgrunder inte fungerar. Med verktyget nedan jämför du de sex vanligaste bildformaten sida vid sida. Klicka på ett format för att se fördelar, nackdelar, tekniska egenskaper och uppskattade filstorlekar.
Foton: WebP (eller JPEG). Grafik/logotyper: SVG (eller PNG). Bästa komprimering: AVIF. Animationer: WebP (eller GIF). Tryck: PNG eller TIFF.
Jämför bildformat
| Format | Komprimering | Transparens | Animation | Bäst för |
|---|
Filstorlekar är uppskattningar och varierar beroende på bildinnehåll och komprimeringsinställningar.
Vilket format ska du välja?
Rätt format beror på vad bilden innehåller, var den ska användas och vilka krav du har på kvalitet och filstorlek. Här är de viktigaste scenarierna med konkreta rekommendationer.
Foton på webben
Använd WebP som förstahandsval. Det ger 25 till 35 procent mindre filer än JPEG vid samma visuella kvalitet och stöds av 97% av webbläsarna. Om du behöver maximal kompatibilitet (exempelvis e-postutskick eller nyhetsbrev) fungerar JPEG fortfarande utmärkt. AVIF ger ännu bättre komprimering men saknar stöd i vissa äldre webbläsare. Den bästa strategin för webbplatser är att använda AVIF med WebP som fallback och JPEG som sista alternativ. WordPress och de flesta moderna CMS hanterar detta automatiskt.
Logotyper och ikoner
Använd SVG om möjligt. Som vektorformat skalas det utan kvalitetsförlust, vilket innebär att logotypen ser perfekt ut på en liten favicon, en webbsida och en storformatsaffisch. SVG-filer är också extremt små (ofta under 10 KB). Om SVG inte fungerar (exempelvis sociala medier som inte stöder formatet) välj PNG med transparent bakgrund i hög upplösning.
Skärmdumpar och grafik med text
Använd PNG. Den förlustfria komprimeringen bevarar skarpa kanter och text utan de artefakter som JPEG skapar runt kontrastrika övergångar. En skärmdump av en webbsida sparad som JPEG får synliga ”halo-effekter” runt text, medan PNG bevarar varje pixel exakt.
Animationer
Använd WebP istället för GIF. WebP-animationer är betydligt mindre i filstorlek och stöder miljontals färger (mot GIF:s 256). GIF fungerar fortfarande där kompatibiliteten är avgörande (exempelvis äldre e-postklienter eller specifika forum), men för moderna webbplatser och sociala medier är WebP det bättre valet.
Foton för tryck
Använd PNG eller TIFF (som inte ingår i verktyget ovan men är standard i tryckindustrin). JPEG fungerar för tryck om kvaliteten ställs på 95 till 100%, men varje omsparning försämrar kvaliteten. Spara alltid originalet i ett förlustfritt format och exportera till JPEG först i sista steget.
WordPress konverterar automatiskt uppladdade bilder till WebP sedan version 6.1 (enligt Googles Web.dev-dokumentation ger WebP 25-35% mindre filer) (om servern stöder det). Det innebär att du kan ladda upp JPEG och PNG som vanligt, och WordPress serverar WebP-versioner till webbläsare som stöder det. Du behöver inte konvertera manuellt.
Lossy kontra lossless komprimering
Skillnaden mellan lossy och lossless är grundläggande för att förstå bildformat.
Lossy (förstörande) komprimering (MDN Web Docs) minskar filstorleken genom att permanent ta bort bilddata som anses mindre viktig för det mänskliga ögat. Algoritmen analyserar vilka detaljer du sannolikt inte märker och tar bort dem. Varje gång du sparar om en lossy-fil tappas mer kvalitet (generationsförlust). JPEG använder alltid lossy-komprimering. WebP och AVIF stöder både lossy och lossless.
Lossless (förlustfri) komprimering minskar filstorleken genom att hitta mönster och repetitioner i datan utan att någon information går förlorad. Filen kan dekomprimeras till exakt originalbilden, bit för bit. PNG använder alltid lossless-komprimering. Nackdelen är att filerna blir betydligt större, särskilt för fotografier med många unika färgvärden.
I praktiken innebär lossy-komprimering att JPEG vid kvalitet 80 till 85 ger bilder som är visuellt identiska med originalet för de allra flesta betraktare. Skillnaden syns först vid stark inzoomning eller i subtila färgövergångar. WebP och AVIF uppnår samma visuella kvalitet med ännu lägre filstorlek tack vare modernare komprimeringsalgoritmer.
Filstorlek och laddningstid
Bildernas filstorlek har direkt påverkan på hur snabbt din webbplats laddar, och laddningstiden påverkar i sin tur både användarupplevelse och sökmotorranking. Google använder Core Web Vitals (bland annat Largest Contentful Paint) som rankingfaktor, och bilder är ofta den största resursen på en webbsida.
Ett typiskt foto (1920×1080 pixlar) kan variera enormt i storlek beroende på format och kvalitetsinställning. En JPEG i kvalitet 80 ger cirka 300 till 400 KB. Samma bild i WebP ger cirka 200 till 250 KB. I AVIF cirka 150 till 200 KB. I PNG (förlustfri) blir det 2 till 3 MB. Skillnaden multipliceras med antalet bilder på sidan.
Om din webbplats har tio bilder och du byter från JPEG till WebP sparar du ungefär 1 MB per sidladdning. Det kan innebära en sekunds snabbare laddning på mobilt bredband, vilket är betydande för både användare och SEO.
Vanliga frågor (FAQ)
Vilket bildformat ger minst filstorlek?
AVIF ger generellt minst filstorlek för fotografier, följt av WebP och JPEG. För grafik och ikoner ger SVG minst filstorlek. GIF är det mest ineffektiva formatet och bör undvikas för allt utom enkla animationer.
Stöder alla webbläsare WebP?
Ja, alla moderna webbläsare stöder WebP sedan 2020 (Chrome, Firefox, Safari 14+, Edge). Internet Explorer stöder det inte, men IE har i praktiken inga kvarvarande användare.
Ska jag använda AVIF istället för WebP?
AVIF ger bättre komprimering men har cirka 93% webbläsarstöd (Safari fick fullt stöd i version 16.4). Den bästa strategin är att använda AVIF med WebP som fallback. De flesta CDN-tjänster och WordPress-plugins hanterar detta automatiskt.
Kan jag konvertera mellan format utan kvalitetsförlust?
Konvertering från lossless till lossless (exempelvis PNG till PNG) bevarar kvaliteten. Konvertering från lossy till något annat format (exempelvis JPEG till PNG) bevarar pixlarna men kan inte återställa den kvalitet som redan förlorats vid den ursprungliga JPEG-komprimeringen. Spara därför alltid originalet i högsta kvalitet.
Vad är bäst för sociala medier?
De flesta sociala medieplattformar konverterar uppladdade bilder automatiskt. Instagram och Facebook konverterar till JPEG. Twitter accepterar PNG och JPEG. Ladda upp i högsta möjliga kvalitet (PNG eller JPEG 95%+) och låt plattformen hantera konverteringen.
Fredrik Albinsson är chefredaktör för PC Concept och har varit med sedan sajten grundades. Med över 15 års erfarenhet inom IT och teknikjournalistik leder han redaktionens arbete och sätter riktningen för innehållet. Han bevakar framför allt utvecklingen inom digitala tjänster och appar.