Audio HTML5

Audio en la Web

Antes de HTML5, los archivos de audio solo podían ser reproducidos en un navegador web a través de un complemento (plugin como flash). El elemento <audio> especifica una forma estándar para embeber audio en la página web.

El elemento <audio> del HTML5

En el siguiente ejemplo, se muestra como embebemos especificamos una archivo de audio en el HTML5:

<audio controls>
  <source src=""horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
  Tu navegador web no soporta elementos de audio.
</audio>

Como funciona el audio en HTML5

El atributo controls agrega controles de audio, como play, pause y volume.

El elemento <source> permite especificar alternativamente archivos de audio, de los cuales, el navegador web elegirá el primer formato que reconozca.

El texto entre las etiquetas <audio> y </audio> solo se mostrará en navegadores web que no soporten el elemento <audio>.

Soporte de audio en Navegadores Web

En HTML5 hay 3 formatos de audio soportados: MP3, WAV y OGG.

A continuación se listan los navegadores web más populares y su soporte a los diferentes formatos de audio en el HTML5:

Navegador Web	MP3	WAV	OGG
Internet Explorer	Si	NO	NO
Chrome	Si	Si	Si
Firefox	Si	Si	Si
Safari	Si	Si	NO
Opera	Si	Si	Si

Tipos de Media para los formatos de audio HTML

A continuación se listan los formatos de audio y sus tipo:

Formatos	Tipo de Media
MP3	audio/mpeg
OGG	audio/ogg
WAV	audio/wav

Métodos, propiedades y eventos para audio HTML

HTML5 define métodos, propiedades y eventos DOM para el elemento <audio>. Esto permite cargar, reproducir y pausar audios, así como especificar la duración y el volume. También hay eventos DOM que pueden notificar cuando un audio ha iniciado a reproducirse, si se ha pausado, etc.

Etiquetas de Audio HTML5

Etiqueta	Descripción
<audio>	Define contenido de audio.
<source>	Define múltiples recursos de media para elementos de media, como <audio> y <video>.