PDA

View Full Version : Creating Thumbnail Images



xenomorph
07 Apr 2010, 11:56 PM
Hi everyone.

I'm currently trying to put together a website to showcase my artwork. I'm using KompoZer. Everything had been going smoothly at first. Then it came time to create my website's most important feature: Thumbnail images. The KompoZer tutorial I've been referring to (which has been EXTREMELY helpful) has no section regarding how to create thumbnails. Does KompoZer even have the ability to create thumbnails?

Also, the type of thumbnails I want to make wouldn't be mere downsized versions of the images they represent. Rather, they'd be small windows previewing small sections of the drawings they each represent. For example, if the image is a large-size portrait of a woman's face, the "window" would only show, say, her right eye, without the quality or size of the image of the eye having been decreased. Then, when clicked on, the window will link to another window or page large enough to show the same image, but in its entirety. To further understand what I'm going for, please refer to the following link:

http://www.conceptart.org/?artist=HardcorePixxX

A search result recommended irfanview for creating thumbs. So, I downloaded it. Also, is PHP required from the webhost in order to do thumbnails?

Thanks.
-xen

ernesto
08 Apr 2010, 12:43 PM
You can do this easily with a free program called GIMP. First make sure the program you are using, KompoZer, is actually resizing the images and not just putting code in the HTML file to resize the image there.

Start GIMP and load all the images you will need thumbnails for. Then, open a new file and set the image size to the size you want your thumbnails to be. You will have to do the following for each file:

1. Select the original sized artwork and press ctrl-c to copy it.

2. Go to the window for the thumbnail sized image and press ctrl-v to past the artwork into this file.

3. Using the tool that looks like a plus sign with arrows pointing in every direction, move the artwork around until you get the cropping you want.

4. Press shift+ctrl+s to "save as". Make sure the file type is jpg and pick a name that is the same as the large artwork, but with "-tn" or something added to it. It is very important to have consistency in file naming for when you put them in your web page.

5. A window that says "Export File" will pop up. Select "Export."

6. A JPEG quality window will pop up. Select whatever you want.

7. Repeat from step 1 with the next piece of artwork. Don't worry about pasting the new artwork on top of the last one. The image will be flatted and will only contain what you see.