E-Marketing in Minneapolis David Vinge, eMarketing Dashboard : SEO Tip: ALT vs. TITLE Attributes For Images in HTML

Tuesday, January 19, 2010

SEO Tip: ALT vs. TITLE Attributes For Images in HTML

The alt attribute should be used to provide alternative content for those who are unable to see the image. People disable images if they have slow connections and images are disabled by default in some email clients, PDAs and phones.  Alt tags should also be used make Web content  accessible to people with disabilities. Keep in mind that search engine spiders are also "disabled".   With Internet Explorer, prior to IE 7, when you moused over an image the alt tag would be revealed as a tool tip.

The title attribute is used to provide additional information about the image, it's generally displayed in a tooltip when site visitors mouse-over the image.

For SEO, alt attributes are weighted heavier than title attributes. Google says  “As the Googlebot does not see the images directly, we generally concentrate on the information provided in the "alt" attribute.”  So for search engine optimization, using the alt attribute is very important. In addition, according to W3C (the World Wide Web Consortium) the use of alt attributes with images is required for valid HTML.

But it would be idea to use both as in <img src="/images/sample-image.jpg" width="125" height="125" alt="" title="Sample image title">. 

In the example above, if images are disabled, “Sample image alt” will appear in its place.  This is what the search engines see.  If you mouse over the image “Sample image title” appears. If you do not want to have this tooltip appear on mouse over, leave the title empty ( title=””).  If you do not include the title attribute, in IE the alt attribute will appear on mouse over.  Note that you don’t always want alt tags to appear if images are turned off, i.e. spacer gifs, use the alt tag but leave it empty.

Don't use it only for search engine optimization
Many sites think that if they use alt text as an SEO tool, they can "fool" the search engines into optimizing their site for a keyword they don't have there. However, this can backfire if the search engine decides you are trying to fake your results and removes you from the results completely.

You are right that Internet Explorer will (wrongly) display alt text as a tooltip when you mouse over an image and if no title attribute is present. If you have an image which needs alt text but no title, you should add a title="" to stop IE from displaying an unwanted tooltip.

In IE, if both attributes are specified, the title tag will override the alt tag and appear as a tool tip. But if images are disabled only the alt tag will appear. If no alt or title tag is specified and images are disabled, the results vary depending on the browser and user settings. Some will show nothing, some will show the file name.

Note that search engines do not "see" images, only alt tags.

We found previously that a search for "crystal farms simply pototoes" returned SP.com first.  A Search for "crystal farms bettern eggs" or "crystal farms allwhites" returned CF.com first.  The major difference was that SP.com has the CF logo on the bottom of every page (except home) with "crystal farms" in the alt tag.  There is no title tag or link title on this logo.

Link titles can also be used with images.

Link titles describe the link and is great for internal linking SEO. It can be used with images and text links. Alt tags describe the image and have always been required for valid coding.

Depending on the browser, if an image includes the link title attribute it can seem like an alt tag when you scroll over it. But to a search engine they do not look that same. A link title is not weighted anywhere near as aggressively as an image alt tag is.

No comments: