Creating a Thumbnail Image

Thumbnail images are a useful way of keeping the size of a web page down so that the page doesn't end up taking too long to download. By incorporating a thumbnail image in the page and linking that to the larger more detailed copy of the image, one large download is split into a number of smaller ones and only those actually interested in the image have to wait for the detailed copy to download. The important thing in creating a thumbnail image is to actually create a second image in the smaller size rather than just adjusting the width and height parameters in the HTML. Only by reducing the actual size of the image do we get a smaller file to download as part of the page and gain the benefits of using a thumbnail.

So let's begin. I will assume that you have already created and saved the image that you want to create a thumbnail image for and.

To create a thumbnail image in Paintshop Pro (or any other graphics program for that matter) you need to:

  1. Open the image that the thumbnail is to be linked to.
  2. In the Image select the Resample option if that option is not greyed out. Only if Resample is greyed out should you select Resize The resample option maintains the existing colour balance of the reduced image better than the resize option does.
  3. Select the width that you want the thumbnail to be and make sure that the Maintain Aspect Ratio box is selected. Now select OK to resize the image.
  4. In the File menu select the Save As option and save the file with a different name from the original file.

Now all that you have to do is to upload both copies of the image to your web site and link the thumbnail into your page in such a way that clicking on it will open the larger copy of the image.


This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow