This week, Support Lead, Helen Grimbly outlines how to resolve Inconsistent alt text.

Alt text (alternative text) provides assistive technology such as screen readers with the information needed to describe to a user what is on a web page and how to use it. For example alt text can be used to describe (e.g. read out) what an image shows or the purpose of a graphical button.

Sitemorse provides information on images with inconsistent alt text - images which have been used more than once and have not had the same alt text on each occasion. It will very rarely make sense for the same image to have different alt text in different contexts. 

There are instances where alt text can be added but the description is not clear or consistent. In the following example, a document title is being used as the alt text for both an image and the text of the link, which will result in the document title being read out twice. The alt text should provide the same information or function that the image provides, or have empty alt text if the image is purely decorative (alt=""). 

<a href="/media/fees-schedule.pdf"><img src="/images/pdf-icon.gif" alt="Fees Schedule">Fees Schedule</a> 
<a href="/media/terms-conditions.pdf"><img src="/images/pdf-icon.gif" alt="Terms and Conditions">Terms and Conditions</a>

Should be:

<a href="/media/fees-schedule.pdf"><img src="/images/pdf-icon.gif" alt="PDF">Fees Schedule</a> 
<a href="/media/terms-conditions.pdf"><img src="/images/pdf-icon.gif" alt="PDF">Terms and Conditions</a>