6.1 Introducción a la etiqueta video
En HTML5 se introduce la interesante posibilidad de mostrar videos directamente desde nuestro navegador. De hecho, si arrastramos un video a la ventana del navegador, veremos que comienza a reproducirse en él. Para poder insertar videos en nuestras páginas HTML tenemos que utilizar la etiqueta VIDEO, que junto a la etiqueta SOURCE podremos utilizar estas capacidades multimedia de HTML5.
6.2 Atributos de la etiqueta VIDEO
La siguiente tabla enumera los atributos de la etiqueta VIDEO:
| Atributos | Descripción |
|---|---|
| src | Donde colocamos la url del vídeo que se va a reproducir. |
| preload | Indica como realizará la precarga del vídeo. |
| poster | Imágen que aparecerá por encima del vídeo antes de que se reproduzca |
| autoplay | Indica si el vídeo se reproducirá automáticamente o no. |
| loop | Definimos si el vídeo se repite una vez se termina o no (bucle). |
| muted | Indica si el audio del vídeo está silenciado o no por defecto. |
| controls | Muestra los controles de reproducción del vídeo. |
| width | Indica la anchura que tendrá el vídeo. |
| height | Indica la altura que tendrá el vídeo. |
6.3 Formatos de vídeo
La etiqueta VIDEO es compatible con las siguientes extensiones de vídeo:
- mp4
- WebM
- AV1
- HEVC
- OGV
- MKV
- avi
6.4 Vídeo alternativo
Si utilizamos la etiqueta VIDEO como etiqueta contenedora, podemos incluir etiquetas SOURCE en su interior para proporcionar formatos alternativos y tener mayor compatibilidad con otros navegadores y navegadores antiguos que no soporten HTML5:
<source src="video.mp4" type="video/mp4" />
<source src="video.webm" type="video/webm" />
<source src="video.ogv" type="video/ogg" />
<img src="imagen.png" alt="Video no soportado" />
Su navegador no soporta contenido multimedia. </video>
