antibiomatika

To PNG or not to PNG

2002-08-21 02:59

Mye ondt kan skrives om Internet Explorer, sikkerhetshullene er velkjent.

Det jeg dog irriterer meg mest over for tiden, har intet med sikkerhet å gjøre, men at browseren ikke makter noe jeg mener er nokså elementært for en grafisk browser: å vise grafikk.

Før du leser resten av denne artikkelen, foreslår jeg at du leser den både i Internet Explorer, og i enten Opera eller Mozilla, slik at du har en mulighet til å forstå hva jeg mener.

Først: la meg komme med en hyllest til PNG som billedformat. God, fleksibel og patentfri erstatning for GIF, med full støtte for Alphachannels, som tillater en å lage delvis gjennomskinnelige områder i et bilde.

Desverre er dog Alphachannels ubrukelig på web i dag, fordi den mest populære browseren har en mildest talt elendig støtte for dem, og jeg har tenkt å illustrere det ved noen enkle eksempel.

Testreferanse alphachannel PNGTil venstre for denne teksten, er er referansen for vårt testbibilde, og viser hvordan bildet vårt bør se ut.

Testbilde alphachannel PNG 8bpp transparentSe så på bildet til venstre, som er en alminnelig 8bpp PNG med transparent bakgrunn. Du legger merke til de litt taggete kantene. De kommer av at vi ikke lenger drar nytte av PNGs muligheter til alphablending. Et område i bildet må altså enten være helt gjennomskinnelig, eller helt ugjennomskinnelig.

"Hva så, det er jo bare å bruke grafikkverktøyets Matte-funksjon når jeg lagrer", kan sikkert den enkelte webdesigner si.

Vel, fullt så enkelt, og rosenrødt er det dessverre ikke. Hva om man ønsket å drive litt fleksibel, og avansert bildekomposisjon, eller man ønsket å endre bakgrunnsfargen?

Testbilde PNG 8bpp transparent med bakgrunn.I eksemplet til venstre, har vi lagt en bakgrunnsbilde bak selve bildet. Denne er lagret som 24BPP PNG. Bakgrunnsbildet kunne like gjerne vært langt mer komplisert, men denne illustrerer problemet like greit. Å bruke "Matté" er uaktuelt, fordi vi har to vidt forskjellige bakgrunnsfarver bak bildet, og hvis du legger merke til bakgrunnsbildet i IE, vil du se at den ikke lenger har den blåfarven vi ønsker, men har blitt ekkelt skummetmelkehvit.

Testbilde PNG 24bpp transparent med bakgrunn.Med Alphachannels derimot, vil vi kunne beholde både den fancy, flerfargete bakgrunnen, og samtidig få myke, runde linjer rundt teksten vår, altså slik antialiasingen er ment å fungere. Hvis du nå ser eksemplet til venstre i IE, vil du ikke engang se bakgrunnsbildet, fordi vi nå har skiftet ut selve bildet med en 24bpp-variant med. I Opera og Mozilla virker dette som det skal, og du ser hva forfatteren av siden har ment du skal se.

Og det er akkurat her det store problemet til IE ligger: den skjønner overhodet ikke begrepet 24bpp PNG med alphachannels. Hvilket er rart, både tatt i betraktning at Opera og Mozilla har klart dette i flere år, og fordi IE i seg selv støtter transparens gjennom sine proprietære utvidelser til CSS.

Oppfordringen er grei: gi den første du møter i IE-utviklingsteamet et spark bak, og be dem fikse dette.

Kommentarer

Det er ikke åpent for å legge til flere kommentarer.