Insertar sonido y video en una página web

Insertar contenido multimedia en tus

documentos HTML es muy sencillo:

<video src="http://v2v.cc/~j/theora_testsuite/320x240.ogg" controls>
  Tu navegador no implementa el elemento <code>video</code>.
</video>

Este ejemplo reproduce un vídeo de ejemplo, con los controles de reproducción, desde el sitio Web de Theora.

Este es un ejemplo para insertar audio en tu documento HTML

<audio src="/test/audio.ogg">
<p>Tu navegador no implementa el elemento audio.</p>
</audio>

El atributo src puede ser una URL del archivo de audio o la ruta al archivo en el sistema local.

<audio src="audio.ogg" controls autoplay loop>
<p>Tu navegador no implementa el elemento audio</p>
</audio>

Este código de ejemplo usa los atributos del elemento <audio>:

• controls : muestra los controles estándar de HTML5 para audio en una página web.
• autoplay : hace que el audio se reproduzca automáticamente.
• loop : hace que el audio se repita automáticamente.

      <audio src="audio.mp3" preload="auto" controls></audio>

El atributo preload es usado en el elemento audio para almacenar temporalmente (buffering) archivos de gran tamaño. Este puede tomar uno de 3 valores:

• "none" no almacena temporalmente el archivo
• "auto" almacena temporalmente el archivo multimedia
• "metadata" almacena temporalmente sólo los metadatos del archivo

Se pueden especificar múltiples fuentes de archivos usando el elemento <source> con el fin de proporcionar vídeo o audio codificados en formatosdiferentes para diferentes navegadores. Por ejemplo:

<video controls>
  <source src="foo.ogg" type="video/ogg">
  <source src="foo.mp4" type="video/mp4">
  Tu navegador no implementa el elemento <code>video</code>.
</video>

Esto reproduce el archivo Ogg en navegadores que admiten el formato Ogg. Si el navegador no admite Ogg, el navegador usará el archivo MPEG-4. Mira también la lista de los formatos multimedia admitidos por los elementos audio y video en los diferentes navegadores.

También puedes especificar qué codecs requiere el archivo multimedia; de esta forma el navegador tomará decisiones más inteligentes:

<video controls>
  <source src="foo.ogg" type="video/ogg; codecs=dirac, speex">
  Tu navegador no implementa el elemento <code>video</code>.
</video>

Aquí, especificamos que el vídeo usa los codecs Dirac y Speex. Si el navegador implementa Ogg, pero no los codecs especificados, el vídeo no será cargado.

Si el atributo type no está especificado, el tipo de contenido multimedia se obtiene del servidor y se comprueba para ver si el navegador lo puede manejar; si no puede ser mostrado, se comprueba el siguiente source , si ninguno de los elementos source especificados pueden ser usados, un evento de error es enviado al elemento video. Si el atributo type está especificado, es comparado con los tipos que el navegador puede reproducir, y si no es reconocido, no se hace la consulta al servidor; en su lugar, el siguiente source se comprueba una vez.

Especificación del rango de reproducciónEDIT

Al especificar el URI de los medios de comunicación para un elemento <audio> o <video> , puede incluir opcionalmente información adicional para especificar la parte de los medios a reproducir. Para ello, añada una almohadilla ("#"), seguida de la descripción del fragmento de medios.

Un intervalo de tiempo se especifica mediante la sintaxis:

#t=[starttime][,endtime]

El tiempo se puede especificar como un número de segundos (como un valor de punto flotante) o como una hora / minuto / segundo tiempo separado con dos puntos (por ejemplo, 2:05:01 durante 2 horas, 5 minutos y 1 segundo).

Algunos ejemplos:

http://foo.com/video.ogg # t = 10,20

Especifica que el vídeo debe desempeñar el rango de 10 segundos a través de 20 segundos.

http://foo.com/video.ogg # t =, 10.5

Especifica que el vídeo se reproducirá desde el principio a través de 10,5 segundos.

http://foo.com/video.ogg # t =, 02:00:00

Especifica que el vídeo se reproducirá desde el principio a través de dos horas.

http://foo.com/video.ogg # t = 60

Especifica que el vídeo se debe reproducir desde los 60 segundos hasta el final.