viernes, 2 de agosto de 2013

Elemento audio HTML5

Al igual que con el elemento <video>, hasta la llegada del HTML5, no existía ningún estándar para mostrar audios en una web y la mayoría eran mostrados a través de plugins que podían cambiar para los diferentes browsers.

Con HTML5 se define un nuevo elemento <audio> que especifica un método estándar de insertar audios en una web.

Los formatos soportados son mp3, wav y ogg y aquí os dejo una tabla donde se indica qué formato soporta cada browser.


BrowserMP3WavOgg
Internet Explorer 9+YESNONO
Chrome 6+YESYESYES
Firefox 3.6+NOYESYES
Safari 5+YESYESNO
Opera 10+NOYES
YES

SINTAXIS

La sintaxis necesaria para insertar un audio en la web es la siguiente:

<audio controls>
  <source src="audio.mp3" type="audio/mp3">
  <source src="audio.wav" type="audio/wav">
  <source src="audio.ogg" type="audio/ogg">
  Tu navegador no soporta el elemento audio.
</audio>


ATRIBUTOS

Encontramos la mayoría de atributos y elementos iguales al <video>:
  • controls: añade los controles, como los botones play, stop, pausa y volumen.
  • source: el elemento de HTML5 source nos servirá para indicar qué audio queremos reproducir. Podemos indicar varios sources con varios formatos y así el navegador reproducirá el primero que reconozca, ya que todos los navegadores no son capaces de reproducir todos esos formatos
  • track: con este nuevo elemento de HTML5 indicamos las pistas de texto para los audios.

MÉTODOS Y EVENTOS

El elemento <audio> dispone además de atributos una serie de métodos básicos para poder iniciar o pausar, como son play() pause(), además de eventos que nos permitirán controlar aspectos de la reproducción, como el momento de la carga, el aumento del volumen, etc.

Para obtener una referencia completa de las características del elemento <audio> de HTML5 podéis acceder al siguiente link:

No hay comentarios:

Publicar un comentario