It’s critical to your website’s performance, social media effectiveness, and search engine optimization, that the images you put online are cropped and sized properly. And by sized I don’t just mean in terms of dimensions, but also in terms of file weight. Professional editing tools such as Photoshop can handle all of these challenges, but they’re pricey and require a good deal of knowhow. Happily, there are free online photo editing tools that can do the job — without needing to install software on your computer or take a class to learn to use them.
File Size Versus Dimensions
When I’m working with people who are just beginning to post content to the web, a nearly universal point of confusion is why it’s not okay to simply drag to resize a large image. For example, let’s say you have a high resolution image you’ve just take with your iPhone 6. It’s likely going to be roughly 3,000 by 2,000 pixels from a dimension perspective – and more than a megabyte (MB) in file size, perhaps even as much as 3MB or more.
So how do we put that in context? For general purposes (and there are always exceptions), I like to see photos optimized for the web with a file size of between 50 and 100 kilobytes (KB). One thousand KB make up a MB, which means that a photo direct from an iPhone 6 will be at minimum 10x too large for optimal download speed on the web. Probably more.
Circling back to the question of dimension versus file size, let’s say you upload that huge photo to your blog or your company web page. You’ll see right away that’s it too big and, depending on the system you’re using, you might grab the border of the photo and drag it inward to make the photo smaller on the page. And visually, the photo will look smaller. But here’s the rub – you will not have changed the file size at all! So what you’ll have is a picture that looks like it is 300×200 pixels, but still has a 3 MB file size.
Why Does Image File Size Matter?
Image file size matters because the larger the file size, the slower the image will appear when somebody visits your web page. And a site filled with unduly large images will perform poorly overall from a speed perspective, as well as wasting hosting storage space (which could end up costing you money), and needlessly burning through your readers’ data plans.
And speed matters from a search engine optimization (SEO) perspective! With it’s emphasis on mobile, Google now takes into account site speed when ranking pages. You want to be found in search? Make sure your site performs well on Google’s PageSpeed Insights test.
Cropping
Cropping (selecting the portion of the image you wish to display) is important for a couple of reasons. One is that a poorly composed image as taken can be corrected by cropping. Another is that social media platforms such as Facebook and Twitter show photos in very specific sizes and aspect ratios. If you don’t size and crop the images you’re posting to social media, the platform will do it for you – sometimes with terrible results.
Is There An Easy Way To Do All This?
I’m glad you asked! Yes, there’s a simple way to get your photos cropped and optimized for the web. There are a number of free online photo editing tools that automate much of this process and are incredibly user friendly.
For simplicity’s sake, I’m going to focus on just one of these – PicMonkey.
PicMonkey
PicMonkey is a completely web-based photo editor, with a super-simple interface and sly sense of humor. The basic subscription, which gives you access to the core editing tools, basic touch up features, basic effects and overlays, fonts, textures, is free. You can unlock more advanced features and get rid of the ads on the site for $4 a month.
When you upload a photo to PicMonkey, it automatically resizes the image to one of three large sizes to facilitate the speed of the editing performance, which can be an issue if you have a slow computer. In general, you’ll be fine with the default setting (Bubbles).
From there, it’s a click of a button to crop, another to resize (dimensions), the photo.
Then you simply click save and you get three options, ROGER, PIERCE and SEAN.
You may recognize these as the first names of various actors who have played James Bond. PicMonkey’s designers have exercised some artistic judgment here and determined ROGER to be the lowest quality (but fastest loading), and SEAN to be the highest quality (but potentially slowest loading). PIERCE is a happy medium.
And that’s all there is too it! No matter how little you may enjoy fiddling with image editing software, you’ll find this a snap to use. Which is great news for your website – and your readers!