HTML5 Audio
The <audio> tag plays sound, like music or a podcast, directly in the browser. Add the controls attribute to show the player buttons.
Basic example
<audio controls>
<source src="song.mp3" type="audio/mpeg">
<source src="song.ogg" type="audio/ogg">
Your browser does not support the audio tag.
</audio>The browser picks the first file format that it supports. MP3 works in all modern browsers, so Ogg is only an extra choice.
Attributes of the audio tag
| Attribute | Meaning |
|---|---|
controls | Show the player with play, pause and volume |
autoplay | Start automatically. Most browsers block this for sound |
loop | Play again and again |
muted | Start with the sound off |
preload | How much to load first: none, metadata or auto |
Supported formats
| Format | Type value |
|---|---|
| MP3 | audio/mpeg |
| WAV | audio/wav |
| Ogg | audio/ogg |
Note:
Do not play sound automatically when a page opens. It annoys visitors, and browsers stop it anyway until the visitor clicks on the page.
Summary
- Use
<audio controls>with a<source>tag. - MP3 is the safest format.
- Related: HTML5 Video and HTML Multimedia.
Congratulations! Chapter Finished. Learn more about the similar topics:
| Exercises & Assignments |
|---|
| No Content Found. |
| Interview Questions & Answers |
|---|
| No Content Found. |