2 min de lectura

Hasta la fecha dependíamos de una tecnología de terceros para poder compartir material audiovisual: Flash de la compañía Adobe. Es evidente que es una barrera de entrada que un usuario no pueda visualizar en primera instancia todo este contenido hasta que instale en su navegador el plugin flash correspondiente.

De modo que ahora tenemos dos elementos multimedia de HTML5. Con estas nuevas etiquetas la carga de material multimedia es muy sencilla:

  • video
  • audio

Los elementos multimedia nativos de HTML5 son compatibles con AAC, MP3 y Ogg Vorbis para audio y Ogg Theora, WBEM y MPEG-4 para el vídeo.

Elemento multimedia de HTML5 para Video

Las propiedades que se utilizan para video son:

  • type : tipo de archivo o fuente
  • autoplay : reproduce automáticamente
  • controls : muestra los controles de reproducción
  • height : define la altura del reproductor (en píxeles)
  • loop : ejecuta la reproducción en bucle, cuando finaliza vuelve a empezar
  • mute : especifica que la salida de audio del video debería ser silenciado
  • poster : permite poner la url de una imágen antes de que se reproduzca el video
  • pre-load : manda a cargar el video antes de reproducirlo, de este modo al oprimir reproducir, no hay que esperar a que se cargue. Sus valores pueden ser none, metadata y auto
  • src : URL del archivo a reproducir
  • width : define el ancho del reproductor (en píxeles)

Ejemplo de carga de video

Elemento multimedia de HTML5 para Audio

Las propiedades que se utilizan para audio son:

  • type : tipo de archivo o fuente
  • autoplay : reproduce automáticamente
  • controls : muestra los controles de reproducción
  • loop : ejecuta la reproducción en bucle, cuando finaliza vuelve a empezar
  • pre-load : manda a cargar el audio antes de reproducirlo, de este modo al oprimir reproducir, no hay que esperar a que se cargue. Sus valores pueden ser none, metadata y auto
  • src : URL del archivo a reproducir

Ejemplo de carga de audio

Compartir
Líder técnico en equipos de desarrollo de software. Profesor de Desarrollo Web en la Universidad de Guadalajara. Emprendedora. Fundadora y CTO de CORB.mx. Ponente y tallerista. Colaboradora en proyectos de software libre y Open Source. Comprometida con la comunidad y la industria de la tecnología. Enfocada en el empoderamiento de las mujeres.

Deja tus comentarios

This site uses Akismet to reduce spam. Learn how your comment data is processed.