MP Web Studio
HTMLFoundation track
38 / 120

LESSON 38 OF 120

Repair: controllable audio

Add audio with controls and a declared source.

Official sourceWHATWG HTML — audioReviewed: 2026-08-26
STEP 1 · LEARN

How it works

Add audio with controls and a declared source. Semantic structure should describe meaning, not visual appearance.

Correct example
<audio controls><source src="presentation.mp3" type="audio/mpeg">Your browser cannot play this audio file.</audio>

controls exposes playback controls. source declares the file address and type, while the text inside audio provides fallback information.

Common mistake
<audio><source type="audio/mpeg"></audio>

The user gets no controls and source has no src. The browser does not know which file to load.

STEP 2 · APPLY

Your exercise

Repair the example without changing its purpose. Add audio with controls and a declared source.

STEP 3 · BUILD

Write and see the result

index.htmlHTML
Safe resultisolated
The draft stays only in this browser.HTML and CSS allowed · scripts and network blocked
STEP 4 · CHECK

What needs to pass

0%not checked
  • The audio element provides controls.
  • The audio source has src and type.
Explain the solution logic

Add controls to audio, then complete source with the file address in src and its MIME type in type.