Media - Audio Controls

Screenshot of a media audio control
Figure 1: Accessible Audio Control Example
  • Audio is a type of media to convey information to the users.
    • Audio SHOULD NOT be played automatically, when a web page gets loaded.
    • Screen reader users CANNOT listen to their screen reader’s voice if the audio plays automatically.
  • If the audio plays automatically, make sure any one of the following things is true:
    • The duration of the autoplaying audio SHOULD NOT be more than 3 seconds.
    • There SHOULD be a way to pause/stop the autoplaying audio within the first 3 controls of the page.
    • There SHOULD be a way to adjust the volume of the autoplaying audio without interrupting the system’s volume.

NOTE:

  • New to accessibility or uncertain of requirements, it will be helpful to review all sections below.
  • Already familiar with requirements, skip to the “Working Example” section for sample HTML, CSS and JavaScript (when needed), along with a working demo.