Images – Section 508 Accessibility Guidelines
Table of Contents
Non-Text Content – Meaningful Images #
All non-text content that is presented to the user has a text alternative that serves the equivalent purpose.
Content owners are the best resource for text descriptions since they know what information they want the image to convey. Determine alt text by asking, “What text would I put here instead of this picture?”
- Review WebAIM Alternative Text for appropriate use of alternative text.
- Review W3C’s Alt Decision Tree for guidance on how to describe images.
Content/Design Considerations
- All images must have descriptions. Designers should provide (text) equivalent descriptions for images, and pass them along to the developer(s).
Development Considerations
- ALL images must have the alt attribute (even decorative images should be tagged alt=””). IMG must have an alt attribute for valid HTML5.
- The Accessible Name and Accessible Description for images is computed per W3C’s HTML Accessibility API Mappings (HTML-AAM) for images
Non-Text Content – Decorative Images #
All non-text content that is presented to the user should have a text alternative that serves the equivalent purpose; since decorative images do not convey any meaning for any user, they should include a blank alt tag.
Content/Design Considerations
- Identify decorative content so developers can tag it appropriately.
Development Considerations
- Tag decorative images with a blank alt tag.
Images of Text #
If the technologies being used can achieve the visual presentation, text is used to convey information rather than images of text.
- Customizable: The image of text can be visually customized to the user’s requirements;
- Essential: A particular presentation of text is essential to the information being conveyed.
- Logotypes (text that is part of a logo or brand name) are considered essential.
Avoid using images of text. Use text instead.
Name, Role, Value #
For all user interface components (including but not limited to: form elements; links; and components generated by scripts), the name and role can be programmatically determined; states, properties, and values that can be set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies.
Content/Design Considerations
- If the name for a component is not obvious, provide it for the developer.
Development Considerations
- Provide the name, role, state, value of all components.