To make dirty transparency easier, I created a Photoshop Action that you can use to run on your PNGs.  Make sure to run it on single-layer PNGs that have already been saved off via Photoshop’s Save for Web.  Don’t try to run it on your multi-layer PSD file as the script is looking for a layer called “Layer 0″.

Download: Dirty Transparency Photoshop Action (1KB)

I also like his usage of posterization as a way of reducing colors.  At Ask.com, I developed a similar technique except using Photoshop’s color-indexing algorithms (perceptual, adaptive, etc) which I think offers the compressibility of posterization but does a better job at maintaining smoother gradients/detail.   Posterization’s diffusion characteristics are a little rough for my taste.  One of these days, I’ll post a tutorial on how we do this technique, which isn’t terribly innovative imho, but I haven’t seen anyone talking about it so it’ll be worth writing up at some point.

Meanwhile, be sure to check out punypng, as simply the best way to optimize your PNGs on the net.

Try out punypng (as a short url: http://www.punypng.com works as well)

How punypng came about

punypng actually started not as a need at Gracepoint Fellowship Church, but rather at my day job.  At the Ask.com User Experience Team, we believe down to our toes that design is about craftsmanship.  Our designers are obsessive about detail, and though few notice, everything is “pixel-pushed” — no stray pixels, no unnecessary colors.  A big part of search is fast page load times.  Every search experience team (Google, Yahoo, etc) knows that the faster the page loads, the more loyal your users will be over time (if you don’t by now, well, now you know).  The Ask.com team previously relied on Yahoo’s smush.it service (no shame, Yahoo dev tools are great and a huge asset to everyone), which was very impressive, but for our day-to-day work, we wanted something that was made for designers by designers.  So after a few sleepless nights thinking how I can make my PNGs smaller, I decided to start on the punypng project.  Fast forward a month later, punypng is now the bread and butter tool among the Ask.com UX designers (and the Gracepoint designers as well)

The specialness of punypng

I don’t claim that punypng is for everyone.  I wanted a tool made for designers, and so I also left out a lot features (for now) such as an API or fetching images via URLs (I assume all original assets are on your hard drive not on some website).  But though lacking in these small ways, it does boast some great features:

• Fully supports for PNG, .GIF, .JPG
• Clear affordances for # of bytes saved (as well as being pretty bar graphs)
• JPEG Compression — punypng doesn’t leave JPEGs out in the cold.  JPEGs are analyzed to see if a compressed PNG format is better (ex: JPEGs with heavy solid areas benefit from this).  But if not, don’t despair, punypng is backed with jpeg-tran and jpegoptim for further JPEG optimzation.
• “Fire-and-forget” batch processing: You can upload up to 50 files in a single session.  Optimized versions are clearly labeled, and if no further optimization can be made to the uploaded file, you get the original back untouched.  After you upload a batch, you can go ahead and upload another batch without having to reload the page.
• Download batch jobs as a single time-stamped ZIP.
• See the changelog for future updates

The future

I don’t know what the future holds in store for punypng.  Please let me know if there’s some enhancement or new feature that would help your day to day work.  punypng has relentless commitment to making every png as small as possible, so barring enormous CPU requirements, let us know if there’s some experimental binary out there that we can include. The great thing of an online tool vs a desktop tool is that we can constantly improve the performance and efficiency of the compression as new algorithms are made available.  Just today I found a way to squeeze out 3-5% more.

Help support punypng

Well, every Gracepoint After Five project is free to the world, and is our belief, that all the little tools we build will end up benefiting the church at large (as well as my team at Ask.com of course).  Running a CPU-intensive site like punypng isn’t cheap.  Please help support the cause.  If not, please help spread the word.  Our gratitude to you is non-puny.

Update on 10/12/09: PunyPNG supports IE6 using the dd_belatedpng plugin.