296 Chapter 16 – PNG Format
Special Features
Web Design in a Nutshell, eMatter Edition
on the user’s end to make appropriate gamma compensations. When this is imple-
mented on both the creator and end-user’s side, the PNG will retain its intended
brightness and color intensity.
Transparency
Both 24-bit and 8-bit indexed color PNGs can have variable levels of transpar-
ency. This sophisticated transparency function allows for smooth transitions
between foreground and background elements. Grayscale images can also have
variable transparency.
As of this writing, the only common tools that allow you to create transparency
information in PNGs are Adobe Photoshop (4.0 and higher), Adobe ImageReady,
Macromedia Fireworks, the GIMP (an image editing tool for Unix, Linux, and OS/
2), and PaintShop Pro (4.0 and higher). Photoshop currently only supports 24-bit
transparency, which results in unacceptably large files. ImageReady and Fireworks
both support the more complicated 8-bit, palette-based transparency.
Transparency techniques are discussed in the “Creating PNG Graphics” section of
this chapter.
Bear in mind that even if you manage to make a PNG file with transparency, it
may be a challenge finding a browser to display it. Full alpha-channel transpar-
ency is currently supported in browsers only with the help of the PNG Live 2.0
plug-in (PC-only); however, full support is promised for the near future.
Alpha channel
In addition to the standard channels for RGB color values for truecolor images,
PNGs may contain an additional alpha channel used for transparency information.
Each pixel is then defined by its RGBA values. For 24-bit images, the alpha
channel can contain up to 8 bits of information for 256 levels of transparency for
every pixel in the image (a great improvement over GIFs, which have two trans-
parency levels: transparent or not transparent). Keep in mind, however, that an
RGB PNG file with alpha channels will be about 20% larger than one without.
48-bit PNGs may contain an alpha-channel with 16 bits of information—that’s over
65,000 levels of transparency! 24-bit images, however, are far more prevalent and
are adequate for most purposes.
In practical terms, this means you can create glows and soft drop shadows that
allow background patterns and underlying images to show through in a realistic
manner. Figure 16-1 illustrates the effect of graphics showing through areas with
variable levels of transparency.
8-bit transparency
Indexed color PNGs can also contain variable levels of transparency (up to 256
levels); however, this information is not handled in a distinct alpha channel as for
24-bit images. Instead, transparency information for each color occupies positions
in the color table. So, if you have a red area that fades out using eight levels of
transparency, that red would be present in eight slots in the color table, each with
its own transparency setting. Other than adding to the number of pixel colors in