homepage Welcome to WebmasterWorld Guest from 204.236.254.124
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
Forum Library, Charter, Moderator: open

Site Graphics and Multimedia Design Forum

    
Can PNGs be transparent?
eeblet




msg:851189
 11:44 pm on Mar 14, 2002 (gmt 0)

Yup. That's my question, not much else to say.... ;)

 

tbear




msg:851190
 12:06 am on Mar 15, 2002 (gmt 0)

I believe so, I just checked with PSP 7 but not on the web.... Showed me the transparent version.

mivox




msg:851191
 12:16 am on Mar 15, 2002 (gmt 0)

I've always heard that superior transparency ability was one of the standout features of PNG... Think of nice fuzzy drop shadows that are TRULY semi-transparent... No more off-color halos around those graphics!

The problem seems to be finding a program that can CREATE PNGs with all the bells and whistles, and then finding a browser that fully SUPPORTS all the bells and whistles to view them with.

One of those fabulous but not-quite-ready-for-prime-time things... Kinda like the CSS2 of the graphics world.

tbear




msg:851192
 12:38 am on Mar 15, 2002 (gmt 0)

>One of those fabulous but not-quite-ready-for-prime-time things
Do you not advise using then, I've to see a client tomorrow to talk about re building his site and taking new fotos. At the moment all his images are PNGs.

mivox




msg:851193
 12:57 am on Mar 15, 2002 (gmt 0)

Oh, as long as you're not relying on them for their fabulous transparency capabilities, they're a great substitute for gifs.

How well have you found them to work for photos though? I was under the (mistaken, perhaps?) impression they worked best for flat-color gif type images...

It's really not something I've used much, because PhotoShop's GIF compression settings are much better than their PNG tools, and I haven't gone hunting for a good png compression program or plug in.

tbear




msg:851194
 1:06 am on Mar 15, 2002 (gmt 0)

>How well have you found them to work for photos
To be honest I haven't done more than look at them and leave them. The pics on this hotel site are a bit dim looking and fuzzy (could be the photographer :+)
I was gonna put JPGs thinking not everyone would see the PNGs?

SmallTime




msg:851195
 1:09 am on Mar 15, 2002 (gmt 0)

PNG is Fireworks native format, can do whatever you want with them. However, transparency support in browsers problematic. test page [entropymine.com...] In my Opera 6 all tests look good, in IE 6 most fail.

tbear




msg:851196
 1:15 am on Mar 15, 2002 (gmt 0)

>in IE 6 most fail.

Seeing that, I guess I'll stick to plan 1. Thanx smalltime.
I'm always amazed at the recoursefulness around here.

mivox




msg:851197
 1:19 am on Mar 15, 2002 (gmt 0)

I'm pretty sure the vast majority of visitors will see them these days, at the very least... But I'm not sure why you'd use them for a photographic image. I haven't found JPG terribly lacking in that area. GIF is where the real room for improvement lies...

Then again, if PNG can handle flat color AND photographic images with equal quality and flair, how much simpler to be able to use only ONE graphics format for the web, rather than two? I could live the rest of my days dealing only with PNG and TIFF... ::sigh::

My problem is that I don't think it's worth the expense for me to use both Photoshop and Fireworks just to gain better PNG support, and I do enough print work that Photoshop is definitely my preferred program of the two.

Does anyone know of a good Photoshop PNG plugin?

rjohara




msg:851198
 3:19 am on Mar 15, 2002 (gmt 0)

Then again, if PNG can handle flat color AND photographic images with equal quality and flair, how much simpler to be able to use only ONE graphics format for the web, rather than two?

I'm in the process of converting all the images (mostly photographs) on my two academic sites to PNGs, and have spent the last week studying PNG stuff (though whether I've learned much is another question). So here's a summary from a one-week-expert (i.e., amateur), and what I decided to do:

The PNG format does support transparency. In practice, some browsers still can't display this aspect of PNGs, though, so if you have, say, a round image that depends on a transparent background to blend in, then some users will see an ugly non-transparent rectangle. So the few images I have like this I have left as GIFs for now.

PNG is a lossless format, like TIFF, whereas JPG is a lossy format. This makes PNG good for storing master copies of images; I'm now scanning original photos in PNG format for storage; JPG should definitely not be used for this purpose. Even if you decide to display in JPG, keep the PNG original and you will always be able to recreate anything from it.

Loss-less-ness was one of the virtues of TIFF, and it was why people often stored archival scans in TIFF format. PNG can replace this, and in principle it can store the files more compactly (certainly not any bigger than TIFF).

I said in principle, because although PNGs can compress losslessly very well, early editing software (such as early Photoshop; not sure about current versions) had lousy compression algorithms. (That's lousy, not lossy.) :) I'm using Photoshop 4 on a Mac, and my PNGs of photographs are about 25% bigger than corresponding GIFs, and much bigger than JPGs. This is *not* inherent in the PNG format: it is just poor implementation of compression in Photoshop. If I resave those same files in a newer version, they may shrink considerably.

In spite of this size difference, I am now converting all my photo images to PNGs and am scanning new images as PNGs. Why? Because the truly amazing feature of PNG is that it can preserve the *gamma* information of the image with the file. I'm not a graphics specialist so can't explain the technicalities, but you can think of gamma information as information about the brightness and contrast of the original, so that when the image is called up *on any browser* it is automatically color-corrected and displays beautifully.

This last feature so outweighs anything else as far as photos are concerned that once I learned about it enough to understand what was going on I immediately started converting everything. I'm a Mac user, and I also take natural history photos. When I've put them up on my machine they look good, and then I look at them on a PC and they look like mud. As a Mac person, I'd just insert the obligatory expletive about PCs and assume that's just the way things would always be. Then I discovered PNG gamma correction (last week). My images now have just the same color balance and brightness on a PC screen that they have on my Mac.

Since this is of interest to many people I think, I've made a demo page on my personal site that shows this effect with three sample images. If the moderator will permit: just take my username and add .net/server/pngtest.html and you will see.

A starting point to learn more is the W3C PNG page:

[w3.org...]

mivox




msg:851199
 4:10 am on Mar 15, 2002 (gmt 0)

Sounds like it's about time for me to start figuring this stuff out!

Thanks for the excellent overview... :)

eeblet




msg:851200
 3:39 pm on Mar 15, 2002 (gmt 0)

Thanks! That test page was most helpful.... Look forward to the day IE is a bit more, well, supportive.

caine




msg:851201
 3:48 pm on Mar 15, 2002 (gmt 0)

yes png's can be transparent, it all depends on the graphics package. - try fireworks.

Duckula




msg:851202
 4:44 pm on Mar 15, 2002 (gmt 0)

Here's my small contribution based on what I have tested so far. Mozilla 0.9.9, what I'm using right now, renders the transparency flawlessly. So does Opera 6.x, at least under linux. Konqueror renders the png like a gif, with rough borders, but at least renders transparency. Internet explorer 5.5 renders white where transparent should be. I don't remember if I tested on IE 4 and 6, but you should expect similar behavior.

You can find more about supported browsers on the libpng web site.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved