When and How to Best Use Alternative Text

All content images should include descriptive alternative text (alt-text) through the alt attribute. For purely decorative and artistic graphics, the alt attribute is set to be empty or null (alt=””) to enable those who use a screenreader or text-only web browser to bypass them. For example, elements such as spacers, bullets, and arrows do not add anything beyond visual emphasis and do not need to be described. People using screen reader software do not need to know that red bullets mark list items. When blank alt-text is used for such images, the software will skip over the image.Some linked images use the title attribute to describe the link for the image in greater detail; this information is displayed in most visual web browsers when the pointing device is placed over a linked image and is also available to those who use a screenreader.

 

 

Also, images that appear alongside text to provide visual emphasis or clarification need not be communicated to nonvisual users. For example, text links are often paired with icons to help people quickly identify the link purpose, such as an arrow next to a “next page” link, or an email icon next to an “email this article” link. In these cases, the text link does a sufficient job of conveying the link function to nonvisual users. Generally, when images are used to reinforce text links, providing the functional equivalent via alt-text only results in redundancy.

 

here’s some great tips for how to use alt-text.

Leave a comment