What is Alt Text?
- a short description you add to images in digital content - making sure visible images have a textual representation
Why is alt text important?
- Helps create accessible content for those with visual impairments
- Allows people using screen readers to understand the image.
- Note: adding image captions helps support everyone's understanding
- Improves search engine optimization (SEO), helping images get indexed.
Our Image Standard:
Standard 2: Images
Images include meaningful alternative text. Image placement does not hinder learner navigation.
Why this Standard is Necessary:
Providing meaningful and concise alternative text for images, or marking an image as decorative when appropriate, is essential for helping everyone understand the purpose of the image. This ensures smoother navigation for all users, including those using screen readers, and enhances the overall user experience.
How to Meet This Standard:
- Alt Text: Always provide meaningful and concise alternative text or alternative text and captions for images. This helps everyone understand the image’s purpose.
- Text as Image: Avoid using text as an image unless absolutely necessary. This keeps content accessible.
- Decorative Images: Use decorative images sparingly and tag them correctly to avoid clutter.
Estimated Remediation Time:
Less than 5 minutes for every basic image and 20-30 minutes for every complex image.
Types of Images
Decorative Images
- if there is no educational value you can "mark as decorative"
- The image is redundant based on the surrounding text.
- Eye candy that could be removed without impacting the tone, message, or understanding of content.
- Please think critically before doing so - ensure that this is just for visual interest / decoration
- Marking images as decorative will allow a screen reader to ignore this image
Instructional Images
- Instructional images add value by helping learners better understand content.
- These images require alternative text that explains both what the image is and its purpose.
- Descriptions should be meaningful, concise (around 120 words), and focus on what learners need to know.
- Often these images are complex and a long description may be necessary.
- Captions may also be used so all learners can access the instructional meaning of the image.
What is a Complex Image?
Graphs, groups of images or collages, detailed images, STEM content, historical content, and diagrams, etc. Any image conveying data or very detailed information that is essential for understanding content.
Creating Effective Alt Text:
Things to Keep in Mind
- Keep it simple: Aim for about 120 characters.
- Provide context: What info would be missing if the image could not be seen?
- Be concise but clear: Start broad and objective observations, then add key details.
- Describe what’s visually obvious: Describe features that are immediately noticeable. If an element is common knowledge, it’s fine to state it plainly.
- Consider your audience: Incorporate vocabulary the audience knows or is learning.
- Give Objective Clues, Not Conclusions: Err on the side of describing clues that spark recognition, so viewers can apply their background knowledge.
Steps for Writing Alt-text
- Ask yourself the following? What do I want viewers to get out of this? What is the specific learning objective we are meeting by including the image here? What would a viewer know simply by looking at the image?
- Write or use the ASU Image Generator for a Baseline: Write your first thoughts of "what is this image". If using AI, collect a couple outputs of descriptions from the image generator.
- Don’t start with “image of” but DO include image type if essential for understanding the image.
- Start with the Big Picture and Highlight Defining Details: With question 1 in mind, use your ASU descriptions and refine based on the image objective. Use the discipline-specific vocabulary.
How Artificial Intelligence (AI) Can Help
Resources
Questions?
Any questions! You can always email us at DigitalAccessibility@utsa.edu.
Credits:
Created with images by Prostock-studio - "Colored pillow of fresh fallen autumn leaves" • Kenishirotie - "Hand put down the red tick marking wooden cube for checklist or to do list" • standret - "autumn alley. Beauty world. Carpathians Ukraine Europe" • dudlajzov - "Autumn foliage at busosanseong fortress in Buyeo, Republic of Korea" • Bits and Splits - "Multicolored japanese maple autumnal dry leaves on the ground" • Tony - "New England in the fall " • thayra83 - "Autumn forest with footpath leading into the scene. Autumn background. Copy space. Soft focus"