HTML5 Audio Tag Example

Xah Lee, 2010-11-01, 2012-05-19

This page shows you how to embed audio using HTML5's “audio” tags.

Here's a example of embeded audio.

<audio src="i/Bach_WTC1_1_Martha_Goldstein.ogg" controls></audio>

Here's what your browser shows.

Raw file: Bach_WTC1_1_Martha_Goldstein.ogg.

As of 2011-06-24, it works in Firefox 3.6.12, Chrome 7.0, Opera 10.63. (all on Windows)

As of 2012-05-19, it does not work in Safari 5.0.5, IE 9. (probably due to the ogg format.)

HTML5 Audio Tag Attributes

Following are optional attributes.

Note that the attributes {controls, autoplay, loop} do not take any value. Their existence or non-existence defines the behavior. It is incorrect to add a ="true" or ="false" in them. This type of attributes is called “boolean attributes”.

• http://dev.w3.org/html5/spec-author-view/the-audio-element.html#the-audio-element

Test Your Browser

Here's different audio formats, using audio tag.

As of 2012-05-20, m4a (AAC) format is supported by: Chrome, Safari.

As of 2012-05-20, ogg format is supported by: Chrome, Safari, Opera.

MIDI File

Here's MIDI file. They don't seem to be supported by any browser.