det primära sättet att minska filstorleken på en bild är genom att öka mängden komprimering. I de flesta bildredigeringsprogram görs detta av de val du gör i dialogrutan ”Spara som” eller ”Exportera som” när du sparar en PNG, JPG eller GIF. Ju mer komprimering, desto mindre blir filen och desto snabbare laddas den på en webbsida.
men först måste du bestämma vilket av de tre filformat du vill använda. Om din bild är ett foto med massor av färger eller en illustration med graderingar och du vill pressa ner filstorleken är JPEG förmodligen ditt bästa val. Om ett liknande foto behöver ha förlustfri komprimering eller transparenta områden, krävs en PNG-24. Om du har en enkel grafik med få färger och solida områden, blir ditt bästa val en GIF eller PNG-8. Vi tar en titt på hur du får den bästa komprimeringen i var och en av de tre filtyperna som börjar med JPEG. För information om komprimering av PNG-filer eller GIF-filer, bläddra ner på den här sidan.
komprimera en JPG
det är lättast att komprimera en JPG (även kallad JPEG) eftersom det bara finns en sak att tänka på: kvalitet. När du exporterar till JPG från ett bildredigeringsprogram uppmanas du att välja den kvalitetsnivå du vill ha. Du kan bara se några val som: låg, medium, hög eller maximal. Du kan få ett nummerintervall, till exempel 0 (lägsta kvalitet) till 12 (högsta kvalitet). Eller du kan bli ombedd att välja en procentandel från 0% (lägsta kvalitet) till 100% (högsta kvalitet). Du bör alltid välja den lägsta kvaliteten som fortfarande är lämplig för ditt ändamål.
en strategi för att välja den bästa nivån är att börja med en ganska hög kvalitetsinställning och om det ser bra ut, försök att minska kvaliteten lite. Om den reducerade nivån ser tillräckligt bra ut, försök sedan en annan minskning. När du träffar en kvalitetsnivå som är otillfredsställande, säkerhetskopiera sedan till den lägsta nivån som fortfarande var tillräckligt bra för dina ändamål. Tänk alltid på vad syftet med grafiken är. Om du skickar en blomma foto till en botanisk encyclopedia webbplats, du förmodligen vill att det ska vara ganska hög kvalitet så små särskiljande detaljer kan tydligt ses. Om du publicerar ett blommafoto bara för att fira vårens ankomst, skulle en mycket lägre kvalitet troligen vara bra. Låt oss ta en bit av en blomma Foto och exportera ut på sex olika kvalitetsinställningar.
100% kvalitet, 103 KB filstorlek
bilden nedan exporterades till 100% kvalitet. Man skulle sällan någonsin behöva denna inställning.
80% kvalitet, 48 KB filstorlek
inställningen 80% är praktiskt taget omöjlig att skilja från inställningen 100%. Men låt oss se om vi kan komprimera det ytterligare.
60% kvalitet, 28 KB filstorlek
även vid 60% skulle de flesta inte märka någon skillnad från 100% – inställningen och eftersom det är en fjärdedel av storleken skulle den laddas fyra gånger så snabbt.
40% kvalitet, 17 KB filstorlek
för många allmänna användningsområden skulle även denna 40% kvalitetsbild vara acceptabel. Och fem gånger snabbare att ladda än originalet.
20% kvalitet, 12 KB filstorlek
blir ful här.
0% kvalitet, 7 KB filstorlek
blockiness av extrem JPG komprimera i mycket uppenbara.
provfoto från FCITS samling av stock plant-foton på ClipPix ETC-webbplatsen.
ett annat sätt att spara Filstorlek med JPG är att suddiga bilden något innan du komprimerar den. En bild med färre skarpa kanter och skarpa detaljer kommer att komprimera mycket mindre. Kanske tänker du använda ett foto som bakgrundsbild. Det är ett perfekt fall för att använda ett suddigt foto. Du kan till och med oskärpa bara delar av en bild och uppnå filbesparingar. Nedan är ett foto av en daglilja med en upptagen bakgrund. Filstorleken är 77 KB när den komprimeras med 60% kvalitet.
om vi tar samma bild väljer du bakgrunden i ett bildredigeringsprogram som Photoshop och suddar sedan valet, bara bakgrunden blir suddig och blomman förblir skarp. Bilden nedan exporterades till JPG med samma 60% kvalitetsinställning som ovan och är bara 54 KB—en besparing på cirka 30% av filstorleken så att den laddas mycket snabbare. I det här exemplet slutar vi med ett något mer konstnärligt foto där fokus förblir ordentligt på själva blomman och också uppnår betydande besparingar i Filstorlek. Det är en win-win.
en sista anteckning om JPG. Kom ihåg att detta är ett förlustformat. Varje gång du sparar en fil som en JPG förlorar du kvalitet. Om du tror att du någonsin vill använda samma foto igen, se till att du sparar ditt original i ett format som TIFF eller PSD och sedan bara exportera filen till JPG. Det ger dig både den komprimerade JPG att använda på webben och din ursprungliga okomprimerade fil som du kan använda igen senare. Det enda du definitivt inte vill göra är att spara din enda kopia av en fil som en komprimerad JPG, öppna den igen för att redigera och spara den igen som en JPG. Det är som att göra fotokopior av fotokopior. Varje gång kvaliteten blir sämre. Det är alltid bättre att gå tillbaka till din ursprungliga, okomprimerade fil.
komprimera en GIF
det traditionella valet av filtyp för grafik som består av enkla områden och få färger är GIF, även om man nu kan uppnå samma resultat med en PNG-8 (och med en mindre filstorlek).
GIF-bilder är begränsade till 256 färger, men du kan ställa in ett lägre färgdjup för betydande besparingar i Filstorlek. För bästa resultat försök att komma på eller strax under ett av följande antal färger: 256, 128, 64, 32, 16, 8, 4, eller 2. Till exempel, om din bild har 33 färger i det kommer du att kunna raka bort en hel del av filstorleken om du kan minska paletten till 32 färger, men du kommer inte att få samma besparingar flyttar från 32 ner till 31 färger.
se ” vad är bitdjup?”för mer information och exempelbilder.
när du sparar (eller exporterar) som en GIF väljer du först det antal färger du vill ha i din slutliga bild. För det andra, om du märker ”banding” i områden med gradienter, var bilden förmodligen inte en bra kandidat för GIF i första hand, men du kan göra banding mindre uppenbart genom att välja ett dither—mönster-vanligtvis fungerar ”diffusion” – mönstret bäst. För det tredje, om du har transparenta områden i din bild, se till att välja ”transparent.”
det finns några inställningar du kan ignorera. Lämna ”Web snap” inställd på noll. Den här inställningen är kvar från de dagar då de flesta bildskärmar inte visade de miljoner färger som de gör idag. Inställningen ”Matt” brukade vara mycket användbar för att hjälpa till att blanda kanterna på en transparent GIF i bakgrunden, men om det är ett problem för en viss bild, borde du förmodligen byta till PNG ändå.
och naturligtvis har GIF varit det traditionella valet för animerade bilder, även om PNG är redo att ta över det området också.
Provgrafik från FCITS samling av robotillustrationer på TIM-webbplatsen.
komprimera en PNG
vi kommer äntligen till PNG. Det är sist på listan inte för att det är minst viktigt, men för att det innehåller funktioner i både JPG och GIF. Dess popularitet har ökat stadigt och, enligt vissa uppskattningar, används nu på fler webbplatser än antingen JPG eller GIF. Det kan verka lite mer komplicerat till en början, men om du kommer att skapa webbgrafik regelbundet är det verkligen värt att behärska.
först måste du bestämma om du vill exportera som PNG-8 eller PNG-24. PNG-8 är liknande GIF eftersom det är bäst för grafik med få färger och solida områden som logotyper. Den stora skillnaden mellan PNG-8 och GIF är att PNG-8-filen i allmänhet kommer att vara mindre än en GIF-fil. PNG – 24 liknar JPG eftersom det är bäst för bilder med kontinuerlig ton som fotografier eller andra bilder med mer än 256 färger. Den stora skillnaden mellan PNG – 24 och JPG är att PNG-24 är förlustfri så filstorleken blir något större än en JPG, men kvaliteten blir högre.
Exportera som en PNG-8. Om du exporterar till PNG – 8 från ett grafikprogram ser du ett gränssnitt som liknar GIF. Som en GIF måste du välja antal färger (2, 4, 8, 16, 32, 64, 128, eller 256), om du vill lägga till ett gittermönster eller inte, och om du behöver öppenhet eller inte. Den enda signifikanta skillnaden är att PNG-8 blir något mindre.
här är en tecknad film som exporteras som en 32-färg GIF. Filstorleken är 13,6 KB.
här exporteras samma tecknad film som en 32-färg PNG med exakt samma inställningar som ovan. Filstorleken är 10,2 KB. Det är en 25% besparing i Filstorlek.
Provgrafik från FCITS samling av tekniska teckningar på TIM-webbplatsen.
Exportera som en PNG-24. Eftersom PNG-24 är ett förlustfritt format har du verkligen inga alternativ om kvalitet när du exporterar. Till skillnad från en JPG kasseras ingen bildinformation. Det betyder också att filstorleken kan vara ganska stor.
här är ett foto av Aror som exporteras som en PNG-24. Dess filstorlek är 400 KB. Det är ganska stort.
här är samma foto som exporteras som en JPG med inställningen maximal kvalitet (100%). Dess filstorlek är 259 KB.
och här är samma foto exporteras som en JPG på hög kvalitet (60%) inställning. Dess filstorlek är bara 69 KB.
prov foto från FCIT samling av stockanimal bilder på ClipPix ETC webbplats.
Wow, om PNG är 5 eller 6 gånger filstorleken för en användbar JPG, varför skulle jag någonsin vilja använda den? Tja, det kan finnas flera skäl för att välja PNG-24 över en JPG.
1. Om du behöver transparens i bilden är PNG nödvändig eftersom JPG inte stöder transparens.
2. Om du vill ha ett förlustfritt format behöver du PNG eftersom även vid maximal inställning förlorar en JPG information och bilden försämras även om den inte är uppenbar vid första anblicken.
3. Om du absolut behöver en tydlig bild utan JPG-komprimeringsartefakter är PNG ditt val. Ett bra exempel är en skärmdump som innehåller mycket liten typ. Av sin natur, en JPG kommer att ”smeta” den typ som gör det lite svårare att läsa. PNG kommer att återge typen pixel-för-pixel precis som den verkade ursprungligen på skärmen.
relaterade sidor
vad är skillnaden mellan bitmapp och vektorbilder?
vad är bitdjup?