View
477
Download
1
Category
Preview:
Citation preview
Accessible Images
Wendy ChisholmMatt May
Universal Design for Web Applications
Perceivable
Operable
Understandable
Robust
Perceivable
Perceivable: Overview
Provide function of visual content “alt-text” Captions Transcripts Audio Descriptions
Color contrast
Text Alternatives for Images
• One of the most common mistakes
• One of the easiest to fix
• Many ways to test
• Should replace purpose of the image
• Or if not needed for understanding, “hide” it
• Links are interesting cases
WebAnywherehttp://webanywhere.cs.washington.edu/beta/
<img alt=”UMBC An Honors University in Maryland” />
Suggested
Expected alt-text?
<img alt=”College of Science, Health & Engineering” />
Suggested
Previous screen shot used Firefox Dev Toolbar: https://addons.mozilla.org/en-US/firefox/addon/60
<a href=“...”> Print Friendly Page <img src=“.../images/print.gif” alt=“??”></a>
Suggested alt?
<a href=“...”> Print Friendly Page <img src=“.../images/print.gif” alt=“”></a>
Suggested: null alt-text
Suggestions?
<img src=“images/templates/spacer.gif” width=“200” height=“10” alt=“Spacer images. (Decorative Element)”/>
Suggested
1. Use CSS for layout
2. alt=“” (null alt-text)
Suggestions for the arrow?
Currently<tr> <td width="10" valign="top"> <img src="..." width="7" height="9"> </td> <td valign="top"> <a href="...">B.S. Mathematics</a> </td></tr>
What’s going on here?
<p> <img height=“497” width=“626” src=“words_per_book.jpg”></p>
Not just for HTML
In Acrobat
Suggested
1. Avoid images of text. (please please please)
2. Break into multiple images and text.
3. alt-text for each book cover should be the title of the book
Summary
• If it contributes, give it a text equivalent.
• If it doesn’t, include it via css or null alt-text.
• If it’s an image of words, alt-text=words.
• If it’s a link or button, alt-text=function.
• If it’s in a text link, alt-text=null alt-text.
• Avoid redundancy where possible.
• Avoid images of text (please please please!)
• True for file formats (PDF, Powerpoint, etc)
Recommended