Design Basics: GIF, JPG, PNG

There are three image types that are considered “web native” – which means that they can be displayed by a web browser: GIF, JPG and PNG. What are they and why would you pick one format over another?

GIF : Graphics Interchange Format
CompuServe introduced this bitmap image format in 1987. It is a compressed (lossless) 8-bit format, which means that it can support only 256 colors. It is possible to make the “background” of a GIF transparent, which means the image will float (not appear to be a square) on a page. GIFs can also be animated images. GIFs are best for flat color and line drawings such as found in logos and navigation icons. More from Wikipedia.

JPEG/JPG: Joint Photographic Experts Group
The Joint Photographic Experts Group developed the JPEG, a 16-bit compressed (lossy) format, in 1992 — in part because GIFs are unsuitable for continuous tone images like photographs. There are varying levels of compression; the more compressed an image, the smaller the file size. However, compression means throwing away information, so image quality deteriorates with file size reduction. More from Wikipedia.

PNG: Portable Graphics Format
The PNG is an example of supervening social necessity (for my COM546 students). In 1995 Unisys, the company Compuserve hired to create the GIF format, threatened to enforce their patent on the compression technology. PNG-8 is similar to GIF (8-bits, 256 colors). PNG-24 has 24-bit color support, but unlike JPGs, the format is lossless; thus, files tend to be larger. More from Wikipedia.