...

View Full Version : How to save a PNG file as a JPEG with a transparent background using Adobes suite.



RexxCrow
11-03-2007, 12:48 AM
I have been trying to figure this out but it saves the image with a white background, how do you get ride of that and keep it transparent? I also tried it as a GIF which worked but the quality is so poor it makes it pointless to go that route. TIA

toddandrae
11-03-2007, 12:56 AM
What program are you using? Is the background transparent in the file?

VIPStephan
11-03-2007, 01:34 AM
I’m not so sure about Photoshop but in Fireworks you can save it as 32 bit PNG which has millions of colors and alpha transparency. I think in Illustrator it will export (“save for web & devices”) 24 bit PNGs with transparency as well (dialog box lets you choose) but I’m not too experienced with it.

PappaJohn
11-03-2007, 03:03 AM
You cannot save it as a JPEG and maintain the transparency. JPEG's do not support transparency. Your best bet is as VIPStephan suggests

RexxCrow
11-04-2007, 03:43 AM
Ok thx, yea I was trying to do it for a webdevice through Illustrator as VIPStephan used in his example, and I kept getting the white backgrounds so I will try it through fireworks when I get the chance....thanks much.

DakotaChick
11-19-2007, 08:53 AM
Gif's also support alpha transparency and the file sizes are smaller than the PNG's.

VIPStephan
11-19-2007, 11:57 AM
Gif's also support alpha transparency and the file sizes are smaller than the PNG's.

The first point is not true and the second one really depends on the kind of image.

GIF does not support true alpha transparency, only index transparency (i.e. 100% or 0%, nothing in between).
GIF is smaller for images up to a certain dimension but it’s very marginal. Like when I export background images for a website an image of 5x5 pixels might be smaller if saved as GIF but anything substantially bigger than that will be way smaller if saved as 8 bit PNG. However, those only support 256 colors (as GIF does) while a 24 bit PNG supports millions of them and makes larger images way smaller than a GIF would be while preserving a way better quality.

DakotaChick
11-24-2007, 05:56 PM
The first point is not true and the second one really depends on the kind of image.

GIF does not support true alpha transparency, only index transparency (i.e. 100% or 0%, nothing in between).
GIF is smaller for images up to a certain dimension but it’s very marginal. Like when I export background images for a website an image of 5x5 pixels might be smaller if saved as GIF but anything substantially bigger than that will be way smaller if saved as 8 bit PNG. However, those only support 256 colors (as GIF does) while a 24 bit PNG supports millions of them and makes larger images way smaller than a GIF would be while preserving a way better quality.


I use fireworks for graphics and thus far the only way ive been able to get a truly transparent background cross-browser was through gifs. When I try to use PNG's they end up with a light blue background on IE, and given that almost all of my clients use IE, they are very unhappy when they see that nasty light blue background. So if you know a way to get rid of that I'd love to know it. For now, gifs are the only way I've been able to achieve it....

VIPStephan
11-24-2007, 06:13 PM
If you save 8 bit PNGs (with alpha transparency – which is what makes it different from GIF) IE doesn’t show a blue background. Rather, it does show the semi-transparent pixels as completely transparent. That's basically kinda like a GIF then and not what it should do either but it could save some headache when it’s not that important to have alpha transparency.

I’d like to see you getting a drop shadow that allows different backgrounds to shine through with a GIF image. To get true alpha transparency in IE 6 you can search the web and find numerous solutions. My latest development with transparent PNGs, and one of the most challenging sites I had, is this website (http://www.touch-stone.de/de/). If you study the source code you’ll notice an alternative stylesheet for IE 6 (http://www.touch-stone.de/cms/css/styles_ie.css) with a lot of weird long rules in it.

Search the web for “IE PNG transparency” and you’ll find ways to get alpha transparency in all browsers.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum