How to optimize your images for SEO
One of the assessments of the Yoast SEO plugin checks if you use images, and if you use your focus keyphrase in the alt attributes of these images. But you may be wondering: what are image alt attributes? Why is it important to optimize images for SEO? And how do you go about that? Let’s find out!
What is an image alt attribute?
You can add an image alt attribute – also called: an alt text or alt tag – to an image to show descriptive text in place if the image can’t be displayed to the visitor for any reason. This could be because visitors have turned off images in their web browsers. They could also be using a screen reader due to visual impairment. The image alt attribute ensures that no information gets lost in these situations. In addition, search engines use alt text to determine what’s on the image.
An alt text should contain enough information for search engines and people who can’t see the image to understand what the image represents. Keep in mind, though, that while the alt text needs to be descriptive, it also needs to be brief. Most screenreaders seem to cut off an image alt text at around 125 characters.
Let’s take a look at an example. Let’s say we wrote a blog post for yoast.com in which we used the following image:
Now, let’s consider three possible alt attributes:
- ‘girl with phone’
- ‘girl using a mobile phone on the street while holding an umbrella’
- ‘girl with curly hair dressed in a purple coat using a mobile phone on a busy street while holding an umbrella’
Which one do you think is the best example of an alt attribute for this image? Although the first one is brief, it’s not descriptive enough. And the third one might be very descriptive, but it is way too long for the image. Number 2 is both descriptive and brief, and therefore a good example of an alt attribute for this image.
How to add alt attributes
But how do you go about adding alt attributes for an image? Well, first of all, you could use HTML code to add alt attributes. To add an alt tag to your image, simply add alt=”alt text” to your image code, like this:
<img src="girl_with_phone.png" alt="girl using a mobile phone on the street while holding an umbrella"/>
Easy, right? If you use WordPress to manage your site, it’s even easier. Simply open the ‘attachment details’ for the image to add the alt attribute, as shown in the image below.
Why is it important to optimize images for SEO?
Prefer learning through video and practice? We have a free lesson about the reasons to optimize your images in Yoast Academy!
We’ve seen why image optimization is important for your users, but why is it important for SEO? Images can improve almost any post or page – remember the saying “a picture is worth a thousand words”? Your article will become a lot more attractive with images.
Also, you provide both users and search engines with a textual description of the image if you add an alt text. As we’ve seen before, this improves accessibility, but it also increases your chance of ranking in image search. And as seen in Google’s vision for the future of search, visual search is getting increasingly important, which means that ranking high in image search could turn out to provide you with a nice bit of traffic. So, if you have visual content, it might make sense to put image SEO higher on your to-do list.
Learn more about this check in Yoast SEO in our explanation of the image alt attributes assessment.
How to optimize your images for SEO
We’ve discussed alt attributes, but this isn’t the only aspect of image SEO that’s important. If you want to fully optimize an image for SEO, there are lots of things you should do. In this article, we’ll discuss a few basic tips on how to optimize your images for SEO (and get your green bullets in Yoast SEO).
1. Add images to your text
This one’s simple: you should try to add images to every article you write, to make them more appealing. Images will also help readers and search engines understand your text better.
2. Add alt text to your images
As we’ve discussed in this article, you should always add an alt attribute or alt tag to your images. This ensures a descriptive text is shown in place if the image can’t be displayed to the visitor for any reason. In addition, it provides Google with a textual description of the image, which they use to rank your post in image search.
3. Use your focus keyphrase in your alt text
Because search engines need context about an image to understand what’s on them – and to rank your page in image search – it’s important to use the focus keyphrase of your article in the alt text. The Yoast SEO plugin checks if your alt tags use the focus keyphrase. If you have Yoast SEO Premium, it even checks for synonyms of the keyphrase you added to the post.
If your text contains ten images, you don’t have to include your focus keyphrase in all accompanying alt texts. We have set a margin that helps you find the right balance.
4. Use your focus keyphrase in the file name
Google also uses the file name to determine what an image is about. That’s why you should also use your focus keyphrase in the file name. It’s simple: if your image shows two rabbits laying in the grass, the file name shouldn’t be DSC3492.jpg, but two-rabbits-laying-in-grass.jpg.
5. Scale your images and reduce file size
Loading times are important for UX and SEO. The faster the site, the easier it is to visit and index a site. Images can have a huge impact on loading times. That’s why you should resize the image to how you want it displayed. For example, if you want to show 250×150 px image, you should scale the image to 250×150 px and not let the page load a full 2500×1500 px image.
Also, make sure that the scaled image is compressed, so it is served in the smallest file size possible. There are several tools available to help you reduce the size of your images, like kraken.io or ImageOptim.