Adding images to your articles encourages people to read them, and well-chosen images can also back up your message. But you should always remember to give your images good
alt attributes: alt tags and title tags strengthen the message of your articles with search engine spiders and improve the accessibility of your website. This article explains all about alt tags and title tags and why you should optimize them.
Note: the term “alt tag” is a commonly used abbreviation of what’s actually an alt attribute on an
img tag. The alt tag of any image on your site should describe what’s on it. Screen readers for the blind and visually impaired will read out this text and therefore make your image accessible.
alt tags and
This is a complete HTML image tag:
<img src=“image.jpg” alt=“image description” title=“image tooltip”>
The alt and title attributes of an image are commonly referred to as alt tag or alt text and title tag – even though they’re not technically tags. The alt text describes what’s on the image and the function of the image on the page. So if you are using an image as a button to buy product X, the alt text should say: “button to buy product X.”
The alt tag is used by screen readers, which are browsers used by blind and visually impaired people, to tell them what is on the image. The title attribute is shown as a tooltip when you hover over the element, so in the case of an image button, the image title could contain an extra call-to-action, like “Buy product X now for $19!”.
Each image should have an alt text, not just for SEO purposes but also because blind and visually impaired people won’t otherwise know what the image is about, but a title attribute is not required. It can be useful but in most cases, leaving it out shouldn’t be too much of an issue.
But what if an image doesn’t have a purpose?
If you have images in your design that are purely there for design reasons, you’re doing it wrong, as those images should be in your CSS and not in your HTML. If you really can’t change these images, give them an empty alt attribute, like so:
<img src="image.png" alt="">
The empty alt attribute makes sure that screen readers skip over the image.
alt text and SEO
Google’s article about images has a heading “Create great alt text”. This is no coincidence because Google places a relatively high value on alt text to determine not only what is on the image but also the topic of the surrounding text. This is why, in our Yoast SEO content analysis, we have a feature that specifically checks that you have at least one image with an alt tag that contains your focus keyword.
Yoast SEO has the following three stages for images and their alt text in your posts:
We’re definitely not saying you should spam your keyword into every alt tag. You need good, high quality, related images for your posts, where it makes sense to have the focus keyword in the alt text.
If you look at the three images above, they have the same alt and title tags so you can hover to see them — you’ll see each of them has fairly long and descriptive alt text. That’s what a good alt text looks like.
If your image is of a specific product, include both the full product name and the product ID in the alt tag so that it can be more easily found. In general: if a keyword could be useful for finding something that is on the image, include it in the alt tag if you can.
title attributes in WordPress
When you upload an image to WordPress, you can set a title and an alt attribute. By default, it uses the image filename in the title attribute, which, if you don’t enter an alt attribute, it copies to the alt attribute. While this is better than writing nothing, it’s pretty poor practice. You really need to take the time to craft a proper alt text for every image you add to a post. The interface makes it easy: click an image, hit the edit button, and you’ll see this:
There’s no excuse for not doing this right, other than laziness. Your (image) SEO will truly benefit if you get these tiny details right. Visually challenged users will also like you all the more for it.
Read more about image SEO?
We have a popular (and longer) article about Image SEO. That post goes into a ton of different ways to optimize images but is relatively lacking in detail when it comes to
title tags – think of this as an add-on to that article. I recommend reading it when you’re done here.