10 Replies Latest reply: Aug 4, 2015 5:27 AM by Marcus Turtle RSS

    CS5 export to transparent png - not working

    ellebelle98 Community Member

      I have tried every think I know to get a png optimized transparently though fireworks cs5. I have read prior forum post, and watched several tutorials indicating ways to do this and when i try they do not work.

       

      I created the image in photoshop and exported it to a png file. Then i opened it in fireworks in an attempt to make the png much smaller. The image will be overlaying a patterned background on the web so needs to be totallly transparent. I've tried every combination of export option and still, when I put the image in my site there is a white background.

       

      Ive tried png-8  with alpha transparency and changed the matte to nothing. The main window in fireworks never gets rid of the white background and when i export it's still white on my site.

       

      I've tried png-32 with both alpha and index.

       

      When i use the png exported from photoshop on my site it looks exactly how I want it, but the file size it too large so that's why Im putting it in fireworks  but when i export it from there it's not transparent.

       

       

      help!!  - Kim

        • 1. Re: CS5 export to transparent png - not working
          Linda Nicholls Community Member

          Instead of exporting it as a flattened PNG file from Photoshop, save it as a PSD and open the PSD in Fireworks. Discard the white background that Photoshop adds, and then export from Fireworks as a PNG file with Alpha transparency. Alternatively, create the image in Fireworks instead of Photoshop.

          • 2. Re: CS5 export to transparent png - not working
            smartwebby Community Member

            Hi Kim,

             

            Are you able to set and see the transparent background of your Image in Fireworks? If yes then its just an export setting you need to deal with. Check out my tutorial on using transparency in Fireworks at: http://www.smartwebby.com/free_tutorials/website-design-how-to/transparent-background.asp

             

            - Anita

            • 3. Re: CS5 export to transparent png - not working
              pixlor Community Member

              Can you post your image? It would be easier to suggest something if we could see what you have.

              • 4. Re: CS5 export to transparent png - not working
                AsChi75 Community Member

                I am convinced there is something wrong with fireworks... I've been trying to do this all morning. I managed to do it 1 time with a file... I have not been able to do it since.

                 

                I've tried png 8, png 32, I know how to switch to preview mode / optimized mode and preview the transparency, it's there, it shows up. However when I save off the flattened png and I put it in my HTML, it's gone.

                 

                This is nuts, I've used the same steps, I've tried the same process over and over again and randomly it works but more often than not, it doesn't. After spending about 40-50 hours on a design in fireworks witch custom styles and libraries, I now have to recreate all this work in photoshop because photoshop at least is consistent and doesn't make me want to throw a temper tantrum because it does what it is supposed to do.

                 

                Adobe just needs to kill off fireworks if they are not going to fix this issue, I've seen it as far back as cs4 and it's still there in cs6...

                • 5. Re: CS5 export to transparent png - not working
                  Mr Martineau Community Member

                  I think that you need to set the Canvas background to be transparent before you export. Have a look at the Properties panel.

                  • 6. Re: CS5 export to transparent png - not working
                    cem di Community Member

                    AsChi75, i am having the exact same problem. exactly how you described it. i am trying to get website exports, round edges, transparent bg, etc... i have tried all flattened png possibilities, every time i got my .png file with a white bg.

                    have you found any solution to this since 2012? ))

                    • 7. Re: CS5 export to transparent png - not working
                      Herbert2001 Community Member

                      Have tried this?

                       

                      Modify > Canvas > Canvas color > Transparent

                      • 8. Re: CS5 export to transparent png - not working
                        cem di Community Member

                        of course i did... r u kidding me?
                        i m trying to save with alpha channel, of course canvas is transparent..
                        i can save fw-png format with alpha channel. however when i make flat png, background color is being added at saving process.

                        r u sure that u really understand my question and my problem?

                        because there is an unsolved issue here started at Nov 4, 2011 9:14 PM and the solution u suggest has already been suggested 3 years ago...

                         

                        besides i found a solution as: just save as fw-png and import to photoshop and web-save the doc as png..

                        • 9. Re: CS5 export to transparent png - not working
                          Herbert2001 Community Member

                          Sorry, i was not certain about your level...

                           

                          You may be interested in knowing that another tool optimizes png files beyond what Fireworks can do - and I would avoid Photoshop's abysmal png export for production. As you are probably aware of, Photoshop's web export does not allow us to save an indexed png file with full transparency - something FW was always good at.

                           

                          Try Color Quantizer: http://x128.ho.ua/color-quantizer.html

                           

                          It allows for png files with full transparency to be saved with limited colour palettes exceeding 256 colours!  With CQ you can optimize png files to the fullest, while still retaining an excellent visual quality, since you can optimize easily to a limited palette of, for example, 512 or 1024 (or a custom number of colours). Extremely useful.

                           

                          It also optimizes the transparent areas, and will automatically remove any bitmap data from those areas (which are not visible).

                           

                          And, even better, a simple quality mask brush tool assures you have maximum control over the inclusion of even tiny splotches of colour you wish to retain.

                           

                          I have long left FW behind for my png optimization, because of CQ. It's brilliant, and still somewhat of a hidden gem. Try it out, you might be pleasantly surprised. And it's a free download.

                          • 10. Re: CS5 export to transparent png - not working
                            Marcus Turtle Community Member

                            I'm late to the party, but in case anyone has this issue again, I made a youtube video of how to fix it.

                             

                            Basically, just go to export wizard, change saved settings to PNG32 - and it starts saving them like it should.