Esta es sin lugar a dudas una de las grandes mejoras que todos estaban esperando desde hace mucho tiempo, y es el soporte de video de forma nativa como una forma de reemplazar el molesto plug-in de Flash que hasta hace un tiempo se usaba en tantos lugares, como por ejemplo Youtube, otra gran ventaja es la integración natural con CSS, JavaScript y otras etiquetas de HTML.
Actualmente solo se soportan tres formatos de video:
- Mp4 – Archivos MPEG-4 usando el códec de video H.264 y AAC para el audio.
- Ogg – Archivos Ogg usando el códec de video Theora y Vorbis para el audio.
- WebM – Archivos WebM usando el códec de video VP8 y Vorbis para el audio.
<video width="300" height="200" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
<source src="movie.webm" type="video/webm">
Su navegador no soporta HTML5
</video>
Como pueden ver, permite incluir varios formatos como tipos alternativos en caso de que el navegador del usuario no admita alguno de ellos. Es importante definir el tipo del video en el atributo type, con la finalidad de que el navegador identifique correctamente el archivo multimedia y use el codec adecuado para su reproducción.
Se han definido algunos atributos nuevos que se pueden utilizar en la etiqueta de vídeo que también son comunes a la etiqueta de audio, como el atributo loop que indica reproducción continua y atributo autoplay que define la reproducción automática.
El atributo poster indica qué imagen se mostrará durante la carga inicial del vídeo y al final de su reproducción, mientras que controls se utiliza para indicar que queremos que el navegador muestre los controles automáticamente.
El atributo preload se puede utilizar para descargar el vídeo en segundo plano en cuanto se carga la página aunque no haya empezado a reproducirse.
<video controls="controls" autoplay="autoplay" poster="star.png" loop="loop">
......
</video>
No hay comentarios:
Publicar un comentario