Mobile and HTML5 Audio

As a music super listener who listens to thousands of albums every year, I did a little research on mobile browser HTML5 audio support. In HTML5, an audio element represents a sound or audio stream. And the syntax to use it look like below:


Browser support and current practice
Below is the test result of the audio support in popular mobile browsers.

Codec support in modern mobile browsers
Browser Ogg Vorbis MP3 WAV
Android webkit
Opera Mobile
Firefox Mobile
iOS Safari

As shown in the result, the support has be largely inconsistent, this can be quite troublesome for someone doing cross-browser audio streaming, one way you can do it is to use multiple tracks, if a browser can’t recognize a track in the first source tags, it will just try the next one. As we can see from the table above, the most widely support format is mp3, only not supported by Firefox, for Firefox, we can use ogg, so the following code is more cross mobile browser.


About polyfills
And you may ask how about browsers don’t support HTML5 audio tags? There are audio polyfills, but generally, I don’t see a point of using polyfills for mobile audio, one reason is because these polyfills are made out of Flash, and Flash Lite is only supported on limited mobile devices like Symbian.

Problems and Future
The current audio element is lack of a client-side API. W3C AUDIO WORKING GROUP was set up to address this issue. The API will support the features required by advanced interactive applications including the ability to process and synthesize audio streams directly in script. You can subscribe to participate in discussion at: public-audio-request@w3.org.

HTML5 audio

HTML5 audio

References
To learn more about HTML5 Audio in Desktop browsers, you can visit Native Audio in the browser
WHATWG’s official description about audio tag

Be Sociable, Share!

About Shi Chuan

I am a web developer.
This entry was posted in Mobile and tagged , . Bookmark the permalink.

3 Responses to Mobile and HTML5 Audio

  1. RVS says:

    any idea about video support?

  2. audio mobil says:

    Wonderful work! This is the type of information that are supposed to be shared around the web. Disgrace on Google for no longer positioning this put up higher! Come on over and visit my website . Thanks =)

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>