This excerpt is from a pre-publication version of the book and may not represent the final version of this material.
Being able to add native audio to your web document using HTML5 multimedia couldn’t be easier. Whether you want to share sound snippets, voice recordings, or your own music with users on the Internet, the ability to do so was always available, but achieving it is now easier than before without having to rely on third party plugins.
In chapter 2, you were introduced to the HTML5 elements and attributes that allow you to add audio to your web document. Now it’s time to explore examples of how this is actually done. This chapter does exactly that, explaining, with the aid of examples, how these elements and attributes that you have already met can be used.
But let's first take a brief look at the audio file formats that are available for your use, and how you might convert existing audio from one format to another to use in your web document.
Codecs and File Formats
The plethora of different plugins and formats that are available for encoding multimedia files for presentation on the web could cause a bit of a headache if the particular plugin or audio codec isn’t available on a user’s system.
Different audio codecs can be used to output different audio file formats, a number of which are supported by HTML5.
Ogg Vorbis is an open source, unpatented, free file format created by the Xiph.Org Foundation (http://www.xiph.org/). Because it is free of charge, it tends to be quite attractive as a format to use.
Ogg is the name of the container format and Vorbis is the specific audio compression that it uses. According to the Vorbis website (http://www.vorbis.com), Vorbis files can compress to a small file size and yet still maintain good sound quality. This is ideal for delivery across the web because it reduces bandwidth costs.
This format has proved quite popular among the gaming community with companies like Epic Games, Crystal Dynamics, and EA Games using it to deliver game music.
Ogg Vorbis uses the application/ogg MIME type and audio/ogg codec.
MP3 has rather a misleading name because it’s also known as MPEG-1 or MPEG-2 Audio Layer III. Developed by the Moving Picture Expert Group (http://www.mpeg.org), MP3 differs from Ogg Vorbis in that it is covered under a patent held by Fraunhofer ("http://www.fraunhofer.de/en/), which receives a percentage of each sale.
The MP3 standard does not actually include an exact specification on how to encode MP3, but the standard does specify how to decode the format. This has resulted in many different MP3 encoders, each of which produces audio files of different sound quality.
Despite the patent, MP3 has proved to be one of the most popular audio formats for encoding sound files.
MP3 uses the audio/mpeg MIME type and audio/mp3 codec.
The WAV file format’s proper name is Waveform Audio File Format but is called WAV due to its file extension. WAV is an audio format that was first created by Microsoft and IBM in 1991.
Although it can contain compressed data, it usually doesn’t, which can render rather large file sizes. It is for this reason that its use as a format for delivering audio over the Internet has declined.
WAV uses the audio/wav MIME type and audio/wav codec.
Advanced Audio Coding (AAC) is an audio format that is used by Apple and has been made popular as the default format for their iTunes Store.
It was designed to be the successor to the MP3 format and for this reason usually has a better sound quality than MP3.
AAC uses the audio/aac MIME type and audio/aac codec.
Although mainly used as a video file format (more on that in chapter 4), MP4 can also be used to encode audio only. Like AAC, it has been made popular by Apple, who also uses it to encode some audio files with the .m4a extension.
MP4 uses the audio/mp4 MIME type and audio/mp4 codec.
Now that you know about the different audio formats, let’s look at how they are supported across browsers.