HTML5 provides native support for audio on webpages.
HTML5 new specifications enables users to have a far more control over audio on webpages.A feature which earlier required support from Adobe Flash.
It allows users and developers to control features like start, stop , Volume control etc.
Common Audio Formats.
MP3: An audio format from MPEG(Moving Pictures Experts Group).
AAC: Advanced Audio Coding , standard format on Iphone,youtube etc.
OGG: An Opencontainer and free audio format.
Using the < Audio > element.
1. The < audio > element enables you to embed(or add) audio files on Webpages.
2. Declare the audio tag, and specify the source attribute with the Audio file location.
Syntax of an Audio embed.
Example of an Audio Embed.Give it a TRY! » The controls attribute displays default user controls for audio player.
Multiple Audio Sources.
Not all browsers support all audio file formats,so inorder to ensure compatability across all browsers list as many audio file formats as possible..
Use type attribute to let the browser know about the type of audio file,for audio formats the syntax is audio followed by the format.
Browser Compatability with Audio Formats.
Adding Attributes to Audio .
1. The attribute autoplay allows users to start playing the audio as soon as it loads.
2. To play the audio file in a loop use the attribute loop .
3. The attribute controls sets the browser's default audio controls.
Audio attribute syntax.Note: Audio_source.ext is the address, name and extension of audio file.
Example: Adding attributes to audio.Give it a TRY! »
|src||Specifies the Source URL of audio.|
|autoplay||Automatically plays the file as soon as it loads.|
|controls||The attribute controls sets the browser's default audio controls.|
|loop||Tells browser to play the audio in loop.|
|muted||If present,the audio is muted initially.|
|preload||Specifies the browser whether to load video in advance or not.
It takes three(3) values.
1. none: Nothing loads until user starts playback
2. metadata :Loads audio's metadata(e.g. length) before playback.
3. auto:Downloads the audio completely as soon as possible. the browser is free to decline the request.This is default behavior.