Add an audio player — practice exercise

What you'll be asked to do

1. 1.Add an audio playerexercise · easy · 10 min

   Add an audio element with controls.

   Passes when: Add an audio element with controls.

2. 2.Offer two formatsexercise · easy · 10 min · practice plan

   Add two source elements inside audio.

   Passes when: Add two source elements inside audio.

3. 3.Preload metadata onlyexercise · easy · 10 min · practice plan

   Set preload to metadata.

   Passes when: Set preload to metadata.

4. 4.Loop the audioexercise · easy · 10 min · practice plan

   Make the clip repeat.

   Passes when: Make the clip repeat.

5. 5.Add fallback textexercise · medium · 10 min · practice plan

   Include a message for browsers without audio support.

   Passes when: Include a message for browsers without audio support.

6. 6.Fix the player with no controlsbug fix · easy · 8 min

   Without controls the user cannot play anything.

   Passes when: Without controls the user cannot play anything.

7. 7.Fix the wrong elementbug fix · easy · 8 min · practice plan

   Sound belongs in an audio element, not video.

   Passes when: Sound belongs in an audio element, not video.

8. 8.Fix the sources outside the playerbug fix · easy · 8 min · practice plan

   Source elements must sit inside the audio element.

   Passes when: Source elements must sit inside the audio element.

9. 9.Fix the autoplay without controlsbug fix · easy · 8 min · practice plan

   Autoplaying with no controls traps the listener.

   Passes when: Autoplaying with no controls traps the listener.

10. 10.Fix the wrong preload valuebug fix · easy · 8 min · practice plan

    The value should be metadata, not meta.

    Passes when: The value should be metadata, not meta.

Between them these tasks cover audio element, controls and Multiple sources.

Looking for a different chapter? See every practice set, or switch to the interview theory questions.