Cropping and resizing

Imagine you’re back in primary school.

There’s some child-friendly glue, child friendly scissors, a scrapbook and a furrow across your brow as you so carefully try to cut a photo from a magazine or comic down to size to fit in with your collage.

Okay, I don’t remember doing that but maybe someone somewhere will and remember that’s what cropping a photo to size is.

This is a blurry photo. A blurry photo is as bad as a photo that's too stretched, pixellated or the wrong size

This is a blurry photo. A blurry photo is as bad as a photo that's too stretched, pixellated or the wrong size

Now, imagine trying to squeeze the picture of your favorite cartoon character into a space in that collage. A space that’s just not big enough. That’s resizing. Try it on the web without cropping your photo too and you’ve got something that’s substandard if you don’t have the dimensions right.

Make life easier

If you’re going to manage your website content yourself you can be assured cropping and resizing imagery will be come as regular a task as crossing your Ts and dotting Is.

Here’s a few steps to making photo content easier.

  1. Know what sort of image should be on that page
  2. Know where you can source such an image
  3. Check permissions and terms of use to ensure you’re not infringing copyright and have permission to use the imagery
  4. If your CMS allows it, prepare your photo caption and alt description
  5. Find out the ideal dimensions of the photo. E.g. what’s the maximum width of the page? Is it square, landscape or portrait?
  6. Discover the most appropriate photo editing tool and learn how to crop and resize images

These steps will help you get on the way to adding photos comfortably and being confident enough that they’re not pixellated or stretched looking.

0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>