Chapter 31. PNG Format

The Portable Network Graphic format (PNG for short—pronounced “ping”) is a versatile and full-featured graphics file format. Despite some attractive features and the fact that it was created with web use specifically in mind, the PNG has been slow to catch on in the web development world. This is due in part to initial poor browser support and the lack of tools capable of making PNG files as small as they ought to be. But all that is changing, and PNG is poised to live up to its full potential.

PNGs offer an impressive lineup of features:

  • They can store 24- or 48-bit color, 16-bit grayscale, or 8-bit indexed color images.

  • They use a lossless compression scheme that offers better compression than GIF for indexed color images and no cumulative degradation like JPEG.

  • They offer 8- or 16-bit alpha-channel transparency information, which means pixels can have 256 or up to 65,000 shades of transparency. They also offer binary (on/off) transparency like GIFs.

  • They may use progressive display (similar to, yet more sophisticated than GIF interlacing).

  • They may contain gamma adjustment and color correction information.

  • They may contain embedded text for information like author, copyright, and so on.

This chapter introduces these impressive features and provides basic guidelines for creating and optimizing PNG graphics.

Get Web Design in a Nutshell, 3rd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.