Step 1: Understand your goals
- Alternative (alt) text - Appropriate images have alt text (<alt>) that briefly describes them for screen readers. Examples include infographics, charts, and graphs. Many photos and images don’t need alt text: they should be noted as decorative so screen readers skip them. For example, the screenshots on this page are decorative.
- Media - Videos with dialogue have captions, videos with sound but no dialogue have audio descriptions or enhanced captions, and audio-only files have transcripts. If captions are not readily available, a complete transcript of the content of the video is an acceptable short-term alternative.
- Media controls - There is a way to pause, stop, or hide all video, audio, and animation on the page.
- Iframes - Media in inline frames have a title attribute.
- Flashing animation - Animations shouldn’t flash more than 3 times per second.
Image and media accessibility resources
Step 2: Watch the video
Whether you create your own videos or have someone else do it, accessibility is important. Accessible images and video help you engage:
- People with sensory disabilities, such as hearing or visual disabilities
- People in offices, on trains, or in other situations where they can’t listen to audio
As always, accessibility helps more people than you might think access your content!
Step 3: Practice your new skill
Basic tests
- Check to see that all videos:
- Have captions that are timed to match the video
- Do not automatically play on the page
- Verify that audio-only files (like podcasts) have a transcript available for download.
- Use your keyboard to make sure you can access and use all controls in the video or audio player (pause, stop, volume, captions).
- Use the ‘graphics/images’ module in ANDI to verify that all images have descriptive alt text in the ANDI Output field. Decorative images may have “” in the alt field under ANDI Components. That is acceptable for decorative images.
- Alt text should be short and relevant to the image and page.
- Alt text cannot be the same text as an adjacent heading, a file location, or packed with SEO keywords.
- Make sure animation doesn’t:
- Flash more than 3 times per second
- Loop (play multiple times) without a way to stop it
Advanced test
Check for an ‘iframe’ module in ANDI. If present, make sure there is no error in the Accessibility Alerts section. If there is, the iframe needs a title.