Tips
for taking your photos from your camera to the Web
If
you use a digital camera to take pictures for a Web page, there's
a few things you'll need to do with your images to prepare them
for the Web. At the very least the photos will need to be rotated,
cropped, and resized. In this article I'll show you how to perform
these common tasks using Adobe Photoshop, Corel Photo-Paint, Jasc
Paint Shop Pro, and Ulead PhotoImpact. I'll even teach you some
time-saving tricks for automating the work to let your software
do the repetitive parts for you!
"I cannot figure
out how to properly resize a large scanned image so it will fit entirely
inside a typical browser window. The image I scanned is 8x10 in Paint
Shop Pro and will print entirely on one page, but when viewed in MSIE
it will appear enormous." --
Fred
Before
I get into the specifics on how to perform these tasks, I'd
like to warn you about a potential problem. Most digital cameras
save your pictures in the JPEG
format. JPEG is known as a "lossy" format, because
the compression scheme causes the image to lose detail and clarity
each time the image is edited and saved. Here's
a few things you can do to combat this loss in quality:
If
possible, perform as many edits as possible in one session
so you're not saving to the JPEG format repeatedly.
When
resaving a JPEG, use the same compression setting that was
used for the inital save. With digital cameras, this is not
always possible, since the camera uses settings such as Basic,
Normal, and High instead of numerical settings. If the numerical
equivalent for the quality settings are available in your
camera's user manual, keep these numeric values handy so you
can refer to them when you need to resave the JPEG images.
You'll still have some loss in quality even when you use the
same compression settings, however, it will result in less
damage than if you were to use different settings with each
save.
The
best solution is to convert your images to a lossless format
as soon as you download them from your camera. Leave the images
in the lossless format through the editing process and only
convert to JPEG as the last step before putting the images
on the Web (again, use the same compression settings as the
initial save, if at all possible). It's a good idea to archive
your images in a lossless format since you never know if you'll
need to edit the images for another purpose in the future.
The most common lossless image formats to use are Bitmap (BMP),
TIFF, and PNG. Bitmap is a uncompressed format so the images
will be quite large. TIFF and PNG will result in smaller file
sizes, although not as small as JPEG format. Obviously, the
down side to this solution is the additional storage space
required as a result of the larger file sizes.
On
the following pages I will show you how to rotate, crop, resize,
and batch process your images. Click a link below to learn how
to perform these tasks in your favorite software program:
Resizing
via HTML Learn why not to resize images in the browser with
HTML tags.
Correction
Rotating, cropping and resizing your images is the bare minimum of steps
you should take to prepare your images for the Web. In addition, your images
may need color correction and other touch-ups. Resizing your images always results
in some blurring, so if you've resized the images you'll defintitely want to
sharpen them. Sharpening photos should be the last step and you should use your
software's Unsharp Mask filter, as this gives you much greater control over
the one-click sharpen command in many programs.
Embellish!
At this point your images should look pretty good and
be ready to put onto the Web as they are. But why stop there?
Images that merely look good aren't always enough to really
grab your visitors' attention. Continue on to embellishing
your photos for several examples of simple things you can
do in a variety of software to make your images more memorable.
Post
It!
If you've followed along, you'll soon have a passel of pictures
prepped and ready to post. Learn how
to put them on a Web page with this tutorial from Personal
Web Pages Guide Linda Roeder.
| 