Last updated 12.02.2024
An often-overlooked tip to transform your website rankings and your customer experience is optimising the images on your website. It seems like a tiny little task, but optimising website photography or imagery has a huge impact.
Images are essential on your website.
It’s how customers can get to know you and fall in love with your products or services. A professional image will practically sell your products for you, conveying the quality, style, and materials at a glance. Even as a service provider, a few professional photos of you relaxed, smiling, and looking approachable can be the very thing which causes someone to turn from a prospective customer to a current customer. A website without images will, at best, look boring. At worst, it’ll mean your website fails to convert entirely.
With this in mind, you might be tempted to think “the more the merrier” when it comes to uploading images to your website. The more photos, the better the customer experience, right? Wrong. Too many photos without accompanying text can be confusing to navigate. And, even one unoptimized photograph can cause some real problems for your site.
Here’s everything you need to know about getting optimised images for your website:
- What’s the difference between optimised images and standard images?
- Optimise website images: start small with simple steps
- Optimise website images: get technical with Image Engine
- Optimise website images: make your website accessible
What’s the difference between optimised images and standard images?
What’s the problem with standard images?
A standard image, snapped on your smartphone or from a digital camera, is a very large file. Each photo has a huge amount of data contained within it, from the dimension to how many pixels are in the photo, to the file name, to the ‘properties’ information.
There’s a good reason that photos are so large. The larger the file, the more pixels it has, and the more detail the photo has. This is extremely important when the photo is displayed on a high- resolution screen, or is printed, so the human eye can see all the detail captured in the image.
But there’s just no need for this level of detail in an image for a website. Any visitor to your website will be viewing it on a small laptop screen or on a mobile phone screen, and there’s no way for them to see the tiny details in the image.
Not only are the photos too detailed for people to appreciate, but they’re hugely detrimental to the function of the website.
What problems do unoptimised images cause?
Unoptimised photographs make your website slow to load because it takes a lot of energy for the image to appear on screen. The main reason this is a problem is that even a few seconds’ delay is enough to make someone disengaged or frustrated with your website. A visitor is likely to come to your site with a question, and if those questions aren’t answered quickly, they’ll bounce to another website. This could translate to missed or fewer sales because images don’t load, and customers fail to complete their orders.
It’s really important for your website to load quickly, not just for visitors, but for Google too. Google puts the best performing websites higher up the rankings. Yep, it’s not just humans that benefit from optimised images, but your search engine position too. Fast websites are seen as “good” websites. After all, fast websites must have been well- built, well- maintained, and well- designed. Google wants to send searchers to these websites. So, if your website is slow, or if people often bounce within 3 seconds, Google will not think your website is reliable or trustworthy.
The large, unoptimised images not only make your website clunky and slow, but they also make your website bad for the environment. The internet only functions because of a huge amount of electricity. The power used to manage servers, devices, and wi-fi services is difficult to comprehend, and the need is growing every year. A large website, or a website with large files, needs more energy for it to function. That energy usage directly translates into a higher carbon footprint and a negative impact on the planet.
“Page weight refers to the total size of a webpage, including all the files, images, scripts, and other content downloaded when a user visits a website. The larger the page weight, the more data needs to be transmitted. In turn, the site takes longer to load, and more electricity is used.” Nitropack, 2023
What’s the solution?
Simply: smaller images, and faster websites.
Compressing the images and reducing the resolution makes them smaller files. Typically, non- essential information is removed from the photo without it dramatically affecting the appearance of the photos.
There will be no impact on the image the website viewer sees (remember, these pictures are being seen for a few moments on a laptop screen or mobile screen) but there will be a positive impact on the website’s processing speed. This, in turn, will streamline the customer journey, improve site rankings on Google, and it’ll help the planet. There’s great software like Image Engine which can compress images extremely effectively.
Optimise website images: start small with simple steps
The smallest and most simple way to optimise your photos is to rename them. You probably have a bunch of images all named a random jumble of letters and numbers, ending in .JPG or .PNG. Or, perhaps you’ve named them things like ‘PicOfMe_HomePage’ and ‘[productname]1’.
This is a problem because you’re missing out on extremely useful SEO opportunities. Rename your photographs with an accurate description of what’s in the image, as well as other information Google will find helpful. For example, if you sell products, use words which describe what’s in the picture. In this example, we’re using lighting and lamps:
- Yellow_Mustard_bedside_lamp_bedroom_large_bayonet_bulb_Paramatta_New-South-Wales_Australia_Harry-and-Hetty-Lights-N-Lamps.jpeg, or
- Kitchen_lights_inspiration_modern_silver_pendant_glass_over-an-island_UK-kitchen_Free_Delivery_London.PNG
If you run a service- based- business, such as a window cleaning business, name your images something like:
- Michael_Johnston_Window_Cleaner_Affordable_Local_Residential_UPVC-Windows_Newark_New-Jersey_USA
- Michael_Johnston_Window_Cleaner_Affordable_Local_Residential_Wooden-Windows_Newark_New-Jersey_USA
- Michael_Johnston_Window_Cleaner_Affordable_Local_Residential_Double-Glazed-Windows_Newark_New-Jersey_USA
Notice how each word is split up with a hyphen or an underscore? This helps Google “read” each word. Google can’t “see” an image, it needs words to tell it what the image, page, or logo is about. So, the more clearly you label your images, the more information Google has, and the more times it can show your website when someone Googles words related to your business.
It’s a small thing, but it makes a huge difference.
Optimise website images: Image Engine does it all for you
Compressing images, reducing the resolution, and optimising them for websites can seem like technical and tricky tasks, but not with ImageEngine.
Your KitStart website is automatically integrated with Image-Engine. That means that when any customer visits your website, ImageEngine technology automatically looks at the characteristics of the device the visitor is using- a mobile, a tablet, a laptop, or a large monitor- and presents the most efficient image size and format for that screen for you. This results in huge savings on the energy and bandwidth required by data centres to deliver the images, but no reduction in service, appearance, or functionality. What’s more, you don’t have to do a thing, Image-Engine does it all for you.
Optimise website images: make your website accessible
By not optimising your images you’re inadvertently making your website inaccessible. If someone uses a screen reader due to a disability or visual impairment, they will not be able to “see” the images on your website. A screen reader is software which reads aloud to someone who cannot read a page on a computer. Like Google, it cannot “see” a picture, so you need to use words to describe it. The screen reader will read aloud the words you have written so the listener can imagine the scene.
This is called “alt text”. Alt text is not an optional extra, it’s an essential part of creating a website so that everyone can use the internet fairly.
Not only is your website then more accessible to everyone in society, but it’s an opportunity to include some SEO keywords. Do not stuff the alt text box with SEO keywords, because that ruins the experience of the person using a screen reader. Instead, accurately describe the image, and use relevant keywords. Here are two examples:
- An image of a red convertible car. It’s in a Clean Wheelz Car Washing zone of Meadow Town Target in LA. The sun is beating down on the car and the paintwork is shining. Chris and Joe are both cleaning the car, one with a power washer on the wheels, and one with a sponge on the bonnet. They are both wearing shorts and blue polo shirts with the Clean Wheelz logo visible. Just behind the red car, you can see three other parked cars, all clean and polished.
- A close-up image of pastries in the window of a bakery. The bakery logo is visible on the individual squares of greaseproof paper under each cake. The logo is orange, and in the shape of a croissant. It says The Sydney Patisserie in black text over the croissant. The pastries themselves are pain- au- chocolats. You can see the layers of the buttery pastry and the dark chocolate wrapped up inside. There is a dusting of icing sugar over the pastries too. They look delicious!
So, there you go! Everything you need to know to optimise your website images. By following these tips you’ll improve your website speed, improve your customers’ experience (regardless of their accessibility needs), improve your rankings on Google, all the while improving your environmental impact. By spending just an afternoon or two fixing up your website images, you’ll receive a whole world of benefits.
Small business next steps
Need some help? You can contact KitStart support right here.
Have a website with Start Simple but want to start selling online? Upgrade to the Start Premium package and add an online store or bookings and payments to your website right here.
