When it comes to websites and blogs, everyone is preoccupied with writing high-quality content that is carefully optimised for their audience and search engines. What they might not know is that images need just as much care and attention. Image SEO should be a vital part of your content and SEO strategy—if it’s not already, you’ve come to the right place!
We’re going to help you figure out exactly what image SEO is, why it matters so much and how you can optimise your images in 8 steps. Let’s go!
What is image SEO and why is it important?
When you add content to your website, you need to make sure that it’s targeting the right keyword(s) and has the right accompanying metadata. This is to help Google understand your content better so that it can match it to relevant user queries. It also has the added benefit of improving your search rankings, website metrics and SERP real estate.
The same also applies to your images! Google needs your help to process your images and understand them. By optimising your images—with relevant filenames, alt text, file size and so on—you not only help search engines understand your images, you also ensure that your images:
- Rank well in search engines
- Load quickly on your website
- Strengthen your website content
- Improve user experience
Good content needs good images
A picture’s worth a thousand words…well, more or less. If you’re going to the effort of carefully crafting high-quality content to suit your audience and search engines, you should do the same with your images. Images are what add more value and excitement to your content. They make it more visually appealing and, often, make it easier to read.
You can’t just go about picking random images, however. They need to match the content and its overall purpose, not to mention the general aesthetic of your website and brand.
Picking your images
If you can, try to avoid using generic stock photos on your website and/or blog. Original images not only rank better in Google Image results, they also happen to be more visually appealing to your website visitors.
Of course, if you don’t have an in-house photographer or graphic designer, it can be difficult to create original images (especially on a budget). The best way forward, then, is to sift through what images are available to you and pick out ones that haven’t been used by your competitors or other businesses in your sector.
Whatever images you do end up choosing also need to be high in quality. Even if your content is stellar, blurry images are a sure-fire way to push your visitors away.
Where can I find high-quality images for free?
You can’t just pick the first image you find on Google Images. It could land you in a heap of trouble with copyright infringement. If the owner of an image sees that you’ve used their content without permission, they could sue you.
To avoid this happening, you need to look for images that have been published under Creative Commons licenses—depending on the specific license type, you could be allowed to use and adapt the image, as long as you give credit. You can filter for this with Google Images by selecting ‘Tools’ > ‘Usage Rights’ > ‘Creative Commons licenses’.
You can also pick websites that offer free images under Creative Commons CC0, which means that you don’t have to add any attribution. There are countless available, including:
Once you’ve got your images picked out, it’s time for you to optimise them so that they can reach their potential!
How to optimise your images for SEO
1. Pick the right filename
First things first, you need to make sure that you’re picking the right filename for your images. It’s all too easy to settle for ‘image-1.jpg’, but this is a big no-no for a couple of reasons. One, it makes it difficult for search engines to know what the image is about. Two, it makes it difficult for you to keep track of your images. You’ll find it pretty hard to search for a specific image if you’ve just used a random numbering system.
You also want to avoid keyword stuffing in your filenames, e.g., ‘best-keyword-tools.jpg’. Your filename should be descriptive and relevant—a short description of what the image contains and what it’s about.
2. Don’t forget alt text
Next up, alt text! If you’re in the habit of leaving this box blank on all of your images, then this point is for you. Alt text is extremely important, as it helps to improve accessibility for people who cannot view images on webpages, whether that’s people who use screen readers or those who have poor bandwidth. Plus, if there’s a problem displaying your image for whatever reason, your alt text will be shown instead.
When crafting your alt text, Google advises you to “focus on creating useful, information-rich content that uses keywords appropriately and is in context of the content of the page”. In other words, your alt text must be relevant to the image and use keywords where necessary.
In your source code, it would look something like this:
<image src=”person-searching-on-google.jpg” alt=”Person using a laptop to search on Google”/>
You need to do this for all of your website’s images. Don’t go duplicating them either! You need to make them all original and relevant to the image in question.
3. Include captions if necessary
If you’re displaying an image that is relevant to your content, e.g., a blog post, but the context isn’t immediately obvious to your readers, you might want to consider adding a caption.
This is a great way to give your website visitors more information about your chosen image(s) and why it’s so important. They’re also useful for crediting photographers/image owners for copyright purposes.
4. Use the right format
For the most part, images on your website will likely fall under one of two image file types: JPG or PNG.
JPGs are popular because they offer people lower file sizes, which is is very beneficial for page loading times. It does come at a cost, however, as the quality of these images tends to be lower. PNGs, by comparison, come with a larger file size but higher quality.
So, which is best? There’s no rule of thumb here, but generally speaking, you should stick to JPGs for photographs and PNGs for text, line drawings and screenshots. You might even want to consider some of the next generation image formats like:
- WebP
- JPEG 2000
- JPEG XR
These formats are higher in quality but come with better compression, so you don’t have to worry about large file sizes. You do have to be careful with which ones you use, however, as certain browsers will not support them.
5. Compress them
The larger the file size of your image is, the slower it will be to load. This then leads to slow page loading, which has a detrimental effect on user experience. If a page takes too long to load, your visitors will likely bounce and never return. So, how can you fix this? By compressing your images!
Compression is a way of reducing the file size of your image, by stripping away any unnecessary data, whilst mostly maintaining its overall quality. You want to avoid using images that have a file size over 300kb—if you can, get the file size under 100kb.
You can do this firstly by resizing the image. If it’s 1200px, for example, but your website has a width of 800px, there’s no point in leaving the image at that size. Reducing its scale will automatically lower its file size. If that’s still not low enough, you can use a compression tool like Optimizilla and TinyPNG, or a WordPress plugin like Smush.
When you compress your images, make sure you keep an eye on how the quality deteriorates as the file size shrinks—remember, blurry images are a big no-no!
6. Make them responsive
Another issue that might affect user experience is how your visitors view your webpages. If they’re browsing on a tablet or mobile phone, your images might be too large and cause the entire page layout to mess up. This is known as Cumulative Layout Shift (CLS), which you can find out more about in our guide to Core Web Vitals.
To avoid this, you can make your images responsive. You can do this by using an <img srcset> attribute, or <picture> element. What this will do is display different sizes of your image depending on a visitor’s screen size. You can view a more in-depth example of this from Google below:
<img srcset=”example-320w.jpg 320w,
example-480w.jpg 480w,
example-800w.jpg 800w”
sizes=”(max-width: 320px) 280px,
(max-width: 480px) 440px, 800px”
src-“example-800w.jpg” alt=”responsive web!”>
7. Add structured data
Structured data plays a vital role in helping search engines accurately understand the content of your website. And, as you’ve probably guessed, it’s also valuable for the images on your website too!
If you add schema markup to your website’s images, they may be displayed as rich results, or be given badges that give visitors insights about your webpages. There are three markups currently available for images:
- Product
- Recipe
- Video
To explain this further, let’s imagine that you’re interested in baking a coffee and walnut cake. You’re looking for something especially impressive, so you start browsing on Google Images for some ideas. Jackpot! You find one that’s suitably impressive…only to realise that it doesn’t come with an accompanying recipe. Annoying, right?
This problem is completely eradicated with Google’s badges. As long as websites have added the right markup, their images will be displayed with a relevant badge (in this case, a recipe badge) which helps users figure out what type of content is associated with the image.
8. Create an image sitemap
XML sitemaps are used by Google to crawl your website’s pages. You should already have one for your webpages, but you might not know that you can create ones for your images and videos as well. Doing so will help search engines in the event that they are unable to find images on your website.
You can either do this manually, or use a tool like Angel Digital’s free image sitemap generator.
Bonus tip
Now that you know what image SEO is and how to optimise your images accordingly, it’s time for you to look back at your current image library so that you can tweak your images to fit your new standards.
You can do this by using a crawler like Screaming Frog. It will generate a list of your website’s images, along with their filename, alt text, file type and size. This will help you determine which ones need new filenames and alt text, and which ones need to be compressed.
You might find it useful to create a spreadsheet so that you can track which images need changing and when. Once you’ve done this, you should be completely set!
And there you have it! You should now know the ins and outs of image SEO. For more advice and tips on other SEO topics, head on over to the Supersede Media Blog!
