ptg16476052238 LESSON 9: Using Images on Your Web Pages
Workshop
Now that you know how to add images and color to your pages, you can really get cre-
ative. This workshop will help you remember some of the most important points about
using images on your pages.Q&A
Q What are the differences between GIF, PNG, and JPEG images? Is there any
rule of thumb that defines when you should use one format rather than the
other?
A JPEG images are best for photographic-quality or high-resolution 3D rendered
graphics because they can display true-color images to great effect. Most image-
editing programs enable you to specify how much to compress a JPEG image. The
size of the file decreases the more an image is compressed; however, compression
can also deteriorate the quality and appearance of the image if you go overboard.
You have to find just the right balance between quality and file size, and that can
differ from image to image.
As a rule, you should use PNG (or GIF) for all images that are not photographs.
They both offer good compression, but PNG offers a number of advantages over
GIF, including support for palettes of more than 256 colors, and alpha-based trans-
parency. There’s no reason to convert existing GIFs to PNG, but if you are creating
new images, PNG is almost always the better choice.
The one unique feature offered by GIFs is simple animation. Many sites are using
animated GIFs rather than video for some things these days because you don’t need
to worry about browser support, plug-ins, or any of the overhead associated with
web video if you just want to present an animated image.
Q My client-side imagemaps aren’t working. What’s wrong?
A Make sure that the pathnames or URLs in your <area> tags point to real files. Also,
make sure the map name in the <map> file matches the name of the map in the
usemap attribute in the <img> tag. Only the latter should have a pound sign in front
of it.
Q How can I create thumbnails of my images so that I can link them to larger
external images?
A You’ll have to do that with some type of image-editing program (such as Adobe
Photoshop); the Web won’t do it for you. Just open up the image and scale it down
to the right size.