Seleccione Insertar > HTML > Flash Video.
Última actualización el
25 sept. 2023
Aprenda a incrustar vídeos en páginas web y a insertar archivos FLV en Dreamweaver.
Incrustación de vídeos en páginas web (HTML5)
HTML5 admite etiquetas de vídeo y audio que permiten al usuario reproducir archivos de vídeo y de audio en un navegador sin utilizar complementos ni reproductores externos. Dreamweaver admite sugerencias para el código para la adición de etiquetas de vídeo y audio.
La Vista en vivo muestra el vídeo para ofrecer una vista previa del vídeo que está incrustando en la página web.
Nota
Aunque puede incrustar cualquier vídeo en la página web, la Vista en vivo no siempre muestra todos los vídeos. La compatibilidad con las etiquetas de audio y de vídeo se consigue en Dreamweaver mediante el complemento QuickTime de Apple. En Windows, si no está instalado el complemento QuickTime de Apple, la página web no mostrará el contenido multimedia.
Para saber cómo insertar vídeo HTML5, consulte insertar vídeos HTML5 en Dreamweaver.
Inserción de archivos FLV
Inserción de archivos FLV
Puedes añadir fácilmente vídeo FLV a tus páginas web sin usar la herramienta de creación Flash. Para poder empezar, debe disponer de un archivo FLV codificado.
Dreamweaver inserta un componente SWF que muestra el archivo FLV; cuando se ve en un explorador, este componente muestra el archivo FLV seleccionado, así como un conjunto de controles de reproducción.
Dreamweaver te ofrece las siguientes opciones para entregar vídeo FLV a los visitantes del sitio:
Descarga progresiva de vídeo
Descarga el archivo FLV en el disco duro del visitante del sitio y después lo reproduce. Sin embargo, a diferencia de los métodos tradicionales de entrega de vídeo de «descargar y reproducir», la descarga progresiva permite que el archivo de vídeo empiece a reproducirse antes de que se complete la descarga.
Flujo de vídeo
Transfiere el contenido de vídeo y lo reproduce en una página web transcurrido un breve periodo de búfer que garantice una reproducción fluida. Para activar el flujo de vídeo en las páginas web, debe tener acceso a Adobe® Flash® Media Server.
Debe contar con un archivo FLV codificado para poder utilizarlo en Dreamweaver. Se pueden insertar archivos de vídeo creados con dos tipos de códecs (tecnologías de compresión y descompresión): Sorenson Squeeze y On2.
Al igual que sucede con los archivos SWF, al insertar un archivo FLV, Dreamweaver inserta código que detecta si el usuario dispone de la versión correcta de Flash Player para ver el vídeo. Si el usuario carece de la versión correcta, la página muestra contenido alternativo que solicita al usuario que descargue la versión más reciente de Flash Player.
Nota
Para ver archivos FLV, los usuarios deben tener instalado en sus equipos Flash Player 8 u otra versión posterior. Si un usuario no tiene instalada la versión necesaria de Flash Player pero tiene instalada la versión Flash Player 6.0 r65 u otra posterior, el navegador mostrará un instalador express de Flash Player en lugar del contenido alternativo. Si el usuario rechaza la instalación express, la página mostrará el contenido alternativo.
Para obtener más información sobre el uso de vídeo, visite el Centro de tecnología de vídeo en www.adobe.com/go/flv_devcenter_es.
Inserción de un archivo FLV
En el cuadro de diálogo Insertar FLV, seleccione Descarga progresiva o Vídeo en streaming en el menú emergente Tipo de vídeo.
Complete el resto de las opciones del cuadro de diálogo y haga clic en Aceptar.
Nota
Microsoft Internet Information Server (IIS) no procesa etiquetas de objeto anidadas. Para páginas ASP, Dreamweaver usa código object/embed anidado en lugar de código object anidado al insertar archivos SWF o FLV.
Establecer opciones para vídeo de descarga progresiva
El cuadro de diálogo Insertar FLV te permite establecer opciones para la entrega de descarga progresiva de un archivo FLV insertado en una página web.
Seleccione Insertar > HTML > Flash Video (o haga clic en el icono Flash Video en la categoría HTML del panel Insertar).
En el cuadro de diálogo Insertar FLV, selecciona Vídeo de descarga progresiva en el menú Tipo de vídeo.
Especifique las opciones siguientes:
URL
Especifica una ruta de acceso relativa o absoluta al archivo FLV. Para especificar una ruta relativa (por ejemplo, mypath/myvideo.flv), haz clic en el botón Examinar, navega hasta el archivo FLV y selecciónalo.Para especificar una ruta absoluta, escribe la URL (por ejemplo, http://www.example.com/myvideo.flv) del archivo FLV.
Aspecto
Especifica el aspecto del componente de vídeo. Aparece una vista previa del aspecto seleccionado debajo del menú emergente Aspecto.
Anchura
Anchura del archivo FLV, en píxeles. Dreamweaver determina la anchura del archivo FLV y podrá verla automáticamente en este campo.
Altura
Altura del archivo FLV, en píxeles. Dreamweaver optimiza automáticamente la altura del archivo FLV y podrá verla aparecer en este campo.
Nota
Total con aspecto es el valor del ancho y alto del archivo FLV más el ancho y alto del aspecto seleccionado.
Restringir
Mantiene la misma relación de aspecto entre la anchura y la altura del componente de vídeo. Esta opción está activada de forma predeterminada.
Reproducción automática
Especifica si reproducir el vídeo cuando se abra la página web.
Rebobinado automático
Especifica si el control de reproducción vuelve a la posición inicial después de que el vídeo termine de reproducirse.
Haz clic en Aceptar para cerrar el cuadro de diálogo y añadir el archivo FLV a tu página web.
El comando Insertar FLV genera un archivo SWF de reproductor de vídeo y un archivo SWF de apariencia que se usan para mostrar tu contenido de vídeo en una página web. (Para ver los nuevos archivos, es posible que tengas que hacer clic en el botón Actualizar del panel Archivos.) Estos archivos se almacenan en el mismo directorio que el archivo HTML al que estás añadiendo contenido de vídeo. Cuando cargas la página HTML que contiene el archivo FLV, Dreamweaver carga estos archivos como archivos dependientes (siempre que hagas clic en Sí en el cuadro de diálogo Poner archivos dependientes).
Configuración de opciones para flujo de vídeo
El cuadro de diálogo Insertar FLV te permite establecer opciones para la descarga de vídeo en flujo de un archivo FLV insertado en una página web.
Seleccione Insertar > HTML > Flash Video (o haga clic en el icono Flash Video en la categoría HTML del panel Insertar).
Seleccione Flujo de vídeo en el menú emergente Tipo de vídeo.
URI de servidor
Especifica el nombre del servidor, nombre de aplicación y nombre de instancia con la forma rtmp://www.example.com/nombre_aplicacion/nombre_instancia.
Nombre de flujo
Especifica el nombre del archivo FLV que quieres reproducir (por ejemplo, mivideo.flv).La extensión .flv es opcional.
Aspecto
Especifica el aspecto del componente de vídeo. Aparece una vista previa del skin seleccionado debajo del menú elemento emergente Skin.
Anchura
Anchura del archivo FLV, en píxeles. Dreamweaver determina la anchura del archivo FLV y rellena automáticamente la anchura en este campo.
Altura
Altura del archivo FLV, en píxeles. Dreamweaver determina la altura del archivo FLV y rellena automáticamente la altura en este campo.
Nota
Total con aspecto es el valor del ancho y alto del archivo FLV más el ancho y alto del aspecto seleccionado.
Restringir
Mantiene la misma relación de aspecto entre el ancho y el alto del componente de vídeo. Esta opción está activada de forma predeterminada.
Entrada de vídeo en vivo
Especifica si el contenido de vídeo es contenido en vivo. Si se selecciona Entrada de vídeo en vivo, Flash Player reproducirá una entrada de vídeo en vivo transmitida en flujo desde Flash® Media Server. El nombre de la entrada de vídeo en vivo es el nombre especificado en el cuadro de texto Nombre de flujo.
Nota
Para permitir la entrada de vídeo en vivo, debe seleccionar una de las opciones de apariencia Halo del campo Aspecto. Si activa la opción Entrada de vídeo en vivo, sólo aparecerá el control de volumen en el aspecto del componente, porque no es posible manipular el vídeo en vivo. Tampoco tendrán ningún efecto las opciones Reproducción automática y Rebobinado automático.
Reproducción automática
Especifica si se debe reproducir el vídeo cuando se abre la página web.
Rebobinado automático
Especifica si el control de reproducción vuelve a la posición inicial después de que el vídeo termine de reproducirse.
Tiempo de búfer
Especifica el tiempo, en segundos, necesario para el búfer antes de que el vídeo comience a reproducirse. El tiempo de búfer predeterminado está establecido en 0 para que el vídeo comience a reproducirse inmediatamente después de hacer clic en el botón Reproducir.(Si se selecciona Reproducción automática, el vídeo comienza a reproducirse tan pronto como se establece una conexión con el servidor.) Es posible que quieras establecer un tiempo de búfer si estás entregando vídeo que tiene una tasa de bits superior a la velocidad de conexión del visitante del sitio, o cuando el tráfico de Internet pueda causar problemas de ancho de banda o conectividad.Por ejemplo, si quieres enviar 15 segundos de vídeo a la página web antes de que la página web comience a reproducir el vídeo, establece el tiempo de búfer en 15.
Haz clic en Aceptar para cerrar el cuadro de diálogo y agregar el archivo FLV a tu página web.
El comando Insertar FLV genera un archivo SWF de reproductor de vídeo y un archivo SWF de skin que se utilizan para mostrar tu vídeo en una página web.El comando también genera un archivo main.asc que debes cargar en tu Flash Media Server.(Para ver los nuevos archivos, puede que tengas que hacer clic en el botón Actualizar del panel Archivos.)Estos archivos se almacenan en el mismo directorio que el archivo HTML al que estás agregando contenido de vídeo.Al cargar la página HTML que contiene el archivo FLV, no olvides cargar los archivos SWF en tu servidor web y el archivo main.asc en tu Flash Media Server.
Nota
Si ya tienes un archivo main.asc en tu servidor, consulta con el administrador del servidor antes de cargar el archivo main.asc generado por el comando Insertar FLV.
Puedes cargar fácilmente todos los archivos de medios necesarios seleccionando el marcador de posición del componente de vídeo en la ventana Documento de Dreamweaver y haciendo clic en el botón Cargar medios en el inspector de propiedades (Ventana > Propiedades).Para ver una lista de archivos necesarios, haga clic en Mostrar archivos necesarios .
Nota
El botón Cargar medios no carga el archivo HTML que contiene el contenido de vídeo.
Edición de la información de descarga de Flash Player
Al insertar un archivo FLV en una página, Dreamweaver inserta código que detecta si el usuario dispone de la versión correcta de Flash Player. Si no dispone de ella, la página mostrará un contenido alternativo predeterminado que solicita al usuario que descargue la versión más reciente. Puede cambiar este contenido alternativo en cualquier momento.
Este procedimiento también es aplicable a archivos SWF.
Nota
Si un usuario no dispone de la versión requerida pero dispone de Flash Player 6.0 r65 o posterior, el navegador mostrará un instalador express de Flash Player. Si el usuario rechaza la instalación exprés, la página mostrará el contenido alternativo.
En la vista de Diseño de la ventana Documento, seleccione el archivo SWF o FLV.
Haga clic en el icono de ojo del archivo SWF o del archivo FLV.
Nota
También puede presionar Control + ] para cambiar a la vista de contenido alternativo. Para volver a la vista SWF/FLV, presiona Ctrl + [ hasta que se seleccione todo el contenido alternativo.Luego vuelva a presionar Control + [.
Edita el contenido tal como editarías cualquier otro contenido en Dreamweaver.
Nota
No puede agregar archivos SWF o archivos FLV como contenido alternativo .
Haga clic en el icono del ojo otra vez para volver a la vista del archivo SWF o FLV.
Solución de problemas con archivos FLV
Esta sección detalla algunas de las causas más comunes de problemas con archivos FLV.
Problemas de visualización causados por la ausencia de archivos relacionados
El código generado por Dreamweaver CS4 y versiones posteriores depende de cuatro archivos dependientes, diferentes del propio archivo FLV:
swfobject_modified.js
expressInstall.swf
FLVPlayer_Progressive.swf
El archivo de aspecto (por ejemplo, Clear_Skin_1.swf)
Tenga en cuenta que hay dos archivos dependientes más para Dreamweaver CS4 y versiones posteriores, en comparación con Dreamweaver CS3.
Los primeros dos de estos archivos (swfobject_modified.js y expressInstall.swf) se instalan en una carpeta llamada Scripts, que Dreamweaver crea en la raíz del sitio si aún no existe.
Los segundos dos archivos (FLVPlayer_Progressive.swf y el archivo de máscara) se instalan en la misma carpeta que la página en la que se incrusta el FLV.El archivo de máscara contiene los controles para el FLV, y su nombre depende de la máscara elegida en las opciones descritas en la Ayuda de Dreamweaver.Por ejemplo, si eliges Clear Skin, el archivo se llama Clear_Skin_1.swf.
Los cuatro archivos dependientes DEBEN cargarse en tu servidor remoto para que el FLV se muestre correctamente.
Olvidar cargar estos archivos es la causa más común de que los archivos FLV no funcionen correctamente en una página web.Si falta uno de los archivos, es posible que veas una «caja blanca» en la página.
Para asegurarse de que ha cargado todos los archivos dependientes, use el panel Archivos de Dreamweaver para cargar la página en la que aparece el FLV.Cuando cargas la página, Dreamweaver te pregunta si quieres cargar archivos dependientes (a menos que hayas desactivado esta opción).Haga clic en sí para cargar los archivos dependientes.
Problemas de visualización al obtener una vista previa de páginas localmente
Debido a las actualizaciones de seguridad en Dreamweaver CS4, no puedes usar el comando Vista previa en explorador para probar una página con un FLV incrustado a menos que definas un servidor de pruebas local en la definición de sitio de Dreamweaver y uses el servidor de pruebas para obtener una vista previa de la página.
Normalmente, requiere un servidor de pruebas solo si está desarrollando páginas con ASP, ColdFusion o PHP (consulte Configurar el ordenador para el desarrollo de aplicaciones).Si está creando sitios web que usan solo HTML, y no ha definido un servidor de pruebas, al pulsar F12 (Windows) Opt+F12 (Macintosh) se produce una mezcla confusa de controles de máscara en pantalla.La solución alternativa es definir el servidor de pruebas y utilizarlo para obtener una vista previa de tu página, o cargar tus archivos en un servidor remoto y visualizarlos allí.
Nota
Es posible que la configuración de seguridad también sea responsable de la incapacidad de obtener una vista previa del contenido FLV local, pero Adobe no ha podido confirmarlo.Puede probar a cambiar la configuración de seguridad para ver si se resuelve el problema. Para obtener más información sobre el cambio de los ajustes de seguridad, consulte la hoja técnica 117502.
Otras posibles causas de problemas con archivos FLV
Si tiene problemas a la hora de obtener una vista previa localmente, asegúrese de que no está seleccionada la opción Vista previa utilizando el archivo temporal en Edición > Preferencias > Vista previa en tiempo real.
Asegúrese de que dispone de los plug-ins de Flash Player más recientes
Evite mover archivos y carpetas fuera de Dreamweaver. Al mover archivos y carpetas fuera de Dreamweaver, Dreamweaver no puede garantizar que las rutas de acceso a los archivos relacionados de FLV sean correctas.
Puede reemplazar temporalmente el archivo FLV que está dando problemas por un archivo FLV del que tenga constancia que funciona correctamente. Si el archivo FLV sustituto funciona correctamente, el problema radicará en el archivo FLV original, no en el navegador o el equipo.
Edición o eliminación de un componente FLV
Para cambiar la configuración de vídeo de la página web, seleccione el marcador de posición del componente de vídeo en la ventana de documento de Dreamweaver y utilice el inspector de propiedades. Otro método consiste en eliminar el componente de vídeo y volver a insertarlo seleccionando Insertar > HTML > Flash Video.
Edición del componente FLV
Seleccione el marcador de posición del componente de vídeo en la ventana Documento de Dreamweaver haciendo clic en el icono FLV en el centro del marcador de posición.
Abra el Inspector de propiedades (Ventana > Propiedades) y realice los cambios.
Nota
No puede cambiar tipos de vídeo (de descarga progresiva a flujo, por ejemplo) usando el Inspector de propiedades.Para cambiar el tipo de vídeo, elimina el componente FLV y vuelve a insertarlo seleccionando Insertar > Medios > FLV.
Eliminación del componente FLV
Seleccione el marcador de posición del componente FLV
en la ventana Documento de Dreamweaver y pulse
Eliminar.
Añadir vídeo (otros formatos)
Para saber como añadir vídeos que no sean archivos .flv, consulte Añadir vídeos (que no sean FLV).
También es posible que desee saber cómo insertar contenido de complementos en Dreamweaver para reproducir archivos .mp3 o vídeos de QuickTime en su sitio de Dreamweaver.
Temas similares
Crear sitios web atractivos en Dreamweaver
Diseña, codifica y gestiona sitios web dinámicos en una potente herramienta todo en uno.
