Challenge #6: Alternative Text for Images

The Challenge

Review the website to ensure all images and icons have descriptive alternative (alt) text.

Step-by-Step Instructions:

1. Access the Website:
   Open your website and navigate to various pages where images and icons are used.
2. Examine the Images:
   • Use your browser’s inspect element or accessibility tools to view the alt attributes on images and icons.
   • Alternatively, use a screen reader to see how images are announced.
3. Evaluate Alt Text:
   • Check if the alt text accurately describes the image’s purpose or conveys its meaning.
   • Ensure decorative images have empty alt attributes so they are skipped by assistive technologies.
4. Test for Functionality:
   • Imagine you are a user who cannot see the images. Consider if the provided alt text would allow you to understand the content and context of each image.
   • Compare similar images across the site to see if the descriptions are consistent and informative.

Reflection Questions:

• Clarity: Does the alt text clearly communicate the image’s function or content?
• Contextual Meaning: Would a user who relies on assistive technology understand the role and importance of the image on the page?
• Consistency: Are the alt texts consistent across the site, especially for images that serve similar functions (e.g., icons, buttons)?
• Improvement Areas: Are there any images where the alt text is missing, too generic, or does not capture the intended message?