HTML and CSS Reference
In-Depth Information
Table 3-1.
Common Audio and Video File Formats for HTML5
Format
File Extension
MIME Type
Description
.mp3
audio/mp3
MP3
MP3 is possibly the most popular and widely used format
for audio files. The MP3 format was originally designed by
the Moving Picture Experts Group (MPEG) as part of its
specifications. The main reasons some browsers don't
support this format are licensing and patent issues.
.mp4
video/mp4
MP4
Just like MP3, MP4 is a popular web format for videos. The
MP4 standard is a part of MPEG-4. It's widely used by
H.264 codecs; saying that a browser supports MP4 video
actually refers to H.264.
.ogg
audio/ogg
Ogg Vorbis
Ogg Vorbis is a free and open format for audio files.
.ogv
video/ogg
Ogg Theora
Ogg Theora is a format for videos and, just like Ogg Vorbis,
is a free and open standard.
.wav
audio/wav
WAV
WAV or Waveform is a format for audio files. It was
designed for PCs by Microsoft and IBM. WAV is an
uncompressed file format and hence file sizes tend to be
larger.
.webm
video/webm
WebM
WebM is a royalty-free and open video format intended
for use with HTML5. Its development is sponsored by
Google.
Notice the MIME Type column in Table 3-1. You must ensure that your web server has the correct
mapping of file extensions and MIME types. If this mapping doesn't exist, the web server may not serve the
media files, and consequently the web page may not play the audio/video. For example, while using the
development web server that ships with Visual Studio, you may need to add the markup shown in Listing
3-5 to the
web.config
file so that all the file extensions mentioned in Table 3-1 work as expected.
Listing 3-5.
Adding MIME Type Mappings in
web.config
<system.webServer>
<staticContent>
<mimeMap ileExtension=".mp4" mimeType="video/mp4" />
<mimeMap ileExtension=".ogg" mimeType="audio/ogg" />
<mimeMap ileExtension=".oga" mimeType="audio/ogg" />
<mimeMap ileExtension=".ogv" mimeType="video/ogg" />
<mimeMap ileExtension=".webm" mimeType="video/webm" />
</staticContent>
</system.webServer>
As you can see the
<staticContent>
subsection of
<system.webServer>
contains several
<mimeMap>
elements. Each
<mimeMap>
element maps a file extension with its MIME type.
If you're using a stand-alone installation of Internet Information Services (IIS) rather than the Visual
Studio development web server, you can also configure MIME types in the IIS Manager. Figure 3-6 shows
the relevant IIS Manager dialog in Windows 7.
