Optimering avser processen att få filer att läsas in snabbt genom att minska deras filstorlek, samtidigt som bildens kvalitet bibehålls.
Bilder som inte har optimerats innan de laddas upp för användning på en webbplats kan påverka webbplatsens inläsningshastighet negativt och få besökare att lämna webbplatsen. Detta är ett stort problem när man försöker bygga ett varumärke och öka webbplatstrafiken. Filstorlek och bildkvalitet är två faktorer som kan ha stor inverkan på hur snabbt en sida läses in.
I denna guide
Ta till exempel den här lilla bilden i utskriftskvalitet. Den laddades ner från Unsplash.com och är 2048 × 1286 vid 240 DPI (Dots Per Inch). Filstorleken är det ganska rejäla 1,1 MB.
Låt oss ta samma bild och minska dess dimensionstorlek och DPI innan vi laddar in den i vårt mediabibliotek. Vi får då samma resultat fast utan den onödiga bildvikten.
Om du letar efter ett snabbt sätt att minska bildstorleken kan du använda kostnadsfria tredjepartsverktyg, till exempel det här.
Om du vill ha mer kontroll över hur bilden optimeras, fortsätt läsa för att få en mer djupgående översikt. Vi kommer att använda två gratisprogram för att minska bildstorleken. Du kan ladda ner dem här:
För att minska filstorleken:
- Öppna bilden i GIMP
- Klicka på Bild i verktygsfältet och välj sedan Skala bild
- I Bildstorlek ändrar du bredden till 1 920 px (eller önskad bredd)
- Klicka på Skala
- Välj Arkiv i verktygsfältet. Välj sedan Exportera som
- Ge din fil ett namn som slutar med ”.jpg”
- Välj Exportera
- I dialogrutan som öppnas ändrar du Kvalitet till 60
- Klicka på Avancerade alternativ.
- Ändra Delsampling till 4:2:0 (chroma quartered)
- Klicka på Exportera
De här inställningarna är en bra utgångspunkt. Du kan dock justera dem efter eget önskemål.
Här är en jämförelse av resultaten:
Vi kan göra bildstorleken ännu mindre genom att använda ImageOptim (Mac-app eller webbtjänst)
Öppna ImageOptim och välj en kvalitet på 60 % för varje filtyp:
När du har lagt till dessa inställningar högerklickar du på bilden som du vill optimera och väljer Öppna med ImageOptim.
ImageOptim kommer automatiskt att minska filstorleken i enlighet med våra valda inställningar.
Denna ändring går inte att ångra. Se till att säkerhetskopiera filen innan du går vidare.
Om du använder en PC, ladda upp bilden till ImageOptim-webbplatsen så kommer de att tillhandahålla en nedladdning av den optimerade filen.
Webbplatsversionen är inte gratis utan har en månatlig kostnad. De erbjuder dock en gratis provperiod.
Om du publicerar på din webbplats med WordPress-appen ger appen dig möjlighet att optimera bilder.
I WordPress-appen för iPhone kan du ange Maxstorlek på uppladdade bilder, så att originalfilen storleksändras automatiskt när du laddar upp den. Du hittar detta alternativ genom att gå till Min webbplats och klicka på profilikonen längst upp till höger. Därefter väljer du Appinställningar.
I WordPress-appen för Android klickar du på profilikonen i det övre högra hörnet och väljer Appinställningar. Där aktiverar du Optimera bilder för att storleksändra och komprimera bilder vid uppladdning.
Retina-skärmar har en mycket högre pixeltäthet än vanliga skärmar, vilket kan få bilder med en vanlig pixeltäthet att se suddiga ut. För att förhindra detta tillhandahåller vi bilden i dubbel storlek om vi upptäcker en Retina-skärm, så att bilden visas med maximal skärpa. Detta fungerar bara om bilden som visas i ditt mediabibliotek är större än bilden som visas på din webbplats.
Även med dubbel maximal visningsstorlek på din blogg ska en bildfil fortfarande vara betydligt mindre än vid den fulla upplösningen som används av din kamera, så att du kan optimera dina bilder och få dem att se bra ut på Retina-skärmar.
Andra bildredigeringsverktyg kan ha enkla alternativ för att storleksändra och komprimera ett antal foton mycket snabbt. Paket som Photoshop/Paint Shop Pro fungerar också, men det finns fler kostnadsfria alternativ, inklusive:
Det finns också webbaserade tjänster som du kan använda:
WordPress.com Support 