Image Optimization and Alt Text Best Practices

Article by: Matt Polsky

Image SEO isn't something I typically get a ton of call for, but it's definitely something I enjoy testing and playing around with.

In this article, I’m going to run through the basics of image SEO and what best practices you can follow to earn more traffic to your site.

Image Optimization: Where to Begin?

Image optimization, like anything with SEO, works best when you align your signals. What I mean by that is you want your image URL to correspond with the alt text, which should correspond with the title attribute, which should correspond with the caption (if one is there).

Let’s use real estate for an example. If I were selling a home in Columbia, MO, and had an image of the home, it may look something like the following:

<img src="/homes/two-story-columbia-home.jpg" alt="Two story home with red shutters in Columbia, MO" title="Four Bedroom Home for Sale"  />

I began by saving the file to my server with an appropriate URL structure, created alt text descriptive of the image – including keywords like Columbia MO to add more relevance – and finally added a title attribute that brought it all together. Notice how they all have a unified theme, but aren’t duplicated.

Now let's look at each major factor you can control.

Image Alt Text

Alt text's creation stemmed from helping the visually impaired and those who use screen readers. However, when used correctly, alt text contains the ability to provide organic search benefits, which means more exposure for your site, products, posts or even your own name.

However, don't go overboard here; just because it’s image search doesn't mean Google forgets about keyword stuffing or fishy sounding alt text. My best advice is to do what is best for the reader. Think of it this way, in the previous example, if the image was of a for sale sign in front of the home, you immediately know what is happening, so tell it that way in the alt text.

Image Alt Text Best Practices

Alt text should be a natural language description of the image. It shouldn’t surpass a single sentence and from personal testing, it is best to keep it under 8-10 words or around 60-80 characters in length, although 5 or 6 words is usually enough.

If you are using a popular CMS like WordPress, Drupal or Joomla this is easily inputted; however, if you are coding it in HTML, the format should look like what we had in the above example.

What to Avoid when Writing Alt Text

Alt text could be seen as the cross between a title tag and the anchor text of a link. This combination leads to some dos and don’ts and the most common don’ts include:

Don’t stuff keywords

<img src="columbia-missouri-como-mo-65203-home-for-sale.jpg" alt="Columbia MO, COMO, 65203, Missouri Home for Sale | Residence for Sale | Homes Sales"  />
  • Can you tell I'm trying to get home searches in Columbia to see the house?

Limit the length

<img src="columbia-home-for-sale.jpg" alt="Thee bedroom two bathroom home for sale in the Columbia, Missouri area located in the south part of town next to the Break Time gas station that carries Big League Chew"  />
  • This is overkill, and leads in to the next point...

Don’t use alt tags out of context

  • In the previous example, you tell I went way off-base, going beyond what the image was about and into a load of other items that shouldn't be included.

Image Size

If your CMS doesn't do this for you, then be sure to reduce your image file sizes. Just because you downloaded a stock photo at 3600 x 2400, doesn't mean you should use that.

After reducing the size, use Photoshop or any of the major compression tools out there to make the file even smaller. This will help you in more than just image search, but will help your site in general as it will load faster.

XML Sitemap

Another thing you can do is create an image sitemap or include them with your traditional sitemap file as a few of the major SEO plugins out there do. 

The XML sitemap will get your images in front of crawlers quicker, so it's just a good idea to do.


I haven't seen any bump in using srcset yet, but Google is constantly rewarding those who focus on the user, so it's worth keeping in your toolbox. 

Srcset is used for optimizing the delivery of an image across multiple screen resolutions. Basically, you can display a different image, depending on the device, without jumping in your css file. This is pretty useful for hero images, but also very useful for in-content images that need a close-up when you're on a mobile device.


  1. Use a relevant Image
  2. Save the file with a concise, keyword rich name
  3. Use ALT text to describe your image
  4. Reduce image size and compress it
  5. Use XML sitemaps
Copyright 2018