An eclectic collection of articles, case studies and opinion pieces ranging from the creative process to technical tips...

Blog

  • Screenshot of Fireworks' image export panel
    Screenshot of Fireworks' image export panel

The PNG image format has three types:

  1. PNG8
  2. PNG24
  3. PNG32

If you usually use Photoshop then at this point you may well be thinking "What's this PNG32 thing?". Well basically PNG32 is PNG24 but with support for full alpha transparency. This means you can have varying degrees of transparency for each pixel, whereas GIFs can only have transparency turned on or off for each pixel. Therefore, when placed on complex or ill-matching backgrounds, transparent PNGs will have nice smooth edges.

Yes I know what you're thinking, "But Photoshop can produce alpha transparent PNG images!". I know! It just doesn't present it to you correctly and that's what had me confused.

Image montage showing Adobe Fireworks image optimiser and Photoshop's Save for Web dialog side by side

Being a keen advocate of Adobe Fireworks I have always realised that PNG32 was the only PNG file type to support true colour alpha images. However, if you regualrly use Photoshop then you'll know that "Save for Web" only offers PNG8 or PNG24 file types in the drop down.

As I'm sure most of you know all you do is tick the "transparency" box in "Save for Web" and you get a alpha transparent PNG. But really what this is doing is creating a PNG32 graphic - Photoshop just decides to hide this from you. Strange...

Write a comment.

Comments

  1. Gravatar for

    Always wondered about this. 

  2. Gravatar for a

    a

    no, its the difference between index transparency and alpha transparency

  3. Gravatar for Roberto

    Roberto

    Adobe Fireworks is far better and focused than Photoshop if you only need to produce web graphics.

    I am still amazed that most web designers don't use it as first choice for web development.

    It's a mystery...

  4. Gravatar for Dom

    Dom

    Well I'd have to disagree about fireworks being better for web design. It may be easier to spit out slices but as far as layout, design, ease of use etc its leagues ahead. Thats why its more of an industry standard, its just better quality.

  5. Gravatar for Feeb

    Feeb

    For producing web layouts, mockups and vector imagery, Fireworks is much better than Photoshop. Bear in mind that's what it was made for.

    It's so much quicker, and a million times quicker to edit things and produce accurate, pixel-perfect layouts.

    However, if you want very complex raster imagery, then obviously you use PS for that.

  6. Gravatar for Trisha

    Trisha

    Good explanation.

    I did find today, though, the Fireworks saved the image with a smaller file size than the same image in Photoshop. Strange.

  7. Gravatar for Serg

    Serg

    Despite what other may think about using Fireworks, I can honestly say it does a much better job at image compression than Photoshop. I am a solid Photoshop user, but when creating graphics for the web, I'll often save JPEGs or PNGs for web in Photoshop, and then use a batch convert with Fireworks. There is no noticable difference in quality of the image, but the file size is roughly 30 percent smaller. WIN! PNG Gauntlet is another tool I use quite often if you're looking to add some further compression to PNGs. Whether you use either one for the creation of the image really depends on your workflow, image needs, and personal preference.