Man ser ofta uppmaningar att bilder för olika webbsidor skall sparas i 72 dpi. Jag har själv också för inte så länge sedan rutinmässigt haft med den uppgiften när jag har begärt in bilder för webbsidor. Men faktum är att det är en myt att man skulle behöva spara bilderna i någon specifik upplösning när bilden skall användas på en webbsida! Här får du lite beskrivningar och längst ner ser du några exempel.
DPI (dots per inch, punkter per tum) är en anvisning som behövs enbart för bilder som skall tryckas. I ett tryckalster anges bildstorleken alltid i tum eller centimeter. När en bild trycks så anger dpi-talet hur stor bilden blir; en bild som tex. är 3000*2000 pixel och sparad med upplösningen 240 dpi blir alltså 3000/240 = 12,5 tum bred, dvs knappt 32 cm. Gör man bilden större än så i tryck så förlorar den i kvalitet.
För en webb-bild kan man inte ange storleken i tum eller centimeter, eftersom olika bildskärmar har olika storlek och olika upplösning och olika storlek på bildskärmens pixlar. På webbsidor anges bildstorlek därför alltid i antal pixel. Det betyder att dpi-värdet helt förlorar sin betydelse - en 800 pixel bred bild är alltid 800 pixel bred, oberoende om den är sparad i 72 dpi eller 300 dpi!
Om en webbsidas bredd är max 1024 px så lönar det sig inte att spara bilden med större bredd än så. Om bilden bara skall användas i webbsidans högerspalt och den spaltens bredd är 260 px så lönar det sig inte att spara bilden i ett större format än så. En webbsida med överstora bilder laddas betydligt långsammare än en sida med optimerad bildstorlek! Om bilden sparas i för litet format (tex. 500 px bredd för en 800 px bred spalt) och förstoras så förlorar den mycket i kvalitet. Därför är det användningsområdets maximala storlek som gäller som utgångspunkt.
Vissa webbsidor förminskar automatiskt överstora bilder i samband med uppladdningen, men de här processerna är inte alltid så noggranna. Fotoediteringsprogram (Lightroom, Photoshop, PaintShop, Gimp, FotoSizer mfl.) gör ett betydligt bättre jobb, så förminska alltid dina bilder till lämplig storlek före du laddar upp dem!
För webbsidor kan bilder sparas i filformaten jpg, png eller gif. Jpg-bilder kan innehålla mera information än de två övriga (tex. EXIF-information och också den dpi-anvisning som ju inte behövs). Om man i Photoshop sparar bilder för en webbsida så lönar det sig att använda "spara för webben" - den funktionen tar bort onödig information i den sparade bilden och gör därför filstorleken mindre.
Om du skall spara en bild för att användas på en webbsida, så ta alltså först reda på vilken maximistorlek i pixel som behövs och spara bilden i förväg enligt det - glöm dpi och gör filstorleken så liten som möjligt!
Exempel
De här exempelbilderna visas alla med 300px bredd. Samma bild har sparats från Lightroom i olika storlek och med olika dpi-inställning. Kan du se någon skillnad på de tre första? Knappast. DPI har alltså ingen betydelse och det är onödigt att göra webbsidan långsammare med överstora bilder (se filstorleken på de tre första). Den sista bilden visar hur kvaliteten försämras om man gör bilden för liten.
300*300px, 72dpi, filstorlek 120Kb
300*300px, 300dpi, filstorlek 120Kb
600*600px, filstorlek 271Kb
150*150px, filstorlek 57 Kb
Läs mer om det här på bla.
{jcomments on}