Forinsur S.L.

Centro de Formacin | Manual de Usuario

Multimedia con Dreamweaver CS3

Insertando pelculas de Flash Las pelculas Flash son animaciones, que al igual que los botones y el texto Flash, tienen la extensin SWF. Es frecuente verlas en las pginas iniciales de los sitios web, a modo de presentacin hacia los usuarios, aunque se pueden utilizar para realizar cualquier tipo de animacin. Estas pelculas pueden crearse mediante el programa Flash de

Macromedia, y necesitan que el usuario tenga instalado el plug-in para poder ser visualizadas. Las pelculas Flash pueden insertarse en una pgina a travs del men Insertar, Media, opcin Flash, o pulsando Ctrl+Alt+F.

Tambin pueden insertarse pulsando sobre la opcin en la pestaa Comn del panel Insertar, botn Media.

Flash que aparece

El inspector de propiedades de las pelculas Flash es prcticamente igual que el de los botones y el texto Flash, pero existen dos opciones nuevas que hacen referencia a la visualizacin de la pelcula.

Tcnico Especialista en Diseo, Animacin y Programacin Web

La opcin Bucle indica que al finalizar la pelcula, sta volver a comenzar desde el principio. La otra es la opcin Rep. autom. (reproduccin automtica), que al estar marcada indica que nada ms cargarse la pgina comenzar a reproducirse la pelcula Flash. Si esta opcin no estuviera marcada, se mostrara nicamente el primer fotograma de la pelcula. Interesa desmarcar esta opcin cuando se desea que la reproduccin sea activada por algn comportamiento. Controlando pelculas de Flash Use la accin Controlar Flash para reproducir, detener, rebobinar o ir a un fotograma de un archivo SWF de Macromedia Flash. Para utilizar la accin Controlar Flash: 1. Seleccione Insertar > Media > Flash para insertar un archivo SWF de Flash respectivamente. 2. Seleccione Ventana > Propiedades e introduzca un nombre para la pelcula en el cuadro de texto situado en la parte superior izquierda (junto al icono Flash). Debe asignar un nombre a la pelcula para poder controlarla con la accin Controlar Flash. 3. Seleccione el elemento que desea usar para controlar el archivo SWF de Flash. Por ejemplo, si tiene una imagen de un botn Reproducir que se utilizar para reproducir la pelcula, seleccione esa imagen. 4. Abra el panel Comportamientos (Ventana > Comportamientos). 5. Haga clic en el botn de signo ms (+) y seleccione Flash en el men emergente Acciones. Aparecer un cuadro de dilogo de parmetros. 6. Seleccione una pelcula en el men emergente Pelcula.

Forinsur S.L. Centro de Formacin | Manual de Usuario

Dreamweaver presenta automticamente una lista con los nombres de todos los archivos SWF Flash que hay actualmente en el documento. (En concreto, Dreamweaver presenta una lista con todos los nombres de los archivos con las extensiones .dcr, .dir, .swf o .spl que estn en las etiquetas object o embed.) 7. Elija si desea reproducir, detener, rebobinar o ir a un fotograma de la pelcula. La opcin Reproducir reproduce la pelcula empezando en el fotograma en que se produce la accin. 8. Haga clic en Aceptar. 9. Compruebe que el evento predeterminado es el que usted desea. Si no lo es, seleccione otro evento en el men emergente. Si los eventos que busca no aparecen en la lista, cambie el navegador de destino en el submen Mostrar eventos para del men emergente Eventos. Insertando HTML de Fireworks La exportacin de archivos de Fireworks a Dreamweaver es un proceso de dos fases. En primer lugar, en Fireworks, los archivos se exportan directamente a una carpeta de sitio de Dreamweaver. Esta operacin genera un archivo HTML y los archivos de imagen asociados en el lugar especificado. A continuacin, se inserta el cdigo HTML en Dreamweaver usando la funcin Insertar HTML de Fireworks. Nota: Antes de iniciar la exportacin, asegrese de elegir Dreamweaver como estilo de HTML en el cuadro de dilogo Configuracin de HTML. Para exportar HTML de Fireworks: Exporte el documento a formato HTML. Para insertar cdigo HTML de Fireworks en un documento de Dreamweaver: 1. En Dreamweaver, guarde el documento en un sitio definido. 2. Coloque el punto de insercin en el lugar del documento en que desee que comience el cdigo HTML insertado. 3. Siga uno de estos procedimientos:

Tcnico Especialista en Diseo, Animacin y Programacin Web

Seleccione Insertar > Objetos de imagen > HTML de Fireworks. Haga clic en el botn Imgenes: men emergente Imagen de la categora Comn de la barra Insertar y elija HTML de Fireworks. 4. En el cuadro de dilogo que aparece a continuacin, haga clic en Examinar para seleccionar el archivo HTML de Fireworks que desee. 5. Seleccione Eliminar archivo despus de insertar para desplazar el archivo HTML a la Papelera de reciclaje (Windows) o para eliminarlo de forma permanente (Macintosh) al finalizar la operacin. Utilice esta opcin si no va a necesitar el archivo HTML de Fireworks despus de insertarlo. Esta opcin no afecta al archivo PNG origen asociado con el archivo HTML. 6. Haga clic en Aceptar para insertar el cdigo HTML, junto con sus imgenes, divisiones y cdigo Javascript asociados, en el documento de Dreamweaver.

Insertando APPLETS La marca HTML <APPLET></APPLET> indica la ejecucin de un programa (applet) externo escrito en lenguaje Java. Hay applets para hacer que el texto se mueva dentro de la pgina, se contraiga y expanda, etc.... Esta marca tiene los siguientes parmetros : code =programa a ejecutar codebase = carpeta donde est el programa width = num height = num Los dos ltimos indican el espacio (ancho y alto) en puntos en el que el programa realizar su funcin Dentro de la marca <APPLET> se puede incluir la marca <PARAM> que enva al programa Java los parmetros necesarios para su funcionamiento. Esta directiva suele tener como mnimo los parmetros : name = campo value = valor de la variable a enviar Veamos un ejemplo en el que se ejecuta un programa

Forinsur S.L. Centro de Formacin | Manual de Usuario

Java que permite mostrar un reloj en la pantalla:

Nombre del archivo Java Nos situamos en el lugar del documento donde queremos insertar el applet y seleccionamos Insertar -> Medio -> Applet

Seleccionamos el archivo .class que contiene la clase java compilada Applets en Dreamweaver. El inspector muestra las propiedades del applet:

.. y al visualizar la pgina en el Explorer se ejecutar el Applet: Applets en Dreamweaver.

Tcnico Especialista en Diseo, Animacin y Programacin Web

Insertando otros elementos multimedia No es muy habitual incluir sonido en una pgina web, ya que algunos usuarios suelen estar escuchando su propia msica cuando navegan en Internet, por lo que el escuchar tambin sonido en cada pgina que se visita puede resultar algo molesto. A pesar de ello, el incluir un sonido agradable, apropiado al contenido de la pgina, puede hacerla ms atractiva. Muchas de las pginas que contienen sonido suelen ofrecer la posibilidad de activarlo o desactivarlo, para que aquellos usuarios que no deseen escuchar el sonido de la pgina puedan desactivarlo. Los formatos de sonido ms habituales en Internet son,

fundamentalmente, el MP3, el WAV y en algunas ocasiones el MIDI, aunque existen otros formatos diferentes que tambin pueden utilizarse. Lo ideal es incluir algn archivo de audio que no ocupe mucho espacio, y que no por ello sea de mala calidad. Para insertar un archivo de audio en un documento tienes que dirigirte al men Insertar, Media, opcin Plug-in.

En Dreamweaver no se mostrarn los controles de audio. Todos los archivos que son insertados como plug-in aparecen representadas dentro de Dreamweaver por una imagen como la de la izquierda.

En el inspector de propiedades pueden establecerse la altura y la anchura con la que se mostrarn los controles de audio, mediante Al y An. En el caso de no especificar ningn tamao, se mostrar el tamao por defecto de los controles, como ocurre en el ejemplo de arriba. Si lo que se desea es que se escuche el sonido en la pgina, pero que no se muestren los controles de audio, los campos Al y An deben valer cero. Los sonidos se reproducen automticamente al cargarse la pgina, y se reproducen solamente una vez. Estos valores no pueden definirse a travs

Forinsur S.L. Centro de Formacin | Manual de Usuario

del inspector de propiedades, pero s a travs del cdigo. Una vez definidos los podremos cambiar desde el inspector de propiedades con el botn Parmetros... Por ejemplo, el archivo anterior apareca en el cdigo como <embed src="varios/audio.mid"></embed>. Pero para que no se reproduzca automticamente se ha aadido autostart="false", y para que se reproduzca continuamente se ha aadido loop="true". La lnea de cdigo del archivo de audio ha quedado del siguiente modo: <embed src="varios/audio.mid" autostart="false"

loop="true"></embed> En el Inspector de propiedades del sonido, el botn Parmetros... abre un cuadro de dilogo donde podemos cambiar esos valores una vez introducidos. Para poder hacer que el audio pueda activarse y desactivarse cuando no se muestran los controles, es necesario insertar una serie de comportamientos que se encarguen de esa tarea. Si quieres poner msica de fondo en una pgina web, sin que aparezcan los controles de audio, puedes escribir este cdigo directamente en la vista Cdigo. <bgsound src="cancion1.wav" loop="-1"> Insrtalo despus de la etiqueta </title> Con el parmetro loop puedes decidir cuntas veces quieres que se reproduzca, 1, 2, 3 ... (con -1 se reproduce de modo continuo). Videos En ocasiones puede interesar incluir algn vdeo en una pgina web, pero hay que tener en cuenta que los vdeos suelen ocupar mucho espacio en disco, y por lo tanto, precisan de mucho tiempo para descargarse.

Tcnico Especialista en Diseo, Animacin y Programacin Web

Los formatos de vdeo que suelen utilizarse en Internet son el AVI, el MPEG y el MOV. Para insertar un archivo de vdeo en un documento tienes que dirigirte al men Insertar, Media, opcin Plug-in. El inspector de propiedades para los archivos de vdeo insertados de esta forma es el mismo que el de los archivos de audio, ya que ambos se insertan como Plug-in.

Los vdeos tambin se reproducen automticamente al cargarse la pgina, y se reproducen solamente una vez. Estos valores pueden cambiarse a travs del cdigo, del mismo modo que en el caso de los archivos de audio, aadiendo autostart="false" y loop="true". Todos los objetos insertados a travs de la opcin Plug-in precisan que el usuario tenga instalado un reproductor o un plug-in apropiado para reproducirlos. En el campo Origen del inspector de propiedades se establece el archivo vinculado (el archivo de audio o de vdeo) que ha de reproducirse. En el caso de que el usuario no tenga instalado ningn plug-in adecuado, puede establecerse en el campo URL plg una pgina en la que pueda encontrarlo.

Forinsur S.L. Centro de Formacin | Manual de Usuario

Comprobando plugins Otro comportamiento que tiene que ver con la comprobacin de las caractersticas del navegador del usuario es la opcin Comprobar Plugins. Est en en el panel etiqueta, opcin comportamiento, despliega clic en Comprobar Plug-in. Vers el siguiente cuadro de dilogo: y

Este comportamiento nos dar la posibilidad de comprobar si el navegador tiene instalados los plug-ins (o aadidos) necesarios para que pueda ver archivos de tipo Flash, Quicktime, Shockwave, RealPlayer, etc... Para ello deberemos seleccionar el tipo de plug-in que requerimos para que nuestra pgina se visualice correctamente, en el caso de que no se encuentre en el desplegable Seleccionar: deberemos escribir su nombre en el cuadro de texto Introducir: (aunque esto ocurrir en contadas ocasiones). Rellena los campos de URL siguientes. El primero indicar la ruta de la pgina que quieres que se muestre si el plug-in existe en el navegador del usuario. Djalo en blanco si quieres que se quede en la pgina en la que est. Y en el campo De lo contrario, ir a URL: escribe la ruta a la que debe redirigirse el navegador en caso de que no tuviese el plug-in instalado. Aqu tienes dos opciones, o bien redirigir al usuario a la pgina donde descargarse el plug-in para poder visualizar la tuya correctamente, o redirigirlo a una pgina que hayas creado para aquellos que no cumplan los requisitos mnimos del sitio. Este comportamiento tambin deber ir asociado al evento onLoad del body para que pueda ejecutarse en la carga de la pgina.

Tcnico Especialista en Diseo, Animacin y Programacin Web

Normalmente este comportamiento slo tendr un uso prctico en Internet Explorer, ya que la mayora del resto de los navegadores soportan por s solos la deteccin de plug-ins instalados y redireccionan a la fuente del plug-in directamente.