PNG optimization strategies - Web Designing

The following are a few strategies for keeping PNG file size small and for using PNGs wisely.

  • Use 8-bit (or smaller) PNGs. Index color PNGs will always be smaller than their 24-bit RGB counterparts.
  • Use JPEGs instead of RGB (24-bit) PNGs. Photographic images are best saved in JPEG format for use online. The resulting file sizes are smaller (with only minimal image quality loss) and more appropriate for web delivery.
  • Use GIF optimization techniques. 8-bit PNGs benefit from all the same tactics used to minimize GIFs, including limiting dithering and reducing the number of colors and bit-depth.
  • Avoid interlacing. Interlacing always adds to the size of a PNG. It is usually unnecessary anyway for small graphics or any graphic accessed via a highband width connection or locally (as from disk or CD-ROM).
  • Use maximum compression (if available) for final images. If your image tool offers control over compression, use level 9 (or "max" or "slowest") for the final version of your image. Use lower compression (3 or 6) for intermediate saves. Many commercial programs (such as Fireworks) handle compression and filter application internally, so you may not have control over specific levels.)
  • Create PNGs from GIFs. Depending on the tool you're using, you may be able to squeeze extra bytes out of a PNG by creating it from a GIF (which is already in indexed color format) instead of from an RGB source. If your tool offers only a "Save as" function, this ensures that you will end up with an 8-bit PNG. If you are starting with an RGB image, first save it as a GIF, then open it again and save it as a PNG. This method is unnecessary for more sophisticated web graphics tools such as Fireworks and Photoshop/ImageReady (but Fireworks did reduce the "sweetpea" sample image by 140 bytes when re-exported from a GIF).
  • Try the pngcrush utility. If you are serious about optimizing PNGs, you should download Glenn Randers-Pehrson's pngcrush application. It is a command-line DOS application, but it can run in batch mode. pngcrush takes existing PNGs and makes them smaller, losslessly.
  • Convert transparency with the pngquant utility. The pngquant
    command-line utility (written by Greg Roelofs, one of the creators of the PNG format) converts RGB alpha-channel transparency (32-bit) into 8-bit palette transparency. The resulting PNG will be significantly smaller and more suitable for web use.

All rights reserved © 2020 Wisdom IT Services India Pvt. Ltd Protection Status

Web Designing Topics