DESIGNED DEVELOPED DELIVERED

Mob: 07760 392284edward@ee-web.co.uk

ee-web thinks... a bit

Go on, make my day ... leave a comment

Difference between alt and title tags for an image

July 16th, 2014 by Edward

I keep forgetting this, and about once a month end up looking up – so here’s a post, primarily for my memory!

ALT (or Alternative Text) – describes the image in the page, displays if img fails to load (but not in all browsers???). It should be brief and descriptive. For some reason Joomla calls this the image description (which I suppose it is really!) This tag was introduced for visually impaired users and without it you will be penalized in SEO terms.

TITLE – describes the image, a bit like alt- providing ‘additional’ info about the image in a pop up animation on hover (but not in all browsers). Seems its used primarily when an image links to other content, describing where the link is going, but is optional for img. If missed out some browsers display the alt on hover.

Example:
If you are doing a page about Lyme Regis and have Lyme Regis in the title and a cool picture of the cobb and sea you might just do this

<img src="i.jpg" alt="Lymne Regis" />

but it wouldn’t be great because it doesn’t’ tell the ‘visually impaired user’ anything. Much better to do

<img src="i.jpg" alt="View of the Cobb and sea at Lyme regis " />

Leave a space at the end of the alt description “xxx xxx ” – good for screen readers.

categories

Edward owns and runs ee-web design and has been building websites for over 12 years. He is passionate about... most things really

Was this post helpful or interesting? Spread the news.

  1. this is first time i noticed Leave a space at the end of the alt description. anyway this good and new info to me thanks for the update

    Comment by Alts solution — July 17, 2017 @ 7:34 am

Leave a comment

*


tag