 |
Creating
Images for the Web |
Introduction
File_size
Colors
| Format | The two most common graphics formats on the Web are GIF and JPEG. GIF is CompuServe's Graphic Interchange Format for compressing images, and it's pronounced in two ways: "jif" as in the peanut butter. GIFs are the most common graphics files found on the Web, partially because they were there first. JPEG (pronounced "JAY-peg") stands for Joint Photographic Experts Group, the committee that established the standard. Technically, JPEG is the algorithm used to compress images while JFIF is the file format, but most people refer to the files themselves as JPEGs. The most up-to-date browsers support both JPEG and GIF images, but some older browsers support only GIF. |
| When should you use GIF images? | GIF is a good format for
images with solid flat colors and those that have
sharp and distinct edges, such as text and line
art. If you want control over each individual
pixel, GIF allows that; JPEG does not. If you
don't want your images to dither at all, you can
achieve this with GIFs, but you have no control
over dithering with JPEGs. (Dithering is a
technique for making an image appear to have more
colors in its palette than it actually does; the
colors of nearby pixels are changed to make the
eye see them as a third color. A side effect of
this is that the graphics have a grainier,
speckled look.) GIFs can also be transparent, which means you can create nonrectangular shapes over a background pattern. However, the GIF color palette includes no more than 256 colors, so if you need more colors you should use JPEG. Since some older browsers support only GIF for viewing graphics, you should use this format if you think that a significant number of your visitors are using browsers that are over a year old. Interlaced GIFs load as blurry images at first, then progressively become more detailed. (Ordinary GIF image information is stored one pixel row at a time, starting at the top; interlaced GIF info also starts at the top but skips several rows at a time and then goes back to fill them in.) Using these types of GIFs can make waiting for large images to load a little more bearable. It's also nicer for slower Net connection speeds, because visitors see something while they're waiting. |
| When should you use JPEG images? | JPEG is usually a better file format to use for photographs--especially photos of people--and for images with subtle gradations. For photos, JPEGs will look better than GIFs and will compress to a smaller file size. JPEG compression is "lossy," meaning it entails some degradation of image quality, especially when the graphics are highly compressed. And unlike GIFs, JPEGs cannot be transparent. JPEGs use 24-bit color, which looks better on monitors that support thousands or millions of colors, but the images will dither on monitors with only 8-bit color. |
| Don't flip-flop between formats | No matter which format you choose, don't turn GIF files into JPEGs, or vice versa. The files won't be as compressed, and the images will become nasty-looking monstrosities laden with digital artifacts or distortions. |
Web Images |
Contact Nancy Perrin, or John Rueter. PSU's FIPSE Project coordinated by Nancy Perrin and John Rueter, © 1997. Page constructed by Chris Miller. Last updated on June 22, 1998. For more see the About Page.