Embedding MediaThat all seems easy enough, and it is, except for one significant problem: browsers don’t all agree on
which audio formats they support.
The most popular and ubiquitous audio format is MP3 (short for MPEG layer 3), which is patent-
encumbered. Safari, Chrome, and IE will play MP3 audio, but Firefox and Opera won’t. Ogg Vorbis is a
free and open audio format, supported by Firefox, Opera, and Chrome, but not by Safari or IE (note that
Chrome supports both MP3 and Ogg Vorbis). The unfortunate consequence of all this format and codec
and patent business is that to reach the majority of web users, you’ll have to offer your audio in at least two
formats.
The audio element may contain one or more source elements, like you see in Listing 5-3, each pointing
to a different audio source (you’ll find more detail on the source element elsewhere in this chapter). A
browser will play the first audio source it supports and will simply ignore the rest, and if it doesn’t support
any of the offered formats it will play nothing. This lets you offer the same piece of audio in both MP3 and
Ogg Vorbis formats, covering the majority of browsers on the market.
Listing 5-3. An audio element offering the same sound in two file formats
This still doesn’t address the problem of older browsers that don’t support HTML5 embedded audio at all.
For them, you can still offer a Flash-based player using tried and true plug-in embedding, something like
you see in Listing 5-4 (you’ll meet the object and param elements later in this chapter).
Listing 5-4. An audio element with a Flash fallback for older browsers
Browsers that don’t support the audio element will simply ignore it, and, assuming they have the Flash
plug-in installed, will instead embed the plug-in player. And for browsers that support neither HTML5 audio
nor Flash, you can at least provide an ordinary text link to download the file directly by including some
plain HTML content inside the object element, offering a fallback within a fallback: