Search This Blog


Follow me on Twitter


HTML Coding Tip - Image ALT vs TITLE

The search engine spiders appreciate named pictures and crawl better over your site when they are named. To name an image, ALT tags (alternative text - just a label that is used to explain the content of an image) are used within the coding of the image HTML. TITLE tags also perform the same basic function AND can be used for element of the page (not just images) making TITLE tags seem to me the best choice. But wait, there's more. Let's start with a normal picture HTML code that will look something like this:

Example: <img src="http://www.ThePhotoSite/image.jpg">

It used to be that ALT was always chosen above a TITLE tag, but Internet Explorer 7 and Firefox choose TITLE over ALT. Both browsers use TITLE tags as the primary source, but it is still a requirement in some countries and browsers to use the ALT tag. Besides those two conflicting requirements, the most important of all is that ALT tags are still a basic requirement of the W3C WAI guidelines which state that they must be included for accessible websites. So in order for the images on your site to be crawled by all browsers and to be compliant with the guidelines, we must use both the TITLE and ALT tags and create redundant, duplicate text. Talk about inefficiencies!

Each image will have to include both:

Example: <img src="http://www.ThePhotoSite/image.jpg" title="Name of Image" alt="Name of Image" >

I hovered over, took a snapshot, and grabbed a picture from my Decorative Interiors Blogroll site as the example of how it will appear in all browsers since I used both the TITLE and required ALT tags.

example of ALT and TITLE tags

Try hovering over the above image and a different TITLE/ALT tag was used and will display.

There is more HTML required in images and the usage and explanation will be discussed in another post.


Related Posts with Thumbnails