Images for Disabled Users in Websites
Hi All,
These days I am working on project to provide functionality for accessibility/disabled users in our application. We use many of images as well in our web pages. But problem was that how blind user will be able to identify what this image does. There are few things we tried for different kind of images:-
a) Normal Images :- These are Images which has some meaning in the web pages for example Image of any famous personality, Building, Place, person anything. For these in HTML best way is to use Image tag "alt" attribute and provide some valid text for that image which describes it.
Example:- <img src="images/taj.gif" alt="Tajmahal">
These days I am working on project to provide functionality for accessibility/disabled users in our application. We use many of images as well in our web pages. But problem was that how blind user will be able to identify what this image does. There are few things we tried for different kind of images:-
a) Normal Images :- These are Images which has some meaning in the web pages for example Image of any famous personality, Building, Place, person anything. For these in HTML best way is to use Image tag "alt" attribute and provide some valid text for that image which describes it.
Example:- <img src="images/taj.gif" alt="Tajmahal">
b) Decorative Images :- These are Images which has no meaning in the web pages for disabled users.They are there for making page look good for example Image of bullets, Horizontal space. For these in HTML best way is to use Image tag "alt" attribute and provide a blank value for it. This blank value is two double quotes or single quotes without spaces.
Example:- <img src="images/buttet1.gif" alt="">
c) Link Images :- These images are like normal images but they are bound to do some operation on page. Generally they contains some link with it. Here if we want to convey correct meaning to disabled user need to make sure that alt attribute has correct text which tell user what operation this will perform. Suppose there is some Link image which is for sending mail the alt text should convey that this image is to send email.
Example:- <a href="mailLink"><img src="images/sendmail.gif" alt="Send Email"></a>