En este nuevo post vamos a ver los atributos de vídeo HTML5 que podemos usar en nuestros desarrollos para controlar nuestros vídeos.
Otros post de HTML5 con una temática similar son:
- Lista de elementos y atributos obsoletos en HTML5
- Los nuevos input HTML5 para formularios
- Los nuevos atributos HTML5 para inputs y formularios
- Listado de las etiquetas HTML5 interactivas
- Las nuevas etiquetas HTML5 semánticas para textos
- Las nuevas etiquetas semánticas de estructura HTML5
Todos los atributos de vídeo HTML5
Vamos con el listado de los atributos de vídeo HTML5 que son casi los mismos que los de audio en HTML5:
- autoplay: Con este atributo se especifica que el vídeo comience automáticamente a reproducirse. Se puede especificar de estas 2 maneras autoplay=”autoplay” o autoplay.
- preload: En caso de omisión su valor es “auto”. Sirve para especificar si queremos que el vídeo se vaya cargando independientemente si se da al play o no. Aumentaría el consumo de ancho de banda pero el usuario tendría menos cortes en la reproducción. Tenemos 3 posibles valores para este atributo:
— preload = “none”: El vídeo no comienza a descargarse hasta que el usuario haga play.
— preload = “metadata”: Solo se cargan los metadatos del vídeo (dimensiones, primer frame, duración…).
— preload = “auto”: El vídeo se descarga independientemente de la ejecución del play. - controls: Con este atributo especificamos si se muestran los típicos controles del vídeo (play, stop, volumen…). Tiene 2 posibles sintaxis: controls=”controls” o controls.
- loop: Especifica la reproducción continua del vídeo, es decir, una vez acabada la reproducción comienza de nuevo a reproducirse. Tiene 2 posibles sintaxis: loop=”loop” o loop.
- poster: URL de la imagen a mostrar cuando el vídeo no está disponible, está cargando y no ha comenzado su reproducción. Por defecto es el primer frame del vídeo.
- height y width: El alto y ancho del vídeo para mostrarse en la web.
- muted: Funcionalidad para quitar el volumen al vídeo.
- mediagroup: Establece un grupo de reproducción al que pertenece el vídeo.
- ‘src’ de la etiqueta source: URL/path del vídeo a reproducir.
Conviene tener en cuenta la etiqueta track para meter subtítulos.