The basics

ADVANCED PHOTOSHOP ELEMENTS 5.0 FOR DIGITAL PHOTOGRAPHERS
10.02 Optimizing photos for the web
Suitable for Elements – 5.0, 4.0, 3.0, 2.0, 1.0 | Diffi culty level – Basic
Related techniques – 10.01 | Menus used – File
The skill of making a highly visual site that downloads quickly is largely based on how well you
optimize the pictures contained on the pages of the site. The process of shrinking your pictures for
web use involves two steps:
• Firstly, the pixel dimensions of the image need to be reduced so that the image can be viewed
without scrolling on a standard screen. This usually means ensuring that the image will fi t within
a 640 x 480 or 800 x 600 pixel space.
• Secondly, the picture is compressed and saved in a web-ready fi le format. There are two main
choices here – GIF and
JPEG.
The best way to optimize
your pictures for web use is
via the Save for Web (Editor:
File > Save for Web) option
in Elements. This feature
provides before and after
previews of the compression
process as well as options
for reducing the size of your
pictures, all in the one dialog.
Using this feature you can
select the fi le format, adjust
compression settings, examine
the predicted fi le size and
preview the results live on
screen.
Zoom
level
Original
name and
fi le size
Before
preview
After
compression
preview
File size and predicted
download time after
compression
Compression type
and associated
settings
Preview in
browser
To create a typical ‘thumbnail
Save for Web >> The best way to ensure that you are using
the best balance between file size and image quality is to
and gallery’ site you will need two different
preview your compression and file type choices in the Save
versions of your images – full screen size images for Web feature.
suitable for use as gallery pictures and small
thumbnails that can be laid out together on an index page. To make these resources you will need
to size and compress each image twice and then save the fi nished fi les into two separate folders titled
‘thumbnails’ and ‘gallery’. Make sure that the gallery images are no bigger than one full screen and
that the thumbnails are small enough to fi t several on the page at the one time.
File formats for images on the web
The standard PSD or Photoshop Elements fi le format is not suitable for web use; instead several
different picture types have been developed especially for on-line work. The two most common are
JPEG and GIF.
Book resources at: www.adv-elements.com
Animation
settings for
GIF format
257
EXTENDING YOUR WEB
ABILITIES
Original
pixel
dimensions
New pixel
size settings