Image optimisation

Image optimisation

It's often said, “a picture is worth a thousand words”. We love to interact with visuals rather than words. If we are able to reduce the size of these images without reducing the image quality, then it will have a direct positive impact on page load speeds.

According to akamai.com, 50% of potential web users love sites which load in less than 2 seconds. If the page takes more than 3 seconds to load almost 40% of visitors tend to leave that site. This results in fewer visitors to your site. The solution: IMAGE OPTIMISATION

What is Image Optimisation?

According to “WhatIs.com” – Image optimisation is minimizing the size in bytes of an image without degrading the quality of the image to an unacceptable level. The reduction in file size allows more images to be stored in a given amount of disk or memory space. It also reduces the time required for images to be sent over the Internet or downloaded from Web pages.

Why Should I Optimise my Images?

The importance of Image Optimisation cannot be emphasized enough. We live in an instant gratification world, so any delay in your website load speed will result in a user moving on to the next site.

How Do I Optimise my Images?

How do we go about optimising our images? There are 3 straightforward steps below: The end result of this process is images not being bigger in size than 400kb, yet great quality, so they will look good and load fast.

STEP 1: RESIZE MY IMAGE(S)

The first step in image optimisation is resizing. Stock imagery is generally massive file sizes so it’s important to resize these images so that they are perfect for the web. Our rule of thumb is to make sure they have a resolution of 1280 (Width of 1280 – Height: Auto). Using 1280 means that it will be visible across most screen sizes. You can use 1920 but that is for bigger screens.

On resizing – if you have a high number of images – it will be counterproductive to individually resize – that would take way too long! There are a couple of bulk resizers available for Windows and Apple.

WINDOWS: There is an online tool called Pic Resize. This will allow using the parameters established above and resize. For a non-online option – you can use a program called FastStone Photo Resizer. It even has a nifty bulk rename option to go with the resize. You can just download and install the program on your PC and go from there.

APPLE: Pic Resize is an online tool that you can find in your browser. So you can use it either on windows or mac. You can also get a program called Image Resizer or QuickScale if you would prefer an offline option.

STEP 2: COMPRESS MY IMAGE(S)

The next step after you have resized your images is to compress them so that they are not bigger than 400kb. One of the easiest ways to do this is with an online site called “Tiny PNG.” You can upload 20 images at a time and Tiny PNG will compress the images for you and then you can just download the images from there.

STEP 3: UPLOAD IMAGE(S) TO MY WEBSITE

The final step is to upload your resized, compressed images to your website. It is highly recommended to also have an Image Optimisation plugin on your website that does a final optimise as your image gets uploaded to the media library. Tiny PNG has a plugin that you can use on your website to do this for you or you can use a PREMIUM plugin called IMAGIFY that is really good and optimises your images as they get uploaded for you.

In conclusion

it’s really important to understand that a website is your public face to potential customers. If customers don’t like they what they see or are frustrated with the slow service – they will leave!

So take the time to optimise your images and reduce your load time. At Pathfind Media – we implement this process on all our websites and we have seen the benefits.