HTML and CSS Reference
In-Depth Information
fallback content that is nested between its opening and closing tag. An
audio
element
with fallback content would look very similar to its video counterpart:
___________
10
See
http://audiotool.com/app
as an example. Audiotool is a cloud-based application for creating
music that is built on the Adobe Flash Platform.
11
See the Web Audio API at the W3C:
http://dvcs.w3.org/hg/audio/rawfile/tip/webaudio/specific-
<audio controls>
<source src="report.oga" type='audio/ogg; codec-
s="vorbis"' />
<source src="report.m4a" type='audio/mp4; codec-
s="mp4a.40.2"' />
<p>Audio not supported. Download audio files as:
<a
href="report.oga">Ogg</a>,
<a
href="report.m4v">ACC</a>p>
</audio>
Note
If the
controls
attribute is left off, nothing is shown by default!
The difference here to video is that the audio does not have a width and height (it is
possible to adjust the size of the playback bar with CSS), and obviously the format of
the source files is different.
Figure 5-8.
Appearance of the
audio
element in Google Chrome
Audio formats
The audio formats will be for the most part familiar from reading the “Video” section.
The same browser support discrepancies exist as well, not that that is something to cel-
ebrate. Refer to
Table 5-2
in the “Video formats” section and look at the audio codecs
column. Like with video, the Ogg and MPEG-4 container formats can be used, this time
without the video track. Therefore, Ogg audio will work in Google Chrome, Firefox,
and Opera, while MPEG-4 audio will work in Safari, Chrome, and Internet Explorer.
The Ogg format uses the Vorbis codec (WebM uses this for audio also), so when speak-
ing of just audio, the format is referred to as Ogg Vorbis and has the file extension
.oga
Search WWH ::
Custom Search