HOW TO OPTIMISE YOUR WEBSITE IMAGES: UPDATED FOR 2024
Image SEO: A step by step guide, with video lesson too, on how to optimise your images before you add them to your website. An easy SEO win!
Step 1) Compress the size of your image.
Ensure your image is in jpeg format. Only logos and favicons are pngs on websites!
This is currently my favourite way to do this for free: https://compressimage.io./
Drag the image (s) in from your desktop, press Download Zip once complete, and drag the download onto your desktop. Even if you have only optimised 1 image it will initially appear within what is called a .zip folder. Double left-click on this .zip folder, which opens the folder and you will have the usual blue folder showing, probably named Untitled Design. Open this folder – double left-click, and there’s your image.
Step 2) Open Canva.com (or Photoshop if you are happier using that, or on a MAC you can resize your images: by double clicking on the image to open it, TOOLS and then ADJUST SIZE.
Resize your image to the correct size for YOUR website type and position.
Hero image max size 1920 x 1200px (pixels)
Images within the body of your website, square 800 x 800 px or rectangle 1200 x 800px.
Images in your e-commerce shop – usually – 800x800px
Need image sizes for SHOPIFY? Click here: https://www.shopify.com/uk/blog/image-sizes
For SQUARESPACE: click here: https://support.squarespace.com/hc/en-us/articles/206566727-Adding-and-resizing-images
Step 3) Correctly name your image
Let’s pretend this is your image:
” WHICH GOOGLE WILL NOT BE HAPPY WITH.
STEP 3 CONTD) This is a pewter sculpture by pewtersmith Fleur Grenier. Fleur has given the piece it’s own title, and let’s say, for argument’s sake, it is The Long March.
Your image needs to be named with keywords, so I would not call this The-Long-March-Fleur-Grenier.jpg (not the – between each word and th.jpg at the end).
Rather, to improve SEO, I would put Pewter-Sculpture-Fleur-Grenier-Pewtersmith.jpg which is now full of keywords that people do search for. It is very unlikely, unless you are looking for the Mona Lisa, that viewers will be searching for the name of the artwork itself.
If, within your website, you have the same image repeated twice or more, then the first one is
STEP 4) Upload this image to your media library within your website and enter the alt text in the appropriate area depending on whether you are using WordPress, Shopify, Squarespace, etc.
What is alt text?
Alt text (alternative text) describes an image on a page. Alt text helps visually impaired people understand what the image shows, helps search engine bots understand image contents, and appears on a page when the image fails to load. It is crucial to make your website accessible to all amd this is one of the vital steps to do so.
However, alt text should not be deliberately stuffed with keywords. In the image above, the alt text could be:
A silver pewter sculpture of ants in their nest by Fleur Grenier.
However for the image below, alt text reading (and I am making this up) Brilliant noodles from Melissa’s Noodle bar Herefordshire is NOT CORRECT AND IS DELIBERATE KEYWORD STUFFING
It should read, ‘woman sitting on a kitchen worktop with a bowl of noodles in her hands’ (but without the quotation marks and also not that there is no hyphen between words in alt text).
You are now ready to pop your image into your website wherever you might want.
If you would rather watch a video explanation of this, you can do so here:https://www.loom.com/share/95d9dc5b16a14c1abeea30a2fb0d4f6d?sid=cb0563e5-5a99-4be7-9de1-804f8c081320
Want to be sure not to miss additions to my knowledge bank? Then sign up for my newsletter below:
I’m Melissa Critchley, and I live with my wonderful family and adorable dog, Evie, in the scenic hills of the Shropshire/Herefordshire border.
One thing that truly ignites my passion is helping small creative business owners thrive and make more money online.
I’ve been in the marketing field for over twenty years, and for the past four years, web design too.
But here’s the best part: my approach to work is anything but ordinary. Let me tell you why:
Firstly, I have a solid grasp of Search Engine Optimization (SEO) and ensure that every website I build follows the best practices. This way, you’ll be amazed at how easily Google can discover your site (you’d be surprised how many web designers miss out on this important detail).
Secondly, I’ve been in the marketing game long before the internet was even a thing. That means I have a wealth of experience to help you navigate the often confusing world of marketing. Whether it’s through coaching or providing “done for you” services, I’ve got your back and I am easy to work with.
So, if you’re ready to take your online presence to the next level, I’m here to make the journey enjoyable and successful for you.
Let’s do this together.