Aprenda a insertar vídeo HTML5 en las páginas web y ver una vista previa del vídeo en un navegador.

Dreamweaver permite insertar vídeo HTML5 en páginas web.

El elemento de vídeo HTML5 ofrece un medio estándar para incorporar películas o vídeos en páginas web.

Para obtener más información acerca del elemento de vídeo de HTML, consulte el artículo sobre vídeo HTML5 en W3schools.com.

Insertar vídeo HTML5

  1. Asegúrese de que el cursor se encuentra en la ubicación en la que desea insertar el vídeo.

  2. Seleccione Insertar > HTML > HTML5 Video. El elemento de vídeo HTML5 se inserta en la ubicación especificada.

  3. En el panel Propiedades, especifique los valores para las diversas opciones.

    Origen / Origen alt. 1 / Origen alt. 2: En Origen, introduzca la ubicación del archivo de vídeo. Como alternativa, haga clic en el icono de carpeta para seleccionar un archivo de vídeo del sistema de archivos local. La compatibilidad con formatos de vídeo varía en función del navegador. Si el formato de vídeo de Origen no es compatible con un navegador, se utiliza el formato de vídeo especificado en Origen alt. 1 u Origen alt. 2. El navegador selecciona el primer formato reconocido para mostrar el vídeo.

    Especificación de propiedades de vídeo HTML5
    Especificación de propiedades de vídeo HTML5

    Nota:

    Para añadir vídeos rápidamente a los tres campos, utilice selección múltiple. Al elegir tres formatos de vídeo para el mismo vídeo de una carpeta, se usa como Origen el primer formato de la lista. Los siguientes formatos de la lista se usan para rellenar automáticamente Origen alt. 1 y Origen alt. 2.

    Consulte la tabla que aparece a continuación para obtener más información sobre navegadores y formatos de vídeo compatibles. Para obtener la información más reciente, consulte HTML5 - Browser Support (HTML5: Compatibilidad con navegadores).

    Navegador MP4 WebM Ogg
    Internet Explorer 9 NO NO
    Firefox 4.0 NO
    Google Chrome 6
    Apple Safari 5 NO NO
    Opera 10.6 NO
    • Título: Especifique un título para el vídeo.
    • Anchura (W): Introduzca la anchura del vídeo en píxeles.
    • Altura (H): Introduzca la altura del vídeo en píxeles.
    • Controls (Controles): Seleccione esta opción si desea mostrar en la página HTML controles de vídeo como Reproducir, Pausa y Silencio.
    • Autoplay (Reproducción automática): Seleccione esta opción si desea que el vídeo empiece a reproducirse en cuanto se cargue en la página web.
    • Poster (Póster): Introduzca la ubicación de la imagen que desea que se muestre hasta que el vídeo termine de descargarse o hasta que el usuario haga clic en Reproducir. Los valores de Anchura y Altura (W y H) se rellenan automáticamente al insertar la imagen.
    • Loop (Bucle): Seleccione esta opción si desea que el vídeo se reproduzca continuamente hasta que el usuario deje de reproducir la película.
    • Muted (Silenciado): Seleccione esta opción si desea silenciar la parte de audio del vídeo.
    • Flash Video: Seleccione un archivo SWF para los navegadores no compatibles con vídeo HTML5.
    • Texto adicional: Proporcione el texto que se mostrará si el navegador no es compatible con HTML5.
    • Preload (Precargar): Especifica las preferencias del autor acerca de cómo debe cargarse el vídeo cuando se cargue la página. La selección de Auto carga el vídeo completo al descargarse la página. La selección de Metadata (Metadatos) solo descarga los metadatos después de que haya terminado la descarga de la página.

Previsualizar el vídeo en el navegador

  1. Guarde la página web.

  2. Seleccione Archivo > Vista previa en tiempo real. Seleccione el navegador en el que desea obtener una vista previa del vídeo.

Esta obra está autorizada con arreglo a la licencia de Reconocimiento-NoComercial-CompartirIgual 3.0 Unported de Creative Commons.  Los términos de Creative Commons no cubren las publicaciones en Twitter™ y Facebook.

Avisos legales   |   Política de privacidad en línea