Search Engine Optimization Tutorial

Coding Image ALT and TITLE Tags

The example shows a section of HTML code which displays an image called vkitchen.jpg.

Note there is both an alt tag and a title tag with the same text. This is how the HTML should look for pictures used on your site.

The ALT tag is indexed by Google and other search engines, who take it as a description of the picture. The picture then appears in Google image search, which is another important way to get visitors to come to your site. The text in the ALT tag is also displayed if the mouse hovers over the image, so that visually impaired people will know what the picture is.

The TITLE tag is needed because the popular Firefox browser does not display the contents of the ALT tag if the mouse hovers over a picture. It does, however, display the contents of the TITLE tag, and thus it is good practice to include both tags.

Some pictures may only be used for spacing, or they may be unimportant ones. For such pictures, use an empty alt tag, and leave out the title tag entirely. An empty alt tag would look like this:

ALT=""