Accessibility: Text Alternatives


This article has not been updated recently and may contain dated material.

Accessibility: Text Alternatives


General Information

Text alternatives are one of the key components in making sure your site is compliant. Text alternatives should be used to explain all non-text information. There are numerous ways to present the text alternative. Listed below are some examples on how to use text alternatives on your site:

All images used on your site must have an alt attribute. If they do not, your site will be inaccessible. More information on compliance can be found here, ADA Compliance Overview.
 

Examples

Example 1

In this example, the content around the image is sufficient enough in helping the user understand the purpose of the image.

ADA example with content included with the image


Example 2

This example is an enhancement to example 1. The enhancement would be that we placed a label inside of the image.

ADA example with label on the image


Example 3

In this example, we've linked the image to another site (mikethetiger.com) within the original site that would help to explain the image.

ADA example linked to another website


Example 4

search google button. <- This button is a functional image from the GROK homepage and it tells what the image links to.

 

Referenced from: www.webaim.org

14982
11/7/2018 3:54:09 PM