Portable Network Graphics - PNG
The PNG compression algorithm is one of the best that can be found. Unlike standard JPEG images, PNG compression involves no loss of image data, so there is no smudging or blurring. In some cases, filtering can compress the image data even more. Each horizontal line in an image can have one of five filter types associated with it. Whether specifying a filter helps in a particular case depends on the image content. In most cases the default setting is best ( adaptive filtering ).
PNG color depth
True color 24 bit images are one of fifteen color options in PNG format. Images can be created using color palettes or 8 bit grayscale. Pixel data with 8 bit values can index into palettes containing up to 256 colors, and with fewer colors pixel values can be 1, 2 or 4 bits. For specialist requirements PNG also offers 48 bit true color and 16 bit grayscale.
PNG format offers binary transparency equivalent to GIF transparency. It also has a more impressive option -- variable transparency, which is referred to as "alpha transparency", "alpha-channel transparency", or simply the "mask channel". Between all-or-none it allows 254 levels of partial transparency.
Nearly all the latest browsers support PNG's variable transparency, including WebTV and Microsoft Internet Explorer for Macs. Pre-IE7 versions of Internet Explorer are the exception, but background colors ( transparent in other browsers ) can be selected and added to alpha images. However, IE6 for Windows does support PNG's single-color transparency. The image below shows some examples:
PNG interlaced images
Interlaced GIF images display their data in 4 passes, each one filling in more detail from top to bottom. The first pass begins after 1/8 of the image has downloaded. PNG uses a more sophisticated scheme which begins rendering the image after only 1/64 of the data has arrived. PNG's 7 pass scheme, devised by Adam Costello, fills in increasing amounts of detail both horizontally and vertically. Interlacing increases the file size. You may find that with PNG's better compression fewer images will need interlacing. For exceptionally large image files thumbnail preview images are another option.
PNG format allows all kinds of extra information to be stored inside image files. The two most potentially helpful features for web images are gamma correction and embedded text.
Gamma correction is the ability to correct for differences in how computer systems interpret color values. Macintosh-generated images tend to look too dark on PCs, and PC-generated images tend to look too light on Macs. PNG format allows the gamma value of the computer which created an image to be embedded into the image file. Browsers and image software which support the feature can extract the gamma value and make a correction if the host computer uses a different gamma setting. Warning: There are some applications which don't implement it correctly. Don't rely on gamma correction to match image colors to HTML/CSS colors.
The text feature makes it possible to add any text annotations you like -- a description of the image, the date of creation, copyright information, etc. Very few image editors offer this option, but the TweakPNG utility allows you to add text after the image has been created. It can also set the background color of a PNG alpha image. The default background color is gray in pre-IE7 versions of Internet Explorer for Windows.
PNG - the background story
In the late 1980's CompuServe introduced a new image format which became popular with internet users - Graphic Interchange Format, or GIF. It used a long-established compression algorithm, LZW, without realizing that LZW was subject to a patent filed by the Sperry corporation, which was later taken over by Unisys.
In late 1994 Unisys dropped a bombshell by announcing that the company would start demanding royalties from all developers of GIF-supporting software. The announcement caused consternation among the internet community and ideas were passed around for a non-proprietary replacement. An informal internet working group was established by Thomas Boutell to devise an image format which would be even better than GIF. In October 1996, the World Wide Web Consortium adopted the new specification, Portable Network Graphics, as a recommended image format.
The LZW patent in the United States expired in June 2003, and up to a year later in other countries. More information about patent controversies can be found at:
A comprehensive source of information about Portable Network Graphics format is maintained by one of the original members of the PNG working group, Greg Roelofs:
He is also the author of "PNG: The Definitive Guide". An online version is available at the site. Greg kindly provided examples of minimum-size PNG files to compare with the output of image converters reviewed on this site:
By late 2003 the number of internet users with browsers dating back to 1997 or earlier was negligible. They would see image placeholders instead of the images.
Portable Network Graphics format was originally devised at a time when there was no browser support for GIF animation, so animation was not included in the specification. Later, a separate animation format was devised with a whole host of advanced features - Multiple-image Network Graphics, or MNG. As it turned out, however, the arrival of other animation technologies such as Macromedia Flash took attention away from MNG format. More information about MNG can be found at the PNG Home Site.
The lack of sophistication in GIF animation can be annoying to users. Research into user reactions has shown that some users cover animations with one hand as they read the text on a page. Here's a tip: GIF animations can be frozen by pressing the ESC key in Internet Explorer or Firefox.
Choosing an image format
The official PNG specification
A complete list of features can be found in the official PNG specification at the World Wide Web Consortium's website: