HTML and CSS Reference
Thus, to provide a cross-browser solution for her users, Maxine needs to supply two
versions of every audio clip: one in MP3 format and the other in Ogg Vorbis format.
Maxine does not want to create a WAV version of her audio clips because that format,
being uncompressed, would not be suitable for streaming audio over the Web.
Exploring Other Audio Formats
Audio formats other than MP3, Ogg Vorbis, and WAV are available to you through the
use of plug-ins. One of the oldest audio formats is the AU format, also called the mu-law
format, which is used primarily on UNIX workstations. AU sound files have 8-bit sample
resolutions, use a sampling rate of 8 kHz, and are recorded in mono. The RealAudio
format was one of the first formats that allowed for streaming audio over low- to high-
bandwidth connections. RealAudio files tend to be much smaller than AU and WAV
files, but the sound quality is usually not as good. Windows Media Player supports the
WMA ( Windows Media Audio ) format. WMA is a proprietary audio format developed
by Microsoft to compete with MP3s, offering comparable or better levels of compression
and audio quality.
Finally, a popular music format is the MIDI ( Musical Instrument Digital Interface )
format, which synthesizes musical sounds through the use of mathematical functions
describing the pitch, length, and volume of each note. MIDI files are much smaller than
music stored in other audio formats: A MIDI composition lasting several minutes is less
than 20 kilobytes in size, while a similar file in WAV format would be several megabytes
in size, and a comparable MP3 would be only several hundred kilobytes in size. However,
the MIDI format is limited to instrumental music and cannot be used for general sounds,
such as speech.
Using the HTML5 audio Element
Maxine has created a 30-second sound clip from the overture of Royal Wedding and
stored it in two sound files named overture.mp3 and overture.ogg . The file is a monau-
ral recording with a sample rate of 44 kHz and a bit rate of 96 Kbps, which she feels is
adequate for use on her Web site. To embed her audio clip under HTML5, you apply the
<audio src=” url ” />
where url specifies the location of the audio file. For example, the code
<audio src=”overture.mp3” />
loads an audio clip from the overture.mp3 file.
Understanding the source Element
Because you have to provide audio clips in both the MP3 and Ogg Vorbis formats, you
must include two sources for the audio element. You can do this by inserting multiple
source elements as follows
<source src=” url1 ” />
<source src=” url 2” />