PNG Optimization Techniques
Posted: Fri Jul 17, 2009 12:51 pmI know there's a few designers here. I'm not one as my degree was in IS, but I do some web design for things like WordPress and what not as a hobby. I found this article to be inspiring and useful:
http://www.smashingmagazine.com/2009/07 ... hniques/?1
Now, I will state that pngcrush sucks. Don't use it. OptiPNG works really well and can reduce ~160KiB PNGs to around ~125KiB especially if you're using PNG sprites. But, some of the techniques listed in that article are really quite fascinating. If you do any sort of design for online works, this might be worthwhile!
Edit: I'm a tard and clicked the wrong post button.
Edit edit: Trying the posterization technique along with using OptiPNG shrunk my avatar by about 20KiB from a hefty 46.86KiB to ~26.2KiB. Check this out:
http://www.smashingmagazine.com/2009/07 ... hniques/?1
Now, I will state that pngcrush sucks. Don't use it. OptiPNG works really well and can reduce ~160KiB PNGs to around ~125KiB especially if you're using PNG sprites. But, some of the techniques listed in that article are really quite fascinating. If you do any sort of design for online works, this might be worthwhile!
Edit: I'm a tard and clicked the wrong post button.
Edit edit: Trying the posterization technique along with using OptiPNG shrunk my avatar by about 20KiB from a hefty 46.86KiB to ~26.2KiB. Check this out:
- Code: Select all
[sagittarius:images]$ optipng thal_avatar.png
OptiPNG 0.6.2.1: Advanced PNG optimizer.
Copyright (C) 2001-2009 Cosmin Truta.
** Processing: thal_avatar.png
150x141 pixels, 4x8 bits/pixel, RGB+alpha
Reducing image to 3x8 bits/pixel, RGB
Input IDAT size = 37541 bytes
Input file size = 37754 bytes
Trying:
zc = 9 zm = 8 zs = 0 f = 0 IDAT size = 26742
Selecting parameters:
zc = 9 zm = 8 zs = 0 f = 0 IDAT size = 26742
Output IDAT size = 26742 bytes (10799 bytes decrease)
Output file size = 26907 bytes (10847 bytes = 28.73% decrease)