The Importance of Adding Alt Tags and Title Tags to Images on Your Website

There are so many different facets to search engine optimization. Like several other fields of this world, SEO consists of thousands of questions, which have made this field quite confusing.

The Importance of Adding Alt Tags and Title Tags to Images on Your Website

For people who are not experts in SEO it can be a little overwhelming. That said, if you follow the basics you can be very successful in optimizing your website for major search engines like Google, Bing, and Yahoo. One of the biggest oversights that even website designers and website developers make is optimizing images on your website for search engines. Images can make a huge impact on the number of people who visit your website on a regular basis.

People browsing the web use tools like Google’s Image Search routinely. If the images on your website are optimized with the right keywords you can drive a lot of that search traffic to your website. In this article I am going to cover Alt tags, Title Tags, explain how to incorporate optimized images into your website, discuss the benefits of optimizing images with alt tags and title tags, and finally provide you with some tips for driving more traffic to your website with optimized images.

What Are Alt Tags for Images?

Alt Tags or Alt Attributes are “alternative text” for an image. Most of the time alt tags are created to describe the image. When it comes to websites, alt tags are never seen by people reading your website. One thing that they can be used for is for blind people who use audio-based software to navigate the internet. Alt tags help blind people understand what content you are displaying on your website. For the majority of people though, alt tags are simply used for search engines. When search engines crawl your website they use the alt tags to better understand the content of your website so that they can properly index it within the ranks of their search results.

One place that alt tags can be “seen” by people reading your content is through HTML emails. Do you ever receive HTML designed emails from businesses? You know the ones from say Macy’s, Kohl’s, etc.? Sometimes those emails come in and ask you to turn on images. You then have to right-click somewhere towards the top of your email to display the images. Well if you ever scroll through the email before displaying the images you will see an outline where the image is supposed to go and then in the middle of that outline there will be some copy (if alt tags were inserted). That copy is the alt tag for that image.

What does an alt tag in HTML look like? Here’s an example of HTML code for an image with an alt tag.

<img src="http://www.instantshift.com/wp-content/uploads/2012/10/image-title.jpg" alt="Example image alt tag" width="500" height="150" />

Since nobody actually sees these tags, it absolutely makes sense to add them to your images. We will talk more about exactly what copy you should put into your alt tags a little bit later in this article.

What Are Title Tags for Images?

Title Tags are very simply titles for your images. Have you ever been on a website and hovered your mouse over an image when a pop-up appears with some copy? The copy that pops up is the images’ title tag. A title tag has a few different purposes. The main purpose is to provide the reader with a little more information about the image. Title tags can be used with images and when linking out to another web page. You will see title tags appear when you hover your mouse over a hyperlink as well. Different from alt tags in that readers of your website will not see alt tags so you can put in whatever copy you want and it does not have to read as a coherent phrase or sentence. When it comes to title tags they are seen by your readers so you have to make sure that the keywords you use in your title tags actually read as a coherent phrase or sentence.

Title tags should only include three to five words. Some people go nuts and write sentences or paragraphs in their title tags. Keep it short and informative. Remember to include your keywords when coming up with title tags for images. The same SEO juice is applied to title tags as alt tags when search engines are crawling your website. My websites attract hundreds of new visitors each month purely because I optimize all of the images on my website with title tags and alt tags. You should be doing the same with your website.

What does title tag in HTML look like? Here’s an example of HTML code for an image with a title tag. Also, hover your mouse over example image below.

<img title="Example image title tag" src="http://www.instantshift.com/wp-content/uploads/2012/10/image-title.jpg" alt="Example image alt tag" width="500" height="150" />

Example image alt tag

Optimizing Images with Alt Tags and Title Tags for Your Website

Optimizing images on your website and blog with alt tags and title tags should not take that much time, but what it will do is provide your website with a HUGE boost in terms of driving more relevant search traffic to your website. Adding alt tags and title tags to images is extremely easy. It takes an extra few seconds when you add a new image to your site to put in an alt tag and title tag. Below are the steps that you should follow when adding alt tags and title tags to images on your website.

  • Determine what image you want to use (the image should correspond to the subject matter that you’re writing about)
  • Open your keyword list that you use for search engine optimization and find a broad keyword that you can use, as well as, a more long tail keyword – make sure these make sense for the image that you want to insert into your web page.
  • Use the broad keyword for the alt tag (ie. alt=”alt tags SEO”)
  • Use the long tail keyword for the title tag and be sure to add supporting copy to your title tag so that when people hover their mouse over the image they can read your title tag as if it were a well-written phrase (ie. title=”use title tags to increase website traffic”)
  • Save your work and read the page as a Draft. Hover over your image to make sure your title tag is coming through as you want it to
  • That’s it. It’s really that simple!

Benefits of Optimizing Images with Alt Tags and Title Tags

The biggest benefits that you will receive from optimizing your images with alt tags and title tags are as follows:

  • Increased search traffic to your website
  • Higher quality search traffic to your website
  • More engaged website visitors

Optimizing your website with alt tags and title tags does not provide you with a lot of different benefits, but the main benefit of increased search traffic is huge. As I mentioned earlier in the article I receive hundreds of new visitors to my websites simply by optimizing all of the images on my website with alt tags and title tags. Think about that for a second. Are you at a standstill when it comes to increasing traffic to your website? You can probably add 25% more search traffic to your website just by going through your website and optimizing the existing images, plus optimizing all new images that you add from here on out. Image Search is huge these days and you should be taking advantage of it for your website.

Tips for Increasing Website Traffic with Images

As you can probably tell, adding alt tags and title tags to images on your website is not rocket science. There really isn’t a whole lot to it. That said, there are still some things that you should consider when optimizing the images on your website. Below are a few tips for helping you get the most out of optimizing the images on your website.

  • Go through your entire website and optimize all existing images
  • From now on optimize every new image that you add to your website
  • Take a look at your keyword list and start inserting those keywords in all relevant images
  • When it comes to adding title tags remember that readers will see those, so be sure to add keywords, but also do it in a way that reads well and provides your website visitors with more information on the subject for which you’re talking about.
  • Always add alt tags to every image and be sure to use your keywords in alt tags. You don’t have to worry about people seeing them as alt tags don’t show up to your website visitors.
  • Add URLs to your images where applicable so that when people find your images on search engines like Google and Bing they are taken to a relevant page on your website

These tips will help you get started in optimizing your images for search engines. After you go through this exercise I will guarantee that you see your search traffic improve by at least 10% – 15% per month.

Will You Add Alt Tags and Title Tags to Images on Your Website?

Now that you know what alt tags and title tags are, and just how easy it is to add these tags to images on your website, will you take the time to update the images on your website with alt tags and title tags? Will you make it a priority to add alt tags and title tags to ALL new images that you add to your website moving forward? I can’t emphasize enough just how much this simple task will pay off in terms of more search traffic finding your website. Perhaps you have already gone through this exercise and you know just how powerful optimized images with alt tags and title tags can be for your website. If so, I would love it if you would take two minutes to leave a quick comment below for the rest of the readers who might still be on the fence about taking the time to optimize the images on their website with alt tags and title tags. Please take a minute to leave a comment below. Thanks for taking time to read the article. I hope you found it helpful!

Like it? Share it.

10 Comments

  1. Thanks Ryan excellent article. As a creative guy and not a coder this is very useful. Can you give me an example of adding a URL as well to the Alt Tag – what exactly does that look like? Thanks.

  2. Excellent Article – Clean, Clear and Concise.

  3. Good overview article Ryan, thank you. I wrote an email to a client this morning outlining some of these points about alt tags, then about an hour later your article surfaced on my Genieo.com page. I forwarded this page to my client and I’ll be sending the link to other clients in the future.

    Thanks.

  4. I thought this is an old SEO way. However it sounds new and interesting. Maybe it’s time to check the alt tag on my site images.

  5. Thanks Ryan for Article. . .
    whether this way can increase web seo in the picture ..?

  6. I have been implementing this on my website for quite some time. I had a confusion regarding the alt tags

    what is the difference between alt=”your alt tags here” and alt=”your_alt_tags_here”?
    Which one is better?

    Yoast SEO plugin sees the alt tags with and without underscores differently, thus many a times increasing your keyword density, which is not good from search engine perspective!

  7. Excellent article. As a creative guy. Thanks. :)

  8. Superb article – this really helped me – Thank you!

  9. How many alt tags I can use on one page for sepcific keyword?

Leave a Comment Yourself

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>