Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    Regular Coder RexxCrow's Avatar
    Join Date
    Jul 2006
    Location
    California
    Posts
    275
    Thanks
    6
    Thanked 2 Times in 2 Posts

    How to save a PNG file as a JPEG with a transparent background using Adobes suite.

    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

  • #2
    New Coder
    Join Date
    Oct 2007
    Posts
    84
    Thanks
    0
    Thanked 8 Times in 8 Posts
    What program are you using? Is the background transparent in the file?

  • #3
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,780
    Thanks
    6
    Thanked 1,022 Times in 995 Posts
    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.

  • #4
    Senior Coder
    Join Date
    Apr 2007
    Location
    Quakertown PA USA
    Posts
    1,028
    Thanks
    1
    Thanked 125 Times in 123 Posts
    You cannot save it as a JPEG and maintain the transparency. JPEG's do not support transparency. Your best bet is as VIPStephan suggests
    John

  • #5
    Regular Coder RexxCrow's Avatar
    Join Date
    Jul 2006
    Location
    California
    Posts
    275
    Thanks
    6
    Thanked 2 Times in 2 Posts
    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.

  • #6
    Regular Coder
    Join Date
    Mar 2006
    Location
    Sumter, SC
    Posts
    178
    Thanks
    10
    Thanked 4 Times in 4 Posts
    Gif's also support alpha transparency and the file sizes are smaller than the PNG's.

  • #7
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,780
    Thanks
    6
    Thanked 1,022 Times in 995 Posts
    Quote Originally Posted by DakotaChick View Post
    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.
    1. GIF does not support true alpha transparency, only index transparency (i.e. 100% or 0%, nothing in between).
    2. 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.

  • #8
    Regular Coder
    Join Date
    Mar 2006
    Location
    Sumter, SC
    Posts
    178
    Thanks
    10
    Thanked 4 Times in 4 Posts
    Quote Originally Posted by VIPStephan View Post
    The first point is not true and the second one really depends on the kind of image.
    1. GIF does not support true alpha transparency, only index transparency (i.e. 100% or 0%, nothing in between).
    2. 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....

  • #9
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,780
    Thanks
    6
    Thanked 1,022 Times in 995 Posts
    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. If you study the source code you’ll notice an alternative stylesheet for IE 6 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.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •