Including audio on a page is pretty simple. We can just include the following markup in the page and we have an audio player instantly:
<audio controls>
<source src="../assets/mymusic.mp3" type='audio/mpeg; codecs="mp3"'/>
<p>Audio is not supported in your browser.</p>
</audio>
The audio element
The preceding example specifies an audio element with an attribute of controls telling the browser to have an audio player with native controls for playback. Inside this element, there is a source element and a paragraph element. The source element specifies the source of the audio and its type. The attribute src on the source element is the relative location of the audio, and the type attribute specifies the MIME type and codec of the source. Lastly, we have a paragraph element, just in case the audio element is not supported.
This example is perfect to demonstrate how easy it is to have media on our pages, except it's not always as...