Avatar billede Slettet bruger
26. januar 2003 - 10:41 Der er 14 kommentarer og
2 løsninger

Kan ikke hitte ud af transparancy på gif og png

Hej!

Nu har jeg i timevis prøvet at lave en simpelt psd fil til en gennemsigtig gif eller png.

png er nemt nok, desværre vises den i IE 6 med en blålig baggrund, selvom den vises korrekt i Opera, Netscape og Mozilla.

Det har jeg læst er et IE problem, så png er skrottet igen.

Med gif får jeg altid en hvid sørgerand omkring mit billede, og det er absolut ikke transparent.

psd filen er ret simpel, gennemsigtig baggrund, og 2 layers med tekst på.

Du kan hente filen her: http://siterater.dk/test.psd

Kan jeg ikke få en af disse ting:
- simpel forklaring på gennemsigtig gif der virker
- lav det lige om til en gennemsigtig gif ;)

På forhånd tak
Avatar billede prodic Mester
26. januar 2003 - 12:41 #1
Hvis du leger lidt med Matte under Save For Web kan du have held til at fjerne den hvide kant.
Jeg ville dog lave lidt om på billedet. Ikke ret meget, da jeg kun ville fjerne skyggen som er skyld i dine problemer. Den tynde skygge gør Gif-formatet "forvirret" hvilket du har opdaget.
Avatar billede michael-k Nybegynder
26. januar 2003 - 12:47 #2
Er enig med prodic at det er skyggen, jeg gik dog et ok resultat ved at sætte den til Difusion transparent Dither  og matte til hvid   

Du kunne også prøve at fjerne din skygge og smide en bevel på omkring 0-1  giver en ok effekt
Avatar billede michael-k Nybegynder
26. januar 2003 - 13:01 #3
prøvede lige at smide den på en baggrund  ser ikke så godt ud  så glem det lige igen ;)
Avatar billede michael-k Nybegynder
26. januar 2003 - 13:24 #4
har prøvet at lege lidt med det, så her er min fortolkning af problemet, håber det hjælper lidt http://www.teamdesigner.dk/test.html
Avatar billede Slettet bruger
26. januar 2003 - 14:36 #5
Øv...jeg ville gerne have den tynde drop-shadow, og det kan jeg også i png formatet. Men åbenbart ikke i IE 6 :(

Jeg har vurderet lidt frem og tilbage, og besluttet at jeg lægger den rigtige baggrund på, og beholder noget af den.

På den måde kan jeg få min skygge, men det ser ikke så pænt ud i 256 farver. Men absolut acceptabelt.

Er der nogen der er stødt på problemet med transparens i png før? Det underlige er at det kun er IE der brokker sig...

Anyway, prodic må også gerne lige svare så ryger der point afsted til jer begge. Især michael-k, da jeg måske vil overveje den bevel effekt.
Avatar billede michael-k Nybegynder
26. januar 2003 - 15:13 #6
fandt en lille diskution her om emnet. http://inmyexperience.com/archives/000274.shtml
Kender desværre ikke selv så meget til png formatet, bruger altid jpg eller gif.  Men det skal nok komme mere og mere frem, da det lyder til at være meget godt, dog ikke i IE ;)
Avatar billede beorndesign Nybegynder
26. januar 2003 - 20:48 #7
En løsning der virker: Hvis du har Macromedia Flash, kan du hente dit .png billede derind og eksportere din "film" (billede) med transparent baggrund!

Hvis denne løsning har interrese, kan jeg maile det til dig, hvis jeg får din e-mail!

Hvis din baggrund er ensfarvet, kan du gemme billedet som .gif og vælge en 'matte' med samme farve som din baggrund (ved Export to Web...)

Evt. vil du også kunne eksportere dit billede fra Illustrator, med en transparent baggrund (.swf) - men dette har jeg ikke prøvet!

Dette må nok siges at være de eneste løsninger der er på dit problem!
Avatar billede cgleerup Nybegynder
01. februar 2003 - 10:17 #8
Du ville gerne have en forklarring, så lad os prøve engang!

Gif:
Når du gemmer dit billede som gif konverteres billedet til kun at bestå af maximalt 256 farver, én af disse farver kan optræde som gennemsigtig under visningen. I realiteten er en gif således en ganske almindelig billedfil med indexerede farver, hvor computeren/browseren eller hvad det måtte være ved at den skal hvis eksempelvis farven R:78 G:98 B:45 som gennemsigtig.
Da gif-filen komprimerer ved at reducere antaller af farver i et billede, er det også en misfortåelse at benytte gif til at gemme fotos og andre billeder med gradianteovergange osv. - og det er netop her at en dropshadow får problemer, for her er jo netop tale om en slags farveforløb, hvilket vil sige at der benyttes måske 50 forskellige grå nuancer for at danne illusionen af skyggen. I området af den sidste tone ud til baggrunden af billedet vil der ydermere være nogle kantpixels som opstår ved antialiseringen af billedet. Og gif kan som sagt kun definere én farve som værende transparent - hvilket betyder at du udover en ikke helt optimal komprimering også får eksempelvis den hvide kant på billedet.

PNG:
Men hvorfor kan png formatet så gemme din transparente baggrund korrekt, når ikke gif kan?
- det skyldes i alt sin enkelthed at de to formater er så foskellige som nat og dag. PNG formatet gemmer således ikke ved hjælp af en indekseret farvepalette, men kan istedet indeholde en såkald alfakanal. Alfakanaler består af sort og hvid, hvor sort definere den farve som er væk, og hvid definere den farve som udgør det synlige område på billedet. Du kan naturligivs ikke se disse sorte og hvide faver i din browser, men i princippet er de der. Imidlertid kan en sådan alfakanal dog også tolke de variende nuancer af sort og hvid, altså det der kunne svare til en dropshadow hvor du har de måske 50 nuancer imellem 100% Sort og 100% hvid. På den måde får du en pæn transparent baggrund.

Begge formater benytter iøvrigt hver deres tabsfrie komprimerings algorite, hvis princippet bedst kan forklarres ved at sammenligne med et pakke program der kan pakke filen og síden hen pakke den ud - derfor tabsfri.

Kompatibiliteten:
Som du selv er inde på er der dog visse problemer med PNG formatet. Det skyldes først og fremmest at formatet er forholdsvis ungt - dog ville jeg mene at det skulle vise sig korrekt i IE, men allright.
I 1995 besluttede compuserve og unisys at programmer som integrerede formatet skulle betale en licens for at bruge LZW algoritmen til komprimering, hvilken UNISYS havde patent på.  - den udvikling var det naturligvis ikke alle der kunne li´og en række eksperter valgte tilsynelande at udvikle et nyt format i denne forbindelse. Det blev til PNG-8 og PNG-24 som er de to varianter der idag kendes. PNG-8 er et giflignende format som gemmer ved hjælp af de 256 faver og kan definere 1 transparent farve. Hvorimod PNG-24 benytter en konvertering fra RGB farver til RGBA hvor "A" definerer alfakanalen.

Problemerne med browserkombatibiliteten ligger tilbage fra den gang, mange trode nemlig ikke at det ville være muligt at lave en komprimeringsalgorite som var mere effektiv en den tabsfrie LZW. Men faktisk måtte man erkende at PNG´s tabsfrie algoritme komprimere imellem 5 og 25% mere effektivt, og i nogle filfælde helt op til 40%. Og jeg mener faktisk også at der er tale om et opensource format !
Avatar billede cgleerup Nybegynder
01. februar 2003 - 10:18 #9
- konklussionvis vil jeg dog sige at du skal benytte gif, hvis du absolut vil lave transparente billeder på internettet. Men ellers er der mange andre finulige løsninger, hvorved du kan bruge jpeg istedet. Men altså gif hvis billedet ikke indeholder ret mange farver.
Avatar billede Slettet bruger
02. februar 2003 - 11:40 #10
cgleerup> Tak for den fine gennemgang, jeg kan godt se at gif ikke er det mest egnede. Jeg valgte dog at beholde det format, men vil senere lege med png.

png virkede nemlig glimrende med transparent baggrund, lige indtil jeg så siden i IE 6.

Et svar?
Avatar billede beorndesign Nybegynder
02. februar 2003 - 12:06 #11
.png er et udmærket format, indtil du bruger det i IE. Brug .gif eller .jpg, som også fylder mindre, eller .swf (flash)som også er et udmærket format. Et forslag ved brug af gif: Lav hver anden linie (altså pixel i en linie) ensfarvet - f.eks. hvid eller sort, derved kan du bruge færre farver uden at det kan ses på kvaliteten!
Avatar billede Slettet bruger
02. februar 2003 - 12:21 #12
Jeg har ingen intentioner om at bruge flash bare for at vise et simpelt billede.

Det du foreslå med hver anden linie lyder meget som scanlines? Ikke lige min favorit ;)

jpeg kan ikke laves gennesigtig, gif kan åbenbart ikke laves gennemsigtig med flere "niveauer". Det kan png.

Løsningen må være at leve med gif til IE6 bliver slagtet...
Avatar billede cgleerup Nybegynder
02. februar 2003 - 12:42 #13
>> beorndesign - jpeg fylder kun mindre målt på photos, har du en fil bestående af eksempelvis 4 faver er gif at foretrække, men i begge tilfælde er png en værdig konkurrent. Og de fleste tests tyder faktisk på at PNG slår gif med ca. de omtalte 5 - 25% bedre komprimering af et givent billedet. Men ja, du har det helt ret, og jeg tror også det var sådan at jeg rundede af ?!
Avatar billede beorndesign Nybegynder
02. februar 2003 - 20:11 #14
Som jeg har nævnt tidliger, har du også mulighed for at bruge Illustrator til at lave en .swf via guiden Export to Web...

Problemet med .png er at det er open source, hvilket Microsoft ikke er ret meget for at understøtte - men der er jo bare Microsoft i en nøddeskal!
Avatar billede hold-da-lige-ferie Nybegynder
10. februar 2003 - 03:56 #15
lukketid
Avatar billede Slettet bruger
16. februar 2003 - 18:44 #16
Tak for indlæggene :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
IT-kurser om Microsoft 365, sikkerhed, personlig vækst, udvikling, digital markedsføring, grafisk design, SAP og forretningsanalyse.

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester