Image Formats

Digital images and photographs come in a wide variety of file types and formats – far too many, in fact, to explain all of them in one sitting, and each format has its own unique uses and advantages. While it is great that each particular application can have its own particular image format, on the Web, content needs to be easily and quickly viewed by thousands of people, all on different systems. To this end, Web images are generally restricted to just a few formats: GIF, JPEG, and PNG.

GIF

GIF (Graphics Interchange Format) is a format used for logos, line drawings, and simple images. GIF files are very small and fast, and do a good job of handling images with a lot of the same color. However, the price of the fast compression is that the total number of colors in an image is limited. This makes GIF files unsuitable for colorful photographs or complex gradients. However, GIF files do also support simple transparency and animation, which makes the format particularly useful for buttons and small icons.

JPEG

JPEG (or JPG), named after the Joint Photographic Experts Group, is the most popular image format on the Web today. While the files are somewhat larger than GIF, JPEG can support up to 16.7 million colors, while still remaining more efficient than PNG, making it ideal for photographs, gradients, or other large and colorful images. JPEG images vary in quality, intentionally, in cases to sacrifice some fidelity of images in exchange for speed.  JPEG does not handle sharp edges or large sections of the same color as elegantly as GIF, but increasing the quality (and file size) of a JPEG can alleviate those issues. JPEG also does not support animation or transparency.

PNG

PNG (Portable Network Graphics) is the newest current standard in Web images. PNG files are typically larger than both GIF and JPEG files, but are of higher quality and can support any number of colors. As Internet connection speeds are increasing, so is the popularity of PNG, as its methods of compression do not generally result in a visible loss of quality, as can be the case with JPEG compression. In addition, PNG supports complex transparency in modern browsers, and will also support animation in the future. However, old web browsers (Internet Explorer 6 and older), do not natively support PNG transparency, and even older browsers can experience difficulty with PNG in general.

WebP

There is another format for Web graphics, but it is not yet supported by any web browsers. WebP is a new standard being introduced by Google using new compression technologies in order to create higher-quality images with file sizes smaller than JPEG. The technology is exciting, and could potentially allow websites to display more graphical content simultaneously, but with the standard in its infancy, only time will tell.