One of the most common questions about images for the Web concerns when to use the GIF or PNG image formats, and when to use JPEG. The simple answer is use JPEGs for photos and other images with millions of colors, use PNG for everything else.
| Format | Best Use |
|---|---|
| GIF (Extension is .gif) |
For line art (such as one- or two-color logos), simple drawings, animations, and basically any image that has no gradients or blends. GIF is also the best format when you want to display an image with a transparent background. |
| PNG (Extension is .png) |
PNG generally produces better-looking images with smaller file sizes than GIF for the same kinds of limited-color images. Really old browsers, such as IE 3, don’t support the PNG format, but most Web designers now choose this format over GIF because so few people use such old browser. Browsers as recent as IE6 don’t display transparent PNG files properly, which is unfortunate because PNG files tend to handle transparency better. |
| JPEG (Extension may be .jpg or .jpeg) |
JPEG is the best format for colorful, complex images (such as photographs); images containing gradients or color blends; and any other images with millions of colors. |
Creating and Optimizing images with Adobe Photoshop Save for Web