Skillnader på bildformat

Att välja bilder handlar om kommunikation och estetik. Ändå finns det gott om plats för lite tekniksnack!

Pixlar

Digitala bilder består av pixlar. Pixel är ett sammandrag för "picture element" och är den minsta prick som en bild kan bestå av. Man kan enkelt säga att en digital bild är en stor mosaik av massa fyrkantiga plattor.

Storleken har betydelse

Ju fler pixlar en bild består av desto längre tid tar den att ladda ner. Försök därför hålla storleken nere. Pixlar för kortas till "px". Även storleken på bildskärmen kan mätas i pixlar. Man pratar då om upplösning. Vanligaste upplösningen idag är troligtvis 1920 px bred och 1080 px hög.

Minska nerladdningstiden enkelt

Det finns några enkla och effektiva knep för att få bilderna lätta (snabba att ladda hem) utan att göra dem för små (i pixlar räknat). Knepet kallas bildkomprimering. Det finns två vanliga typer av komprimering som man använder sig av för websiter.

JPEG, GIF och PNG

JPEG kallas alla bilder som slutar på .jpg Du kanske känner igen det? GIF slutar följdaktligen på .gif. JPEG är framtaget för att komprimera fotografier effektivt. Och effektivt är det! Ett foto som innan komprimering är två megabyte stor kan som JPEG bli endast 100 kByte.

GIF är ett format som börjar bli utdaterat. När det kom för massor med år sedan revolutionerade det marknaden genom att dels kunna ha en en färg som blir genomskinlig och dels för att det gick att skapa små animerade filmer. Webben översållades av hackiga små animerade bilder på arbetare som hackade i en väg med texten "under konstruktion". Problemet med genomskinligheten var att den bara kunde vara helt genomskinlig eller inte alls, så det blev ganska fult.

Så kom PNG och erbjöd en riktig så kallad alfa-kanal. Det innebär att man kan ha t.ex. en skugga som faller snyggt eller att den frilagda bilden blir snyggt kantutjämnad.

JPEG förstör bilden

Bilden blir mindre därför att massvis med information kastas bort. Om man kastar bort för mycket kommer bilden bli ful, därför måste man göra allt med måtta. Man mäter kompression i procent på JPEG. En bild som är har 100% kvalité är stor och fin, 0% är extremt liten och ful. Förhållandet mellan kvalité och storlek är exponentiell. Det innebär att skillnaden i storlek är markant på 100% och 90% och man ser knappt någon skillnad på bilden. Samtidigt är skillnaden i kvalité väldigt stor mellan 70% och 50%. ContentaWeb tar automatiskt hand om detta genom att spara all bilder till 95% JPEG. Detta är en kompromiss som för det mesta fungerar alldeles utmärkt. 

Generellt sett så är JPEG mest effektiv på bilder med mycket färger och inga skarpa kanter. Med andra ord så skulle en oskarp bild på himlen bli mycket mindre än en skarp bild på en cyklist. Bilderna nedan är lika hårt packade och är lika stora i pixlar räknat. Ändå ser du vilken skillnad det blir i ledladdningstid. Eftersom bandbredden börjar bli ett försvinnande problem är det inte längre så relevant att jaga kilobytes ens på mobila sajter.

 

Denna bild är 4 kB.

 

Denna bild är 9 kB!

Läs mer om ämnet här:

Prata med oss om webb och marknadsföring!

Vi arbetar nära våra kunder och söker alltid en långsiktig relation. Vi har flertalet kunder som vi jobbat med i över 20 år.