Scanning
and Modifying Images for the Web
Note that every scanner works somewhat differently. The notes below
apply to the scanners in Macmillan 101 and 110. Other scanners will follow
the same principles but will look a little different. In this tutorial
you will scan directly into Photoshop since you will need Photoshop for
other purposes anyway, but it is also possible to access the scanning software
that comes with each scanner directly.
-
Place your image on the scanner face down in the upper right-hand corner.
-
Start Photoshop.
-
In Photoshop go to File | Import | HP PrecisionScan 1.01
-
Make sure the Scan in Color box is checked and that the upper box
is set to Scan to Photoshop, then press the Scan button.
-
In the Precision Scan Viewer window click Accept.
-
To crop the image to get just the part you want: make sure the square cropping
tool (dotted rectangle) in the upper left-hand corner of the tools palette
is highlighted, then place the crosshairs in one corner of the image you
want, press the mouse button, and pull it to the opposite corner. When
it forms a rectangle around the part of the image you desire, release the
mouse button. You will see a dotted line around the portion you have selected
for cropping. If you are not satisfied, click once anywhere in the photo
and try again. If you are satisfied, go to Image | Crop and release
the mouse button.
-
To adjust color: go to Image | Adjust | Levels and move the slider
bars on the two sides to the beginning and end of the color spectrum in
your image.
-
To adjust size: go to Image | Image Size and select the dimensions
of the desired image in pixels (not inches). Note
that you will enter either height or width, since the other dimension
will adjust accordingly.
-
It would be a good idea to save a large copy of the image first,
since you can always go back to it and make smaller derivatives. You cannot
go from a smaller copy to a larger one without losing image quality. Go
to File | Save As, then browse to the location you want to save
the file on your Zip disk or floppy. Make sure the Format box is set to
JPEG
(*JPG, JPE). Name the file with a short, contiguous filename with a
.jpg extension (e.g. janedoe1.jpg). Using a number at the end of
a filename makes it easy to name related derivatives such as janedoe1a.jpg,
janedoe1_small.jpg, etc.
-
In the JPEG Options window, make sure the Image Options box is set to High
(not Maximum) and that Format Options is set to Baseline ("Standard").
Then press OK.
-
Go to Windows Explorer, browse to the location where you saved the file,
and take a look at is file size. You may need to go to View | Details
to prod Windows to show more than just the file name. Large files
take a long time for users on dial-up connections to download. It is good
practive to make sure that inline images (those located directly in a page,
which appear every time the page is viewed) are not more than 40 kilobytes;
images that are accessible as links, which the user chooses whether or
not to view, may be considerably larger, but should not be over 100 kilobytes.
-
To get an idea of what size your image will be when viewed in a Web browser,
start Netscape and go to File | Open Page | Choose File, browse
to the image you have just stored, and doubleclick on it.
-
If the image is too large either in terms of display size in your browser
or in terms of file size, return to Photoshop, once again go to Image
| Image Size, and reduce the size of one of the dimensions. For
purposes of estimates: most images on the Wells Web site are about 220
pixels by 150 pixels. A "thumbnail" will be much smaller still (perhaps
85 x 85 pixels). When you have finished resizing your image, go to File
| Save As and give the file a different file name (e.g. janedoe1a.jpg
or janedoe1_small.jpg) so that it does not overwrite your larger original.
That way, if you later want to use an image size that is in between the
two, you can start with your large original.
-
Check your new image in Windows Explorer for file size and in Netscape
for display size. If you are happy, you're done. If you are not satisfied,
go back to your original (largest) image and try yet another Image |
Image Size operation. Each time use File | Save As to save the
file with a different file name so that you do not overwrite the images
you have already done (they may come in handy!). It is often nice to have
both a relatively small image (c. 150 x 220 pixels) for inline display
on your page and also a considerably larger one (c. 300 x 440 pixels or
larger), which you can make available if someone wishes by clicking on
your small image.
Prepared by Ken Larson, Professor of German, Manager: Computer and Network
Operations, Webmaster
Wells College, Aurora, NY 13026
Voice: 315.364.3305; Fax: 315.364.3227; Email: klarson@wells.edu
This page belongs to Ken Larson, who is solely responsible for its content.
Please see our statement
of responsibility.
Revised: December 13, 2001