Image Resizing

The simplest way to resize an image is to use an online service like PicMonkey.com.  We don’t endorse any particular online service here at the OpenLab, and there are many online resizing free services.  But this one is solid in that it has the things most people need when resizing (a bit of color changing, a size change option, a crop feature, and a way to reduce file size).  If you don’t like PicMonkey, go ahead and search online for “free image resizing” and you’ll find more options than you can handle.  And here’s an article that looks at a few similar editors.

Most of these are pretty simple.  Just two things to keep in mind:

1) most of the time, roughly 600 pixels wide is the most you need for an image on one of our sites.

2) when it comes to file size, you don’t need a large file for most online work.  Save a large image somewhere else, and post images that are less than 60KB.  To do this with PicMonkey, move the ‘quality’ slider when you go to save the image.

Here’s an example.  The image below was originally 1440 X 1080 pixels–way larger than we need.  What we end up with is a thumbnail that’s 600 pixels wide which you can click on to see the full-size image.  It’s pretty rare that we need that second size, but it’s on the site now, and taking up an enormous amount of space.

(image by j_bary on Flickr  via Creative Commons)

So if we resize the image (I used PicMonkey here) to 600 px wide, and then lower the quality to 50KB, we end up with this:

It’s not quite as nice, but it’s going to save you a lot of space on your site, and if you don’t need the larger image, it’s a great idea to do it in advance.  Of course, if you do need the larger sizes, you should by all means post them.  The key is to think through what you need your images for, so that you can use the extra space when you need to.  Images that come straight out of your camera or phone, for example are almost always much larger than you probably need.

Of course, PicMonkey is, as we said, very simple.  Much more can be done using Photoshop or Gimp.  Here are two short tutorials on doing these simple tasks with these two much more robust applications:

Here’s a tutorial on resizing using photoshop:

And here’s a tutoria on resizing using gimp:

That’s it!  As always, contact us if you have any questions.