HTML5: Video y Audio

Hasta ahora, el contenido multimedia se integraba en la Web por medio de pluging, la forma más popular era a través de Flash Player de Adobe donde este lo controlaba  y no estaba abierto al desarrollo por parte de la comunidad.

La incorporación de los elementos video y audio en HTML5 resuelven este problema y convierte la multimedia en una parte integrar de una página web, lo mismo que el elemento img. Con HTML5, no existe la necesidad de que el usuario descargue software de terceros para ver su contenido y el reproductor de vídeo o audio es fácilmente accesible via script.

Formatos de contenedor de vídeo

El vídeo en la web se basa en formatos contenedores y códecs. Un contenedor almacena todos los datos necesarios que forman el archivo de vídeo al que se accede.
Los formatos de contenedor de vídeos relevantes para HTML5 son: MPEG-4, Ogg y WebM.

Códecs de vídeo

Un códec de vídeo define un algoritmo para codificar y decodificar un flujo de datos multimedia.
Para el objetivo del vídeo HTML5, nos preocupa la decodificación y reproducción de un flujo de vídeo.
Los códecs de vídeo más pertinentes para HTML5 son: H.264, Theora y VP8.

Códec de audio

Un códec de audio, en teoría, funciona de igual forma que el códec de vídeo, excepto que le preocupa el flujo de sonido, en lugar de los fotogramas de vídeo.
Los códec de audio más pertinentes para el HTML5 son AAC y Vorbis.

EL Código

El código del elemento video y sus atributos: <video src=”example.webm” width=”375″ height=”280″></video>

Ningún vídeo incorporado estaría completo sin proporcionar al usuario la posibilidad de reproducir, pausar, detener, buscar a través de video o ajustar el volumen. El elemento vídeo de HTML5 incluye un atributo controls que hace precisamente esto:

<video src=”example.webm” width=”375″ height=”280″ controls></video>

controls es un atributo booleano, por lo que no necesita ningún valor.

Añadir soporte para múltiples formatos de vídeo

Recurrir a un solo formato de contenedor para servir su vídeo no es actualmente una opción.
Para permitir incluir múltiples formatos de vídeo, el elemento vídeo permite que se definan elementos source para posibilitar que cada agente de usuario muestre el vídeo usando el formato a su elección.

<source src=”example.mp4″ type=”video/mp4″>
<source src=”example.webm” type=”video/webm”>
<source src=”example.ogv” type=”video/ogv”>

Más info en:
HTML5 y CSS3 (Manuales Tecnicos (anaya)) [Tapa Blanda]
Alexis Goldstein (Autor), Louis Lazaris (Autor), Estelle Weyl (Autor): http://bit.ly/GRqRkw

Post: Diana Redondo

Esta entrada fue publicada en HTML5.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s