Using IrfanView For Thumbnail Creation

HideMyAss.com

This is a quick tutorial in using the excellent imaging tool, IrfanView, to batch process your images.



In designing a website today, I ran into a problem attempting to resize images. In typical catalog style pages, you usually have a full image and a thumbnail image. Resizing images in CSS is not recommended and I actually ran into discrepancies in some web browsers in that they didn't resize my image. The following CSS code doesn't work across all browsers:

.myImage {
  width: 50%;
  height: 50%;
}
<img class="myImage" src="myimage.jpg" alt="My Image that needs to be resized by 50%"/>

While this worked fine in Internet Explorer 9 and Mozilla Firefox 4, it failed miserably in Chrome and Safari by not showing the images at all. After reading several articles on the subject, I decided that if I was going to do this right, that it was best to resize the images with an editing tool rather than rely on using CSS to pull the job off.

Rather than go through and open up each image with Photoshop, I looked around on the net and found an excellent batch processing feature in IrfanView.

Here's what I did (note: make sure you make backups of originals before proceeding!):

  1. Bring up the batch conversion window via File | Batch Conversion
  2. Choose Work as Batch conversion - Rename result files
  3. Choose output format as JPG
  4. Clicked the Use advanced options
  5. Clicked on the Advanced button to bring up image settings
  6. Ticked the resize box and set the new width as 50% and height as 50%
  7. Changed the name pattern to "thumb-$N" so my thumbnails would be named thumb-originalfilename.jpg
  8. I then navigated in the directory tree to the folder of my original images
  9. I added all images and then removed those that didnt need to be resized
  10. I then clicked on the Use current (look in) directory button to lock in the output directory for the result files to be the same directory as the originals
  11. Then, pressed the start batch button

After I was done, all my files were resized by 50% and had the name thumb-{imagename}.jpg. This saved me boatloads of time. I couldn't imagine having to go to Photoshop and opening up 100 images and resizing them by hand. This definitely saved me at least 2 hours of work.

irfanView is freeware and created by Irfran Skiljan. It runs on Windows 9x, ME, NT, 2000, XP, 2003 , 2008, Vista, and Windows 7.

ASO ad

Filed under: