Graphic File Types for Use on the Web

JPEG

Best suited for photographs or images with a gradient. Images can be highly compressed, but you will lose image quality since this is a lossy format. Do not edit and save the same jpeg multiple times; always keep the original image in a lossless format such as Photoshop PSD, PNG, or TIFF.

GIF

Pretty much a crappy format, its best use is for short animation. The transparency is either 100% opaque or 100% transparent. For an illustration of GIF’s limitation on transparency, see PNG vs. GIF.

PNG

Awesome for web graphics (that are not a photograph). PNG can do alpha transparency.

Summary of Features

Format Transparency Compression Type Best Suited for
JPEG None Lossy Photographs or gradients
GIF Yes Lossless Very short animation
PNG Alpha transparency Lossless Solid blocks of color, web graphics such as buttons and icons