HTML Audio
Audio can add useful spoken information, but it should not interrupt a visitor or become the only way to access instructions. Native controls and a transcript are a good starting point.
How it works
- Use audio controls to expose playback controls. Provide one or more source elements for files your target browsers can decode.
- preload="none" asks the browser to avoid preloading media, while metadata requests limited information. Network behaviour still depends on the browser.
- Keep transcripts accurate and identify speakers or meaningful sounds when they affect comprehension. Use descriptive links rather than “click here”.
A practical example
<audio controls preload="none">
<source src="media/tool-care.mp3" type="audio/mpeg">
<p>Your browser cannot play this recording. <a href="media/tool-care.mp3">Download it</a>.</p>
</audio>
<p><a href="tool-care-transcript.html">Read the tool-care transcript</a></p>
Supply the recording and its transcript. The visible text link offers a direct route to the information for someone who cannot or does not want to listen.