With this tag you can add audio to your site without the need for plugins. This tag allows ogg (ogg, oga), mp3, wav and AAC audio codecs, although each browser supports different codecs.
|<audio controls> <source src=”demo-audio.ogg” /> <source src=”demo-audio.mp3″ /> </audio>|
This label is similar to
|<video width=”320″ height=”240″ controls autobuffer autoplay preload=”none” poster=”videoframe.jpg”> <source src=”demo-video.mp4″ type=”video/mp4″ /> <source src=”demo-video.ogv” type=”video/ogg” /> </video>|
Functions: controls, autobuffer, autoplay
If the video does not have controls like play or pause, the CONTROLS attribute will cause the browser’s default controls to appear, of course, that depends on whether it’s Opera or Safari for example.
Autobuffer starts loading the video as soon as it loads the page
Autplay starts playing the video as soon as it loads a bit of the buffer
What are codecs? Well, we’re not really going to go into detail because it would be too long, but to make it easy for you; it is a “tool” (so to speak) that allows us to decode the video or multimedia content itself, so that the browser can visualize it visually and correctly to the user.
Here are the codecs that each browser uses and supports:
Chrome – H.264 and Theora (commonly called as OGG Vorbis)
Safari – H.264 and everything you use Quicktime
Firefox – Only Theora
There is something that many wonder; Why does Firefox only support Theora and Safari only H.264? It is still complicated, but summarize everything, is that H.264 is not free software, you have to pay for its use, and let’s say that the Safari (apple) are “money”. On the other hand Theora, as it is free and as Firefox is created by a foundation that supports Free Software, you can imagine.