PNGCrusher: Make Your Web Graphics Smaller

Rereading some of the comments here, I just wanted to add the following: Yes, many programs allow the user to set compression levels on PNGs. The problem is that there often exists a way to improve the compression beyond whatever quick first-pass attempt these apps make. Of course this will usually only save a few percent of the file size, but for certain uses (such as bandwidth-intensive applications, like web design) it can be worth your time to pursue such savings. Again, I can't speak to Photoshop's compression, but output from Preview.app and The Gimp are most certainly NOT optimized, and frankly I'd be surprised if Photoshop's is either. If you'd like to make sure, run a file through PNGCrusher while Console.app is open, and you can see OptiPNG's output. A note to the original blogger (Damien): Your test case was not typical. In general you will only reduce file sizes by about 10%; clearly in your case there was a large resource fork that was removed in the process of optimizing.

Hello. I'm the author of PNGCrusher. First of all, just a small correction: The app is not AppleScript, it's a bash script wrapped with Platypus. And for all those people saying it's useless: Not everyone has Photoshop, and I can say from personal experience that The Gimp, even with highest compression settings, doesn't produce optimal output. I can typically save at least a few KB by running Gimp's output through OptiPNG. I don't know about Photoshop since I don't have it.

I've been trying to use PNG files for a while until I found that the colours were being shifted. For example, I created a blank html file with a place in the middle for my image. I used the same hex value for my html file as I did for my background colour in photoshop. I then saved the 100x100 image as a PNG and then saved another time as a GIF. When I pulled the png into the html file, the colour of the PNG didn't match the colour of my html's background but the GIF image did, even though they were created with the same hex value.

Mischa is entirely correct. I always create two classes when using PNG files in CSS. One has the PNG marked !important , and the other has the same image as a JPG without any importance classification. That way, browsers will try to load the PNG first, and if unsuccessful, will load the JPG instead. It's a simple trick that yields results that (almost) everyone can be happy with. And IE users will look at the same site in other browsers and say, "Hey this looks much better in this other browser that isn't IE, I should switch and make every standards-based web developer's life much easier!"

This application i hate to say it is pretty silly, if you work in web development, or if you even build any sort of webpage, i'm guessing you'll have access to a graphic editor, Photoshop, or the gimp, or one of the many other cheap/free ones. being able to select compression levels of any format is very standard in these applications, and as such i don't understand the need for this. Also, PNG24's 8bit alpha channel will not work in MSIE, even after applying the pngfix javascript hack, as if the user uses a higher res display (found in some laptops), the alpha 8bit alpha will look terrible.

Martin, just an FYI: PNG-24 is lossless, but PNG-8 is essentially an improved GIF -- it has the same user-selectable options for bit-depth and palette reduction as GIF. Your point about Brian's "detectable" comment is absolutely correct, of course, but I wanted to point out that saying "PNG is a lossless format" is not quite right. I'm wondering if Eric J was inadvertently using PNG-8; if so, that could explain the puzzling file-size difference.

I noticed that PS was doing a crappy job of saving PNGs a few months back while working on a Dashboard widget. I found that opening the PNGs in Preview and re-exporting them significantly dropped the file sizes. I have not noticed any artifacts from doing this. I think Preview (PDFKit?) has a mighty decent compressor already there for Mac users.

I also love the PNG alpha channel support. Of cause, it needs a Javascript hack to work in Internet Explorer... Comment #4 looks kind of bogus to me. Photoshop saves the PNG 10k smaller than the OptiPNG optimizer? Care to provide a URL to the image you used? "There is very little human-eye detectable difference between the two." Now this is something that makes you go "WHAT"? PNG is a lossless format. OptiPNG makes only lossless optimizations. So there should not be ANY differences between the two images, pixelwise.

What about someone who does not have Photoshop? Is GraphicConverter as good at making small-sized PNG files? Also, with Tiger the default screenshot format is PNG, right? Couldn't a person who does not have any graphic software could use a combination of Preview and PNGCrusher to resize their PNG files.

I ran the same test as Bryan with my own file. Photoshop Save As: 170k Photoshop Save For Web: 60k PNGCrusher: 70k