HTML and CSS Reference
In-Depth Information
Let's take a closer look at these formats:
.aac
Lossy compression scheme developed as an improvement over MP3, with similar
bit rates but better sound quality
.mp3
Patented yet popular format that uses lossy compression to achieve file sizes one-
tenth of noncompressed
.ogg
Open source alternative to
.mp3
that also uses a lossy compression format
.wav
Proprietary format for audio that does not utilize any compression
.webm
Google's open, royalty-free media format, which relies on the Vorbis audio
codec for compression
Integrating multiple sources
In terms of which format to choose, the reality is that if you want your content to reach
the widest possible audience you have to encode and include
multiple
audio files in
your HTML5
audio
element. Fortunately, HTML5 does allow this.
When using the
source
element in
audio
, the
src
attribute is dropped.
src
only comes into play (pun intended) if you are referencing a
single
audio format.
In terms of best practices, it's recommended that you minimally include the
.ogg
royalty-free format
and
either the
.mp3
or
.wav
format. This type of approach should
cover your bases with the latest browsers:
<audio controls>
<source src="audio.
ogg
">
<source src="audio.
mp3
">
Download <a href="audio.ogg">episode 42 of Learning to Love HTML5</a>
</audio>
Preloading the audio
audio
has several attributes that allow you to configure your audio implementation.
For a full description of the attributes available for HTML5 media
elements, see the WHATWG standard:
http://www.whatwg.org/specs/
utes
.
