HTML5 provides a standard for playing audio files.
Audio on the Web
Before the arrival of HTML5, there was no standard present inorder to play audio files on a web page.
Before the arrival of HTML5, audio files can be played with a help of a plug-in (like flash).
The HTML5 <audio> element has specified a standard method to embed audio in a web page.
Browser Support
| Element | |||||
|---|---|---|---|---|---|
| <audio> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
The HTML <audio> Element
For playing an audio file in HTML, use the <audio> element:
Example
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Try it Yourself
HTML Audio - How It Works
The controls attribute is used to add audio controls, like play, pause, and volume.
Text between the <audio> and </audio> tags will be displayed in browsers which does not support the <audio> element.
Multiple <source> elements can be linked to different audio files. The browser will be using the first recognized format.
HTML Audio - Browser Support
At present, 3 file formats are supported for the <audio> element: MP3, Wav, and Ogg:
| Browser | MP3 | Wav | Ogg |
|---|---|---|---|
| Internet Explorer | YES | NO | NO |
| Chrome | YES | YES | YES |
| Firefox | YES | YES | YES |
| Safari | YES | YES | NO |
| Opera | YES | YES | YES |
HTML Audio - Media Types
| File Format | Media Type |
|---|---|
| MP3 | audio/mpeg |
| Ogg | audio/ogg |
| Wav | audio/wav |
HTML Audio - Methods, Properties, and Events
HTML5 is used to define DOM methods, properties, and events for the <audio> element.
This will allow you to load, play, and pause audios, and also set time duration and volume.
Other DOM events are also available which can notify you regarding the audio ie when it will begin to play, is paused, etc.
To have a look at full DOM reference, you can go to DOM Reference of our HTML5 Audio/Video.
HTML5 Audio Tags