PNG, GIF, and JPEG The PNG image has been widely overlooked by the web design community—and mostly for good reason. Until recently, it hasn’t been possible to take full advantage of the format and have it work reliably in all browsers. But, with proper PNG support in Internet Explorer 7, and some handy JavaScript and CSS tricks to account for older browsers, we can use PNG images to greatly enhance our design vocabulary. What is PNG? What if I wanted to place my personal logo on all of my photographs? Yes, it’s possible to open each image in Photoshop, apply the logo, and resave the image. However, this becomes terribly impractical when dealing with thousands of images that are frequently updated—and sometimes updated when I’m nowhere near a computer (for example, when I send photos to Flickr via my cell phone). Wouldn’t it be nice if the logo were added automatically? PNG can help do just that. PNG, usually pronounced “ping,” stands for Portable Network Graphics. It is a losslessly compressed bitmap image format. In plain English, it’s a way of saving graphic images that reduces file size without reducing image quality. It was originally created as a replacement for the ubiquitous GIF format, which used to require a patent license for producers of imaging software to use it legally (the GIF/LZW patent has since expired, so this is no longer a factor). PNG is also an International Standard (ISO IEC 15948:2003) and an official W3C recommendation.