Añadir vídeo y audio a Dreamweaver
Inserción de archivos FLV
Puede añadir fácilmente vídeo FLV a las páginas web sin necesidad de utilizar la herramienta de creación de Flash. Para poder empezar, debe disponer de un archivo FLV codificado.
Dreamweaver inserta un componente SWF que muestra el archivo FLV; cuando se visualiza en un navegador, este componente muestra el archivo FLV seleccionado, así como un conjunto de controles de reproducción.
El archivo FLV seleccionado y un conjunto de controles de reproducción
Descarga progresiva de vídeo
Descarga el archivo FLV en el disco duro del visitante del sitio y lo reproduce. Sin embargo, a diferencia de los métodos tradicionales de entrega de vídeo de tipo “descarga y reproducción”, la descarga progresiva permite iniciar la reproducción del archivo de vídeo antes de que haya finalizado 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.
Nota:
Microsoft Internet Information Server (IIS) no procesa etiquetas de objetos anidados. Para las páginas ASP, Dreamweaver utiliza código de objeto/incrustación anidado en lugar de código de objeto anidado al insertar archivos SWF o FLV.
El cuadro de diálogo Insertar FLV le permite establecer opciones para visualización con descarga progresiva de un archivo FLV insertado en una página web.
URLEspecifica una ruta de acceso relativa o absoluta al archivo FLV. Para especificar una ruta de acceso relativa (por ejemplo, miruta/mivideo.flv), haga clic en el botón Examinar, desplácese hasta el archivo FLV y selecciónelo. Para especificar una ruta de acceso absoluta, escriba el URL (por ejemplo, http://www.ejemplo.com/mivideo.flv) del archivo FLV.
AspectoEspecifica el aspecto del componente de vídeo. Se muestra una presentación preliminar del aspecto seleccionado bajo el menú emergente Aspecto.
AnchuraAnchura del archivo FLV, en píxeles. Dreamweaver determina la anchura del archivo FLV y podrá verla automáticamente en este campo.
AlturaAltura 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.
El comando Insertar FLV crea un archivo SWF de reproductor de vídeo y un archivo SWF de aspecto que se utilizan para mostrar el contenido de vídeo en una página web. (Quizás tenga que hacer clic en el botón Actualizar del panel Archivos para ver los nuevos archivos). Estos archivos se almacenan en el mismo directorio que el archivo HTML al que está añadiendo contenido de vídeo. Cuando cargue la página HTML que incluye el archivo FLV, Dreamweaver cargará estos archivos como archivos dependientes (siempre y cuando haga clic en Sí en el cuadro de diálogo Colocar archivos dependientes).
El cuadro de diálogo Insertar FLV le permite establecer opciones para descarga de flujo de vídeo de un archivo FLV insertado en una página web.
Configuración de opciones para flujo de vídeo
URI de servidorEspecifica el nombre de servidor, nombre de la aplicación y nombre de instancia con el formato rtmp://www.example.com/app_name/instance_name.
Nombre de flujoEspecifica el nombre del archivo FLV que desea reproducir (por ejemplo, mivideo.flv). La extensión .flv es opcional.
AspectoEspecifica el aspecto del componente de vídeo. Se muestra una presentación preliminar del aspecto seleccionado bajo el menú emergente Aspecto.
AnchuraAnchura del archivo FLV, en píxeles. Dreamweaver determina la anchura del archivo FLV y rellena automáticamente la anchura en este campo.
AlturaAltura 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.
RestringirMantiene 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 vivoEspecifica 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.
Rebobinado automáticoEspecifica si el control de reproducción vuelve al punto de inicio cuando finalice la reproducción.
Tiempo de búferEspecifica los segundos necesarios para almacenar en búfer el vídeo antes de iniciar su reproducción. El tiempo de búfer predeterminado es 0, de forma que el vídeo comienza a reproducirse inmediatamente después de pulsar el botón Reproducir. (Si se activa la opción Reproducción automática, el vídeo comenzará a reproducirse en cuanto se establezca una conexión con el servidor). Si lo desea, también puede establecer un tiempo de búfer, por ejemplo, si desea publicar contenido de vídeo con una velocidad de bits superior a la velocidad de conexión del usuario o cuando el tráfico de Internet pueda provocar cuellos de botella en el ancho de banda o problemas de conectividad. Por ejemplo, si desea enviar 15 segundos de vídeo a la página web antes de que ésta comience a reproducirlo, establezca un tiempo de búfer de 15.
El comando Insertar FLV crea un archivo SWF de reproductor de vídeo y un archivo SWF de aspecto que se utilizan para mostrar el vídeo en una página web. El comando también crea un archivo main.asc que debe cargarse en Flash Media Server. (Quizás tenga que hacer clic en el botón Actualizar del panel Archivos para ver los nuevos archivos). Estos archivos se almacenan en el mismo directorio que el archivo HTML al que está añadiendo contenido de vídeo. Cuando cargue la página HTML que incluye el archivo FLV, no olvide cargar los archivos SWF en el servidor Web y el archivo main.asc en Flash Media Server.Nota:Si ya hay un archivo main.asc en el servidor, consulte con el administrador del servidor antes de cargar el archivo main.asc creado por el comando Insertar FLV.
Para cargar fácilmente todos los archivos multimedia necesarios, seleccione el marcador de posición del componente de vídeo en la ventana de documento de Dreamweaver y haga clic en el botón Cargar media del inspector de propiedades (Ventana > Propiedades). Para ver una lista de los archivos necesarios, haga clic en Mostrar archivos necesarios.Nota:El botón Cargar media no carga el archivo HTML que incluye el contenido de vídeo.
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 express, la página mostrará el contenido alternativo.
- Nota:También puede presionar Control + ] para cambiar a la vista de contenido alternativo. Para regresar a la vista de SWF/FLV, presione Control + [ hasta que se seleccione todo el contenido alternativo. Seguidamente, presione Control + [ de nuevo.
En esta sección se detallan algunas de las causas más habituales de los problemas que surgen al usar archivos FLV.
Visualización de problemas provocados por la ausencia de archivos relacionados
El código generado por Dreamweaver CS4 y versiones posteriores se basa en cuatro archivos dependientes distintos del archivo FLV propiamente dicho:
- 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 dos primeros archivos (swfobject_modified.js y expressInstall.swf) se instalan en una carpeta denominada Scripts, que Dreamweaver crea en la raíz del sitio si es que no existe ya.
Los otros dos archivos (FLVPlayer_Progressive.swf y el archivo de aspecto) se instalan en la misma carpeta que la página en la que se incrusta el archivo FLV. El archivo de aspecto contiene los controles para el FLV y su nombre depende del aspecto elegido en las opciones descritas en la Ayuda de Dreamweaver. Por ejemplo, si elige Clear Skin, el archivo se denominará Clear_Skin_1.swf.
Es OBLIGATORIO cargar los cuatro archivos dependientes en el servidor remoto para que el FLV se muestre correctamente.
Olvidarse de cargar estos archivos es la causa más habitual de que los archivos FLV no se ejecuten correctamente en una página web. Si falta alguno de los archivos, es posible que vea un "cuadro en blanco" en la página.
Para asegurarse de que carga todos los archivos dependientes, utilice el panel Archivos de Dreamweaver con el fin de cargar la página en la que aparece el FLV. Cuando cargue la página, Dreamweaver le preguntará si desea cargar los archivos dependientes (a no ser que haya desactivado esta opción). Haga clic en sí para cargar los archivos dependientes.
Problemas de visualización al obtener una vista previa de las páginas localmente
Debido a las actualizaciones de seguridad efectuadas en Dreamweaver CS4, no puede utilizar el comando Vista previa en el navegador para comprobar una página con un archivo FLV incrustado, a no ser que defina un servidor de prueba local en la definición de sitio de Dreamweaver y utilice el servidor de prueba para obtener la vista previa de la página.
Por lo general, un servidor de prueba sólo es necesario si desarrolla páginas con ASP, ColdFusion o PHP (consulte Configuración del equipo para el desarrollo de aplicaciones). Si crea sitios web que sólo usan HTML y no ha definido un servidor de prueba, al presionar F12 (Windows) Opc+F12 (Macintosh) aparecerán en pantalla controles de aspecto desordenados. La solución consiste en definir el servidor de prueba y utilizarlo para obtener una vista previa de la página, o bien en cargar los archivos en un servidor remoto y visualizarlos en él.
Nota:
Es posible que la configuración de seguridad también sea la causa de que no se pueda obtener una vista previa de contenido FLV local, aunque Adobe no ha podido comprobarlo. 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.
- 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 complementos 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.
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.
- Nota:No puede cambiar los tipos de vídeo (por ejemplo, de descarga progresiva a flujo) mediante el inspector de propiedades. Para cambiar el tipo de vídeo, elimine el componente FLV y vuelva a insertarlo seleccionando Insertar > Media > FLV.
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.
Comentarios
Publicar un comentario