Multimedia for the Web

Känns som om jag börjar närma mig slutet av Bildmodulen, hade fastnat riktig rejält här …

Sammanfattning av studiepasset:

Först läste jag igenom lite teori om jpeg-komprimering som jag hade kvar sen igår.
Mesta tiden idag gick dock ut på att sätta ihop Spriten samt att finjustera så att de riktiga delbilderna visades där de skulle.
Jag jobbade i Photoshop, Gimp och Dreamweaver. Först skalade jag ner bilderna till 128*128 pixlar, precis som i exemplet från kursmaterialet. Jag laddade ner hela den HTML-sidan och undersökte i DW.
Sedan komponerade jag den egna Spriten. Vid ett moment fastnade jag helt då DW betedde sig underlig. Jag fick någon konstig slags error i Live View medan allt funkade bra i vanlig mode. Den ville inte visa de delbilderna jag ställde in. Men bara i Live View…
Höll på länge med den detaljen. Till slut gjorde jag om allt från början igen och då funkade det. Men det tog sin tid och lite huvudvärk :-S
Här är en till 128×128 px nedskalad version av själva Spriten:

En enkel punktlista i html samt lite justeringar i Child Theme borde räcka att få ihop upgiften här på WP också. Men jag är för trött att göra det just nu. Det går nog snabbt imorgon bitti.

Till slut försökte jag lägga in lena.svg i Spriten men lyckades mindre bra. Jag ska jobba på det imorgon. Det verkar dock som om filändelsen .svg inte funkar i WP, “for security reasons” som det varnades om. Men jag ska försöka lägga in den i Spriten (som är png) för att testa imorgon.

Enligt formlerna i föregående post och på bilden lena_std.tif, skulle det alltså enligt uppgiften bli:

• 4 bpp   …  128 kB
• 2 bpp   …  64 kB
• 1 bpp    … 32 kB
• 0,5 bpp … 16 kB
• 0,25 bpp … 8 kB

4bpp 128 kB:

0,25 bpp 8 kB:

X bpp 405 kB
Jag fick 405 kB när jag försökte med X = 14,5 bpp (som var png’s bpp) och borde ge 464 kB. För att åstadkomma detta använde jag GIMPS advanced options:

• Optimize
• Progressive
• Subsampling: best quality
• DCT method: fast Integer

Lägre komprimering är så (bättre kvalité) kan inte GIMP ge.

PNG (portable networks graphics) or (Png is Not Gif 🙂 )
Det som jag hittills förstått är att png använder sig av en pixels närliggande pixlar för att med en algoritm beskriva det nya färgdjupet.
Här är i alla fall en sajt som beskriver vilka parametrar man kan variera i en png-kompression.
I alla fall, jag har nu följande bilder att räkna på:

Kompressionsgrader:

Samtliga bilder är 512×512 = 262144 px.
1 B = 8 b
1 kB = 1024 B
Formeln är: KompressionsGrad i bpp = bits / (Pixlar x Pixlar)
Gimp:

1. lena level 0 …… 769 kB = 787456 B = 6299648 bits => 24 bpp => 100% => 1:1
2. lena level 2 …… 511 kB = 523264 B = 4186112 b => 15,8 bpp => 66,5% => 1,5:1
3. lena level 9 …… 465 kB = 476160 B = 3809280 b => 14,5 bpp => 60,5% => 1,6:1

Photoshop:

1. lena ……. 500 kB => 15,8 bpp => 66,5% => 1,5:1
2. (lena interlaced … 540 kB)

Slutsats : Level 9 är alltså den starkaste komprimeringen man kan få med GIMP och blir c:a 5% mer än vad PS kan åstadkomma. Bilden blir då c:a 40% mindre än originalbilden.
And if I re-saving it as lossless tiff, it becomes 768 kB again!

Slutsats nr2: GIMP seems to be must more broader program than PS 😉