You include images in your articles to get people to read your text. Well-chosen images also strengthen your message. You shouldn’t forget to give those images good alt attributes: alt tags and title tags strengthen the message towards search engine spiders and improve the accessibility of your website. In this post I’ll explain all about alt tags and title tags and why you should optimize those.
What are alt tags and title tags?
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 have an image that’s used as a button to buy product X, the alt text would say: “button to buy product X”.
The alt tag is used by screen readers, the 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 case of an image button, the button 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 otherwise won’t know what the image is for. A title attribute is not required. It can be useful but in most cases, leaving it out shouldn’t be 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 it, give it 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, in their article about images, has a heading “Create great alt text”. This is not a coincidence, Google places a relatively high value on alt texts to determine what is on the image but also to determine the topic of surrounding text. This is why, in our Yoast SEO content analysis, we have a check specifically to see whether 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 specifically not saying you should spam your keyword into every alt tag. You need a good, high quality, related image for your posts in which 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 just hover to see them. As you can see those are fairly long and descriptive alt texts. That’s what a good alt text looks like.
If your image is an image of a specific product, include both the full product name and the products product ID in the alt tag, so it can be easily found. In general: if a keyword would be useful for finding something that is on the image, include it in the alt tag if you can.
alt and title attributes in WordPress
When you upload an image in WordPress, you can set a title and an alt attribute. By default it uses the image filename in the title attribute, which, if you have no alt attribute, it copies to the alt attribute. This is better than writing nothing but it’s actually rather poor. You really should take the time to craft a proper alt text for every image you add to a post. The interface makes it rather easy, click an image, hit the edit button, and you’ll be shown an interface like 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 and visually challenged users will also like you all the more for it.
Read more?
We have a popular (and longer) article about Image SEO. That post goes into a ton of different things to optimize about images, but is relatively terse when it comes to alt and title tags. This article can be seen as an add-on to that article, and I fully recommend reading that after you’re done with this article.
Source:: SEO
