Preparing images for your website

If you’ve got a content management system installed on your website then it’s important to prepare your images before you upload them.

Preparing images for your website
Photo by Rayan Almuslem on Unsplash

Images from modern digital cameras can be enormous and chances are if you try and upload these images without doing anything to them you’re going to experience some memory problems, especially if your website is running on shared web hosting.

There are tweaks your web designer can do to increase the amount of memory in use on your hosting and this will help to prevent any issues. However, it always pays to do some image optimisation first before you hit the upload button.

Resizing

Your cms should automatically resize images for use on your site, but in the first instance we just need to make sure we have a sensibly sized image that we can upload.

So let’s imagine you’ve got an online gallery on your website which displays your latest photographs and you know your images have a maximum width of 1000 pixels. Armed with that knowledge you can take the images from your camera and use a free tool like iPhoto (Mac) or Paint (Windows) to scale your images down accordingly.

Compressing

The next step is to see how much you can compress those images. This is increasingly important to give people viewing your site on slower connections a good experience, and as Google loves fast websites it won’t do your rankings any harm either.

You can find a lot of image compression tools online but the one I tend to direct my clients to is tinypng which compresses both .png and .jpg formatted images. It’s as easy as dragging and dropping your images onto the site and downloading them back to your computer once they’re done.

Tinypng is a great tool and you’ll be amazed at how dramatically it’ll reduce image file sizes. If you’re lucky enough to own a copy of Photoshop you can purchase a plug in that allows you to compress files directly from that application.

So you’ve got a resized and compressed image and you’re good to go. Just remember to give your images meaningful file names and you’ll be on your way to improving your ranking as well.

Happy uploading!