the blog

Website image sizes

Jul 2, 2021

I gave up, twice this weekend.  It was taking too long.  No, not the queue for ice cream, I’d never give up on that.  I mean waiting for a new website page to load.

Slow websites are the first block in the road to you reaching your customers and there are many, many things you can do to speed them up.  But the quickest and most effective one is to sort out your website image sizes.  I’ll be exploring this topic so that we can make sure your website performs the best it can for you and your business.

There are lots of factors at play when it comes to the speed of a website and it is easy to get bogged down or overwhelmed by the technical jargon and solutions but in most cases, there is no need to worry about any of it. 

For most freelancers and solo entrepreneurs, the important thing is how long it takes for a visitor to see the content of your page.

A quick way to check your page load speed

This free tool is great:

Enter your page domain and select the location where most of your visitors are based and press ‘start test’. The things to take a note of are the load time and then scroll down to ‘content size by content type’ and note the % for the image.

  • The ideal load time is under 2.5s (seconds) but anything under 3s is ok.  If that page has a high % of image content then this is when your website image sizes are important. 

Website image sizes – a general guide

Dimensions: Maximum width of an image should be 1080px

BUT there are exceptions:

  • a full screen sized header image needs to be 1920px wide
  • small icons/logos etc – 320px wide is usually sufficient
  • light box images (when you click on a small image and it gets bigger) 1550 x 844 looks good on most screen sizes

File size: the maximum is 1MB but the ideal is between 60kb and 200kb.

To reduce your file size then this free tool is perfect:

It compresses your image without affecting the quality and is free for 20 images a day.

Images are an important tool to connect with your potential clients through your website.  Apparently, we remember 80% of what we see and only 20% of what we read.

So, let’s make sure that your website is using this tool as effectively as it can and that your images are not putting off potential clients as they are slowing down your website.

Website image sizes – a quick summary to help speed up your website:

  1. Adjust the dimensions of your images – maximum of 1080px wide (with some exceptions)
  2. Compress your images – using the tinypng free tool.  If you have access to your administration area of your website there are free plugins you can use to compress even further when you upload them to your website, such as WP smush
  3. Test the load time speed of your website using the free tool at pingdom before and after

I know this can be time-consuming and a bit of a faff for images you have already have on your website but a quicker website can really mean the difference between a sale or a potential customer just giving up and going out for ice cream.

Any questions or comments?