This article looks at three programs you can use to resize photos for the web, giving them dimensions and file sizes that load quickly while preserving quality: Photoshop Elements, Paint Shop Pro and IrfanView. Plenty of others are available, but these are ones that I have found will do the job quickly, easily and at reasonable cost.
Why do it?
Even at broadband speeds, it takes a while to download those enormous picture files some people attach to emails. It's the same with web pages: if you do nothing about resizing photos before publishing them on your site, visitors must wait longer to view the pages. What's more, both you and your visitors may be paying for the extra data transfer. What we need to achieve is: pictures that fit on the screen without being scaled down by the browser; files that are small enough to load quickly; and good image quality.
Size on screen
Display size is measured in pixels (screen dots). Unless the page's code specifies width and height, pictures are displayed either at the original size, or scaled by the browser to fit the screen (e.g. with "Enable automatic image resizing" in Internet Explorer).
The HTML code for images usually tells the browser what dimensions to use for display. The problem arises when browser resizing makes a picture look smaller without reducing the original file. An 1824 by 1216 pixel image uses the same data whether you show it that size or set the display to 300 pixels by 200.
To reduce data transfer and load time, you must make a version of the original file at the actual display size.
Best size depends on layout and screen resolution. It is common to design pages for screen resolution of 800 by 600 pixels or 1024 by 768. Maximum image width of 500-600 pixels will generally look good without making the file sizes too big. Using consistent width and height makes a good impression. Choose some standard sizes for landscape and portrait mode and stick to them.
File size
The bigger the file, the longer it takes to load. Photos on the web are stored in a format (JPEG) that discards colour information to reduce file size. The higher the compression, the smaller the file, but the lower the quality. Always use the best quality setting you can on your camera, and edit copies of your pictures down to size for the web. You can never add quality to the original, though you can usually make another copy.
A typical compact camera produces files using 3-4 megabytes of storage. Reducing the dimensions to 600 by 450 pixels may reduce this to under half a megabyte, still far too big for a web page. Most photos can be compressed to 20-45 kilobytes and still look good on screen, while loading in an acceptable time.