Unidad 10. Multimedia (II)

10.2. Sonido

No es muy habitual incluir sonido en una página web, ya que algunos usuarios suelen estar escuchando su propia música cuando navegan en Internet, por lo que el escuchar también sonido en cada página que se visita puede resultar algo molesto.

A pesar de ello, el incluir un sonido agradable, apropiado al contenido de la página, puede hacerla más atractiva. Las páginas que contienen sonido suelen ofrecer la posibilidad de activarlo o desactivarlo, para que aquellos usuarios que no deseen escuchar el sonido de la página puedan desactivarlo. Siempre es mejor tener esa opción a que el usuario abandone la página.

Los formatos de sonido más habituales en Internet son, fundamentalmente, el MP3 y el WAV, aunque existen otros formatos diferentes que también pueden utilizarse (MIDI). Lo ideal es incluir algún archivo de audio que no ocupe mucho espacio, y que no por ello sea de mala calidad.

Se puede insertar un archivo de audio en un documento de dos formas, con la nueva etiqueta <audio > o mediante un plug-in.

1. Nueva etiqueta <audio>

Hasta hace poco la única forma de insertar audio en una página web era mediante el uso de un plug-in pero desde que apareció HTML5 los navegadores compatibles son capaces de interpretar la etiqueta <audio> que reproduce sonido de una forma estándar sin necesidad de ningún plug-in.

La etiqueta <audio> sólo funcionará en los navegadores compatibles con HTML 5, IE a partir de la versión 9 y las versiones de  Firefox 3.5, Chrome 3.0 y Safari 3.0, además de algunos otros. Afortunadamente, ya son la mayoría.

Puedes insertar un audio con el menú Insertar → Medios opción HTML5 Audio. En el panel Insertar, categoría Medios, encontrarás la misma opción.

 

En la unidad 12 explicaremos con más detalle cómo escribir código HTML desde la vista Código, pero por lo pronto debemos adelantar que a veces es necesario editar la etiqueta <audio> para asegurarnos que todos los navegadores pueden reproducir los archivos de audio que insertamos en nuestras páginas.

La forma de la etiqueta es la siguiente:

<audio>      <source src="archivo sonido" type="MIME-type"/>      </audio>

Si el navegador que usan nuestros visitantes está actualizado, lo más probable es que no tengan problemas para escuchar el audio. Sin embargo, como algunos usuarios pueden utilizar versiones anteriores de diversos navegadores, debemos modificar la etiqueta <audio> para asegurarnos que la reproducción de sonido se va a efectuar sin problemas.

En marzo de 2013, la capacidad de reproducción de audio de diversos formatos (y sus respectivos mime-types) entre los distintos navegadores era la siguiente:

 

Navegador	MP3	WAV	OGG
Internet Explorer 9+	si	no	no
Chrome 6+	si	si	si
Firefox 3.6+	no	si	si
Safari 5+	si	si	no
Tipo MIME	audio/mpeg	audio/wav	audio/ogg

Por ejemplo, el siguiente código se reproducirá en todos los navegadores excepto para quienes usen Firefox en la versión citada:

<audio controls>
  <source src="media/audio.mp3" type="audio/mpeg"/>
  Este navegador no puede reproducir este archivo de sonido. Actualice el navegador
</audio>
        

Si tu navegador no es Firefox 3.6 deberías ver el reproductor de sonido a continuación.

Se suele añadir el atributo controls para que se muestren los controles del reproductor que permiten parar/reanudar y modificar el volumen.

También es bueno añadir un texto para que avise al usuario que su navegador no reconoce la etiqueta.

La solución para evitar las incompatibilidades entre algunas versiones de los distintos navegadores y los diversos formatos de sonido es repetir la instrucción source varias veces para incluir varios tipos de archivos de sonido, de esta forma el sonido se reproducirá en más navegadores.

Por ejemplo

 <audio controls>
   <source src="media/audio.mp3" type="audio/mpeg"/>
   <source src="media/audio.ogg" type="audio/ogg"/>
	<source src="media/audio.wav" type="audio/wav"/>
   Este navegador no puede reproducir este archivo de sonido. Actualice el navegador.
</audio>

De esta forma, si un navegador no puede reproducir el primer archivo de sonido, lo intentará con el segundo o incluso con el tercero.