Thursday, 3 December 2009

HOW TO RESIZE IMAGES FOR THE WEB


Copyright-free image from Tack-O-Rama

I've had a couple of queries on how to resize photographs and scans for the web. 

Blogger does give you the option of small, medium or large thumbnails, but if you don't resize your pix, anyone clicking on them may suddenly be presented with an image so large that they have to scroll up and down and side to side to see it. Plus it really slows your blog or web page down.

WHAT TO DO?

You need to reduce the resolution of your picture to no more than 96dpi (72dpi is fine, actually, which is the resolution of most of my pix.) Although you'll find 300dpi pix on my Freebies site as these need to be large so people can edit these themselves. If you click on a few of those, you'll see what I'm talking about.

DPI is dots per inch, and why a low resolution makes for a badly printed picture (all those dots - pixellation - you see in bad newspaper photos).

For printing you need a high resolution: 300dpi for magazine quality (pix you'd want to put in your scrapbooks and memory albums). But what happens if your downloaded pictures are already 72dpi? My old camera setting automatically sized to 72dpi - but the actual picture size is something like 27 inches high etc!

SO WE NEED TO FIX THAT AS WELL:

To begin, open your image (photo or scan) in your graphics programme, and go into Image > Image Size.

Do all your adjustments first (as explained below) then save as a jpg. JPGs are lossy formula - keep editing and saving, and you'll get a photocopy of a photocopy of a photocopy...

So do ALL the adjustments in once sessoin, and Save As when you are totally finished with any adjustments and tweaks.

Save one version at 300dpi if you think you'll need to print it out.

Hit the Undo button to get back to your original picture (you want to undo any adjustments - but don't exit as you'll lose the picture altogether) and then go into Image > Image Size and resize to 72dpi (or 96dpi if you want a slightly higher resolution). Do all your editing for this size (colours and brightness may look very different at this resolution), then Save As a different name from your 300dpi version.

HOW TO EDIT YOUR PICTURE

This is the order in which I always work:
  1. Resize the picture (as above) but don't save just yet....
  2. Then rotate the picture if it's crooked: straighten it using the Rotate facility. 
  3. Crop your picture. If there's one detail you like, but don't want the rest of the image, crop it out! (If you do Save As when you are finished, you won't overwrite the original image - which you just might need later on.)
  4. Adjust the colours: brightness, contrast etc. Very helpful to enhance a over-dark photo, shooting into sunlight etc.
  5. Sharpen your photo. If it's blurry you need to sharpen it (or if that doesn't work, try the Unsharp facility - which is in the same section). This can make a big difference.
  6. Save As, so you don't overwrite your original image (unless you want to, of course).
That's pretty much it: get in, crop it down and straighten it, sharpen it up a little if the picture needs it - then resize it and save as a JPG.

HERE'S A QUICK RUNDOWN:
Photoshop
Go to the Image button on your top toolbar to adjust Image Size and Rotate. Adjust brightness and contrast, hue and saturation  in Image >Adjustments. The Crop icon will be in the toolbar on the left. You'll find Sharpen under the Filter button (top toolbar).
Serif:
Go to the Image button on your top toolbar to adjust Image Size, Rotate, and into Adjust for the contrast, hue and saturation settings. The Crop icon will be the left toolbar, and Sharpen is located under the Effects button.
PaintShopPro:
Go to the Image button on your top toolbar to find Resize and Rotate. Go to Effects for Sharpen and Enhance Photo, where you'll need just the Automatic Contrast and Automatic Saturation buttons.
This isn't sophisticated editing, just the basics - but this will get you nicely sized photos to put on your blog and web page without too much hassle, or having to completely learn a complicated programme.

Your other option is to go for a freebie editor, which you can find online (PhotoScape, The Gimp etc - see my post re free graphics programmes).

However, these won't reduce the size of your files per se, ie: 300dpi shots will still be at 300dpi, even if you make the size smaller. But they will do a lot of special effects, and are very straightforward to use.

post signature
your photo name

1 comment:

  1. The save for web and devices feature of photoshop is pretty sweet too. I think it used to be called something else but I can't remember offhand.

    ::cheers:: Sü

    ReplyDelete

I absolutely love to receive comments!

But please note - I DO check for spam, and I moderate all comments - any spam is deleted at source.