GIF vs. PNG
Wednesday, February 6th, 2008I recently ran a small test on image compression of GIFs and PNGs and I thought it might be worth sharing. For the test, I created images at different sizes with 100% transparency. The sizes I used were 4×4, 256×256, 384×384 and 512×512.
I saved each image in a different format.
- PNG - 8bit, saved using Photoshop CS3’s ‘Save for web’
- GIF - saved using Photoshop CS3’s ‘Save for web’
- PNG (OptiPNG) - 8bit, run through PNGpong
If you’ve never heard of PNGpong, it’s a great little tool for OSX. It strips out color space information from the PNG and then runs it through OptiPNG which further removes extra information.
The test confirmed much of what I’ve read. The PNG format contains a larger file header, causing GIFs to actually compress better at small sizes. At around 220×220, the better PNG compression makes up for its larger header and surpasses the GIF. Keep in mind that this tested a very basic image (possibly the most basic?). If images with more information in them are used, the compression of a PNG will surpass a GIF much sooner. The compressions of both formats are heavily dependent on the actual information in the image.
It should also be noted that it’s not always the best idea to run your PNGs through optimization tools such as PNGpong. In certain cases, such as with photographs, it’s often a good idea to allow the image to use a higher range color space, rather than the web’s lowest common denominator, sRGB.