Cómo integrar de vídeo en una página web html5

los vídeo elemento es una de las características más esperadas del HTML5. Con esta etiqueta, puede incrustar vídeos en una página web sin necesidad de un plug-in como Flash. El siguiente código incluye un mensaje útil para los usuarios que no pueden ver el vídeo de lo esperado:

los etiqueta en sí es bastante sencillo de entender, pero la implementación real es algo complejo. HTML5 indica una vídeo etiqueta, pero no especifica qué formato el navegador apoyará, y, por supuesto, todos los fabricantes de navegadores tienen una opinión diferente sobre el formato que debe soportar. Los tres principales formatos de vídeo en contienda son

  • Ogg / Theora / Vorbis: Ogg es un formato contenedor que utiliza Vorbis codificación para la codificación de audio y Theora para el vídeo. El sistema Ogg es no comprometido por ninguna de las patentes conocidas. Está soportado por Firefox, Chrome y Opera. (También se apoya en Safari si el usuario ha instalado el plugin Vorbis a QuickTime.) IE9 no es compatible con este formato.

  • MP4 / H.264 / AAC: El estándar MP4 es un formato contenedor utilizando H.264 para la codificación de vídeo y AAC para la codificación de audio. Los tres formatos están sujetos a restricciones de patentes. Este formato es compatible con Safari, Chrome, iPhone, IE9, y Android.

  • WebM / VP8 / Vorbis: WebM es un estándar relativamente nuevo introducido por Google. Utiliza el formato de codificación de vídeo VP8 y codificación de audio Vorbis. Hay poco apoyo para WebM todavía, pero la mayoría de los navegadores están indicando soporte para el formato en las próximas versiones.

Utilizar el etiqueta para incluir todos los principales formatos de vídeo. (Puede utilizar la herramienta de FFmpeg libre disponible para todas las principales plataformas de software para convertir sus vídeos.) Como opción final, utilice el etiqueta dentro de su etiqueta para cargar el video con un reproductor de Flash.

Se puede utilizar javascript para controlar el vídeo elemento.

Artículos Relacionados