Audio, Visual, and Motion Graphics

What is Accessible Media?

Accessible media content refers to creating media that all users can perceive, understand, and interact with audio, video, and motion graphics, regardless of their abilities. The goal is to make media usable for everyone, including those who are blind or have low vision, Deaf or hard of hearing, or have cognitive or learning disabilities.

Some common forms of accessible media include:

How Do Audio, Video, and Motion Graphics Impact Accessibility?

Accessible media is crucial for individuals with various disabilities:

• For users who are deaf or hard of hearing, captions and transcripts provide access to audio content.

• For users who are blind or have low vision, audio descriptions are essential to convey visual information in videos.

• Controls to pause or stop media are vital for users with cognitive disabilities or those who need more time to process information, helping to prevent sensory overload and maintain user control.

• Avoiding auto-playing media prevents disorientation for users who might be using screen readers or have cognitive processing differences.

• Refraining from content that flashes or flickers is critical to prevent triggering seizures in individuals with photosensitive epilepsy.

• Ensuring media players support keyboard navigation and screen readers makes them operable for users who cannot use a mouse or rely on assistive technologies.

What WCAG Success Criteria are Relevant for Audio, Video, and Motion Graphics?

The Web Content Accessibility Guidelines (WCAG) provide specific success criteria for media content to ensure it is accessible to individuals with disabilities.:

• WCAG Success Criterion 1.2.2 Captions (Prerecorded): Requires that captions be available for all prerecorded audio content in synchronized media.

• WCAG Success Criterion 1.2.3 Audio Description or Media Alternative (Prerecorded): Mandates that an alternative for time-based media or audio descriptions be provided.

• WCAG Success Criterion 1.2.5 Audio Description (Prerecorded): States that prerecorded video content should have audio descriptions of essential visual information.

• WCAG Success Criterion 2.1.1 Keyboard: Ensures all content functionality, including media player controls, is operable through a keyboard interface.

• WCAG Success Criterion 2.2.2 Pause, Stop, Hide: Requires that users should be able to pause or stop content, which applies to media like carousels (implicitly, other time-based media).

• WCAG Success Criterion 2.3.1 Three Flashes or Below Threshold: Stipulates that content should not flash more than three times in one second unless the flashes are below specific thresholds.

• WCAG Success Criterion 2.3.3 Animation from Interactions: Advises that motion animation triggered by user interaction should be avoided or have a way to be disabled.

• WCAG Success Criterion 4.1.2 Name, Role, Value: Ensures interactive elements within media players are accessible and understandable to assistive technologies.

How Do I Maximize the Accessibility of Audio, Video, and Motion Graphics?

To ensure media is accessible, follow these best practices:

Provide Text Alternatives

Include captions, transcripts, or audio descriptions for all audio and video content. Be sure captions accurately reflect spoken dialogue and relevant sounds, while audio descriptions narrate essential visual information. 

Avoid Auto-Playing Media

Do not set audio, video, or motion content to auto-play. 

Include User Controls

Provide clear, accessible controls to pause or stop motion, video, or audio content. This is crucial for people who need extra time to process content or who experience motion sensitivity.

Utilize Accessible Media Players

Choose or build media players that natively support keyboard navigation and are compatible with screen readers. Features like play/pause buttons, volume adjustment, and progress tracking should be accessible without a mouse.

Prevent Flashing or Flickering Content

Refrain from using content that flashes or flickers to avoid triggering seizures, ensuring it doesn't flash more than three times per second unless below specific thresholds.

Manage Animations

Avoid or provide a method to disable motion animation that is triggered by user interaction. This helps users with vestibular disorders or motion sensitivity navigate your content comfortably.

How Do I Test the Accessibility of Audio, Video, and Motion Graphics?

Screen Reader

Activate a screen reader (e.g., VoiceOver or NVDA) and navigate media content. Verify that transcripts and audio descriptions are accurately announced. Test that all media player controls are understandable and operable via the screen reader.

Keyboard Navigation

Check that media does not auto-play. Navigate the web page and media player controls using only the keyboard (e.g., Tab, Shift+Tab, Enter, Spacebar). Ensure all media playback controls (play, pause, stop, volume, progress bar) are fully operable without a mouse.

Visual Inspection

Visually inspect your digital content to ensure media does not auto-play and that no flashing or flickering elements that could trigger seizures are present. Additionally, confirm that pause/stop controls are visibly present and functional for all time-based content.