The following HTML5 code shows how to utilize the HTML5
audio
element that plays audio files for the user
without any plugins installed in your browser.
<audio preload controls>
<source src='sound.ogg'/>
<source src='sound.mp3'/>
<p> <!-- paragraph displays if audio element not supported -->
<a href='sound.ogg'>Download <i>ogg</i> File</a>,
<a href='sound.mp3'>Download <i>mp3</i> File</a>
</p>
</audio>
A couple of remarks. If you need only one source file, the
src
attribute may b put directly into the
audio
element. You need several source
elements if the browser doesn't recognize but one,
the others are alternatives. The browser will use the
first that it recognizes.
The paragraph inside the audio
element will
only display if the browser does not yet support the
audio
element of HTML55. It supplies links
to facilitate downloading the sound files for offline
replay.
The attributes on the audio
element,
preload
, and controls
, instruct the
browser to preload the file before starting replay, and
to supply rudimentary controls for the replay. Please
do remember never to include audio or video on your pages
without giving your user the possibility of not having
to see or hear it. It is considered extremely bad
usability.