Adobe Photoshop PS2, Part 1
This guide provides steps for scanning a graphic image directly into Photoshop, and preparing images for viewing on the Web.
Scan Image into Photoshop using scanner (Windows)
Skip these scanner instructions if you have a graphic ready to open in Photoshop.
1. Turn on scanner next to the Windows computer No. 14 in HUB.
2. Start computer connected to scanner, then start the Photoshop CS2 program.
3. Place material to be copied on the scanner flatbed, right side down.
4. In Photoshop, pull down the File menu and choose the Import command.
5. On the sub-menu that opens, choose HP scanjet 5590 TWAIN.
6. You see a dotted rectangle surrounding part of the image to be scanned.
7. Drag the crop rectangle to outline only the part of the image you want to scan.
8. At the top of the screen, pull down the Advanced menu and check the resolution setting. The default is 200
dots per inch, which is satisfactory for images to be viewed on the Web or for PowerPoint use.
9. Click the New Scan icon. The scanner will do another preview scan.
10.When you are satisfied with your new scan and your settings, click Accept.
11.The final scan will be scanned into Photoshop.
Scan image into Photoshop using the Macintosh scanner
1. Turn on scanner next to Macintosh computer No. 1.
2. Start computer connected to scanner, then start the Photoshop CS2 program.
3. Place material to be copied on the scanner flatbed, right side down.
4. In Photoshop, pull down the File menu and choose Import then HPScan Pro 5590 (TWAIN) command.
5. The HP Scan Pro dialog displays.
6. Make any changes to the resolution and any other settings you want.
7. Click New Scan and scanner does a preview scan.
8. Select portion of image you want for the final scan, then click Accept.
9. The scanner does the final scan and the image is scanned into Photoshop.
Preparing Images for Web Viewing
You need to understand how computer monitors display images when you prepare them for viewing on the
Web. The computer monitor you use to create your Web pages may be of a different size and may be set to a different resolution than the monitors of those viewing your Web site. If an image is too large for a user’s monitor,
that user will not be able to see the complete image without having to scroll it sideways or up and down. If you
plan to create an image for display on the Web, make sure you follow these important guidelines:
• Use images on your Web site sparingly. The more images you put on your Web page means that the
person viewing it will have to wait a longer time to see it (including those with high-speed Internet
connections). With this in mind, you would be wise to limit your images to those necessary for your
message.
• Make sure your images won’t have to be scrolled when viewed on a monitor set at the 800 by 600
resolution. Generally, your images should not be any larger than about 700 pixels wide by 400 pixels
high. However, you may need to make your images smaller depending on the design of your Web
page. Crop or resize your images if they need to be scrolled.
• When cropping or resizing your images, use an image editor. If you crop or resize your images in
your Web editor, you will create large image files. Although they may appear small, images resized in
a Web editor are the same large file size, which may force visitors to your Web site to wait a long time
to view them. The HUB (Room 121) has a current version of Adobe Photoshop PS2, as well as scanners for both Windows and Macintosh.
• Include “alt text” for every image you use on your Web site. This is required by state and federal
ADA rules. For more information about using alternative text for images, please contact Instructional
Technology staff, Arlene Adamson at x6643 or aadamson@chabotcollege.edu.
• Save your image in either JPG or GIF format. If you are using BlackBoard, you need to know that
BlackBoard will not allow other graphic formats.
Considering Image Formats
Choosing between either JPG or GIF will ensure your image is as small (in file size) as possible with the
greatest amount of detail preserved. Images saved in the wrong format will be larger in file size and will
appear choppy or grainy on your Web site. The following information will help you decide which format
to use for your particular image:
GIF (Graphic Interchange Format)
The GIF format compresses graphics by looking at each horizontal
line of pixels and recording the color changes. Therefore, the fewer
color changes per horizontal row of pixels, the smaller the GIF file.
When possible, don’t use vertical stripes or gradations. Make them
horizontal.
Flat-color illustrations containing type, or images with sharp, welldefined edges, display best over the Web in GIF format without
dithering. “Cartoon” images commonly found in comic strips fit this category.
The Mother Goose cartoon image containing text, displayed at right, is a good
example.
JPEG (Joint Photographic Experts Group)
The JPEG compression format was developed as a way to gain high levels
of compression while retaining satisfactory image quality. It is generally favored for photographs or continuous-tone graphics. Choose the JPEG format
if colors in your image are variable and have subtle changes in contrast and
hue. Photographs are the best example of images that should be saved in this
format. This picture of a wolf is an example of a continuous-tone image that
compresses well to the JPEG format.
When using the JPEG compression format, you can select an image quality and compression level for the
file. A trade-off exists between the image quality and the amount of compression. An image compressed
using Maximum quality is less compressed than an image compressed using the Medium or Low quality
option.
Prepare an image in Photoshop
If you scanned your continuous-tone image into Photoshop CS2, or if you have opened a continuous-tone
image in Photoshop CS2, then proceed to crop and resize your image if it is necessary.
Crop a continuous-tone image
The image used in the following instructions is of a gorilla. The gorilla file is provided. Since it is a continuous-tone image, you will first crop it then compress it to JPEG format.
Crop the image
1. Note that the Tools
Palette is located in the
upper left area of Photoshop’s screen. The Crop
tool is the third tool down
on the left. The Crop tool
allows you to isolate a certain area of your image.
2. Select this tool, then
click and drag the tool to
outline the portion of the
image you want to keep.
A dashed imaged rectangle appears. The Options
Bar appears after a cropping rectangle is added to
the image. You can set the
color and the Opacity of
the shaded area.
3. When the Shield
Cropped Area check
box is turned on, the area
outside the crop rectangle
is shaded. See picture here
showing the shaded area.
4. Notice the size of the picture at the bottom of the picture.
5. When satisfied with your intended crop, depress the Return key (Mac) or the Enter key (Windows), and the material on the outside of this line is removed.
Look at the image size
1. Pull down the Image menu and click
the Image Size command.
2. In the top section the image dimensions are listed in pixels.
3. In the bottom section, the document
size of the image is listed in inches.
4. Set the Resolution of the image
to around 96 pixels per inch. Some
monitors are set to 72 pixels per
inch, and others are set to around 96
pixels per inch.
5. Note that Constrain Proportions
is checked. This means that the ratio
of width to height is constrained so
that if you change the width, the height would automatically change and visa versa.
6. Change the width of the pixel dimensions by clicking on the Down Arrow opposite either the Width
or Height Pixel Dimensions area. Choose Percentage.
7. In the Width box, type in 80 (for percent).
8. Both the width and height pixel dimensions are reset to an acceptable setting for viewing on a monitor.
9. Click the OK button.
Convert to JPEG format
You are now ready to compress the image in JPEG format.
1. Pull down the File menu and choose
the Save As command.
2. Choose JPEG as the file format.
3. See a picture of the dialog that appears in which you can use a slider to
adjust the quality of the image and see
how the size changes. When the quality is low, the size (in kilobytes) of the
graphic is reduced the most. When the
quality is high, the size of the graphic
(in kilobytes) is greater.
4. When satisfied with your settings, click
the OK button. However, if you want
to view your compressed image, use an
alternative procedure.
5. If you want to view your graphic image after compression, there is an alternative command you can
use to view the image before and the image after compression.
6. Pull down the File menu and choose the Save for Web command.
7. Choose the 2-UP tab, and the dialog that appears will show your original picture on the left with the
compressed (optimized) picture on the right.
8. If you are satisfied with the optimized graphic, click the Save button.
Compress your image in GIF format
You are provided with a graphic file named Cartoon. Open it in Photoshop
CS2. This is the type of file that compresses well by using the GIF format. Follow these steps:
1. With the cartoon file opened in Photoshop CS2, Pull down the File menu.
2. Choose the Save for Web command.
3. In the dialog that appears, the original cartoon graphic is shown at the left
and the optimized graphic is shown at right in the dialog.
4. The file size of the original was 279 K, and the file size of the compressed GIF file is 9.129 K. You can
see how much the file is compressed without a noticeable reduction in quality.
5. At the far right of the dialog, see the GIF settings. They are pictured here at the right.
6. If you are satisfied with the quality of the compressed file, click
the Save button and your optimized file is saved with the name
and location of the file you have specified.
Notes: