El programa Dreamweaver de Macromedia es uno de los programas ms utilizados en todo el

mundo para la creacin de paginas WEB. Es empleado tanto por profesionales como por personas
que se inician en la creacin de su primera pagina web.
De hecho muchos lo consideran ampliamente superior a otros programas similares, tales como
FrontPage de Microsoft. Aqu no vamos a entrar en quien tiene o deja de tener razn. Lo que si
vamos a hacer es tener una primera aproximacin a la ltima versin de Dreamweaver: la versin
7 de MacromediaDreamweaver MX 2004.
Mostraremos de una forma fcil y didctica como sacar provecho de l con unos pocos clicks y nos
pondremos en la senda para poder penetrar mejor en sus secretos. El objetivo de este curso es
mostrar las principales funcionalidades de Dreamweaver, de manera que cuando acabemos el
curso cualquiera sea capaz de comprender el programa y este capacitado para afrontar la
creacin de una pgina Web.
Muchos creen que como Dreamweaver es un programa usado por profesionales, tiene que ser
muy complicado para los usuarios ocasionales. Realmente Dreamweaver es un programa muy
sencillo e intuitivo , que puede ser utilizado a muchos niveles. Desde el ms bsico suficiente
para crear una pagina personal de un usuario novel, hasta gestionar todo un Site empresarial con
un contenido de cientos de paginas.
En las prximas lecciones iremos presentando de forma fcil y didctica, las distintas
funcionalidades del programa. El alumno podr seguir las lecciones tanto con el texto como con
las lecciones multimedias que se muestran al final de cada leccin. El objeto de estas
demostraciones multimedias es reforzar el contenido didctico de cada leccin mostrando como
se hace realmente en el programa.

Histricamente, las primeras pginas web fueron poco ms que meros escaparates donde sus
creadores escriban y las personas que las visitaban simplemente las lean. Eran una forma de
comunicacin unidireccional, sin que fuera posible para visitante responder a esa comunicacion

Pronto se hizo evidente que las personas que creaban las pginas web, ya fueran los propios
autores o las empresas que contratabas las pginas, necesitaban recibir informacin de las
personas que visitarn las pginas.
Los formularios fueron la respuesta a sus necesidades.

Gracias a los formularios es posible crear una comunicacin bidireccional entre los visitantes de las
pginas y los autores de ellas.

Ya conocemos la potencia de Dreamweaver para ayudarnos a crear pginas web, ahora

descubriremos cmo Dreamweaver hace extremadamente sencilla esta tarea.
Antes de continuar debemos explicar unos pequeos conceptos previos.
Aunque funcionalmente el visitante de nuestras pginas no note a primera vista la diferencia, en
realidad existe dos tipos de formularios dependiendo de la manera en que reciba los datos la
pgina. Ya hemos dicho que los formularios eran una va de comunicacin bidireccional entre los
visitantes y los creadores de las pginas. Existen dos maneras de enviar esta informacin, la ms
usual en las pginas de empresas es utilizar unos pequeos programas localizados en los
servidores donde se aloja la pgina.
Estos programas llamados CGI, dejemos el crptico significado de las siglas de lado, se encargan
de recoger la informacin que el visitante enva al servidor y la prepara para su uso posterior. Su
ventaja es la potencia de estos programas, su robustez y su versatilidad, su inconveniente, aparte

de tener que contratar un servidor que acepte su uso, es que para crearlos y usarlos es necesario
tener algunas nociones de programacin, y esto se escapa del horizonte de este curso.
La otra forma de enviar formulario es utilizando el mtodo post, tampoco vamos a intentar
explicarlo ahora, baste saber que con l, el visitante puede hacernos llegar informacin sin que
tengamos contratado ningn servidor CGI.
En esta seccin vamos a descubrir como Dreamweaver nos ayuda a disear y crear fcilmente
nuestros formularios, veremos cmo es mucho ms sencillo crearlos que explicar cmo funcionan.

La barra Formulario
En esta leccin comenzaremos a familiarizarnos con las herramientas que utilizaremos para crear
nuestros formularios. Para ello tendremos ya abierto Dreamweaver y activa una pgina web en
blanco. Si no recordamos como hacerlo, este es el momento idneo para dar un rpido repaso al
primer curso Dreamweaver de Aulafcil.
Una vez que tengamos en la ventana del documento activo de Dreamweaver la pagina en blanco,
Podemos acceder rpidamente a las funcionalidades para la creacin de formularios que nos
proporciona el programa Dreamweaver desde la barra de Formularios.
Para ello en la barra comn activaremos la barra de Formularios....

Simplemente desplegando el men de las barras, pulsando en Comn, veremos las distintas
barras que podremos activar, nosotros pulsaremos en la opcin Formulario.

En la imagen inferior vemos parte de la barra de formularios.

Iremos descubriendo cada opcin utilizndolas en nuestros prximos ejercicios.

Someramente diremos por ahora, que las opciones de la barra corresponde a distintos elementos
de los formularios que podemos aadir segn los necesitemos.
Entre ellos tenemos, por ejemplo: recuadros de textos, botones de seleccin, listas desplegables,
etc..

Resumen multimedia de la leccin 3 ;

Propiedades de los Formularios I

El primer icono de la izquierda, el que est sealado en la imagen inferior, llamado
Formulario,es el ms importante, como explicaremos a continuacin.

Cuando creamos un formulario debemos situar sus elementos dentro de un rectngulo rojo de
formulario.

Esto no es estrictamente necesario, es decir tenemos libertad de insertar elementos de

formularios en cualquier parte de la pgina, pero si ponemos, por ejemplo, un Botn enviar
fuera del formulario, pierde todo su sentido pues el navegador podra no saber interpretarlo
correctamente.
Vamos a ver ahora las propiedades del cajn formulario.
Para ver las propiedades simplemente desplegaremos el panel propiedades en la parte inferior de
la ventana, en el caso de que no recordemos como hacerlo sera conveniente dar un pequeo
repaso al primer curso de Dreamweaver de Aulafcil .

En la imagen superior vemos distintos campos en los que podremos especificar las caractersticas
que tendr nuestro formulario.
Empezaremos por dar un nombre al formulario, para ello teclearemos el nombre que deseemos dar
al formulario, en el campo "Nombre del formulario".
Podemos crear todos los formularios que deseemos en la misma pgina, por esta razn
deberemos crear distintos recuadros para cada formulario y darle a cada uno de ellos un nombre
representativo.

Con el campo "Accin" especificamos la ruta del componente del formulario en el servidor,
podemos escribir la ruta en este campo, o pulsar el icono carpeta para buscar el directorio donde
este situado el programa o la aplicacin que procesara el formulario una vez haya sido enviado al
servidor.
Observaremos la extensin CGI de la accin, ya hemos hablado de los programas CGI en la
introduccin, ms adelante seguiremos viendo sus caractersticas.

En la siguiente leccin continuaremos viendo las propiedades de los formularios

Propiedades de los Formularios II

En la leccin anterior coomenzamos a explorar las propiedades de los formularios, en esta leccin
finalizaremos su estudio.
A continuacin veremos el campo Destino.
Con l controlamos cmo el navegador manejar la respuesta del servidor. Es decir, le decimos al
navegador lo que debe hacer cuando el usuario pulse el botn enviar.

Por ejemplo si nuestra pgina usa frames y el programa del servidor nos devuelve una pgina web
despus de procesar la informacin del visitante, puede ser tanto una pgina de agradecimiento o
una pgina donde simplemente nos comunique que el email ha sido enviado. Podemos indicar en
qu frame se mostrar simplemente eligiendo un valor desde la lista "Destino". Incluso si no
utilizamos frames, podemos hacer que se abra una pgina en una nueva ventana, pulsando la
opcin "_blank" en la lista "Destino"
Desde la opcin Mtodo, le indicamos al navegador cmo enviar la informacin al servidor de la
pgina web. Podemos enviar la informacin de dos maneras distintas.
Con el mtodo GET, el navegador enva el contenido del formulario a una direccin URL.
Con el mtodo POST, el navegador enva el contenido de el formulario en forma de un mensaje
al servidor.

El mtodo GET es el mtodo predeterminado para la mayora de los navegadores, pero el mtodo
POST es el ms seguro y debera usarse siempre que se pudiera, sobre todo cuando se va a
enviar informacin confidencial, por ejemplo nmeros de tarjetas de crdito. Otra desventaja del
mtodo GET, es que no se puede enviar formularios de ms de 8192 caracteres. Por lo que no
puede utilizarse para formularios extensos.
Si no vamos a trabajar con elementos en el servidor, deberemos elegir el mtodo
"Predeterminado" de entre la lista de mtodos, haciendo esto, Dreamweaver no aadir ninguna
marca en el formulario. Esto significa que ser el navegador el que elija el mtodo en funcin de la
pgina. Es decir si hoy ningn programa en el servidor utilizara el mtodo POST, pero deberemos
tener cuidado porque si existe algn programa en el servidor, intentara enviarlo con el mtodo
GET.
Por ltimo , tenemos el campo Enctype, con l elegimos el formato en el que enviaremos los
datos, por ejemplo con "aplication/x..." utilizaremos el mtodo post, pero si queremos adjuntar
ficheros con el formulario, deberemos seleccionar "multipart/form-data"

Con esto hemos terminado de ver los elementos de propiedades del formulario.

Los Campos Textos I

Los Campos textos son zonas rectangulares que permiten al visitante introducir informacin en
los formularios tecleando tanto letras, como smbolos o nmeros.

Existen tres tipos distintos de campos textos. Los campos de textos de una lnea, los multilneas,
y los campos de clave.
Vamos a verlos ms detenidamente.
Para insertar los campos de textos de una lnea, pincharemos con el ratn donde queramos
situarlos y elegiremos la opcin Campo de texto, del submen Formulario que encontramos en
el men Insertar.

O bien pulsaremos el botn Campo de texto de la pestaa formulario de el panel Insertar.

En el panel propiedades podemos configurar los atributos para el Campo texto.

Los Campos Textos II

En el panel propiedadespodemos configurar los atributos para el Campo texto.

Teclearemos un nombre para el elemento en el Campo de texto. El nombre deber ser nico y no
repetirse, para que el navegador no pueda confundir los textos dados a unos u otros campos. Si
utilizamos programas CGI o similares deberemos darle el mismo nombre que el nombre de la
variable que recibir los datos en el servidor.

En nuestro ejemplo le hemos dado el nombre Opcintexto.

Ahora teclearemos la anchura de el elemento con el campo anchura de texto. para crear nuestros
formularios deberemos tener en cuenta que la medida de los campos textos, no se miden en
pxeles, ni en centmetros, sino en nmero de caracteres. De manera que si queremos tener un
campo en el que visualicemos un texto de 30 caracteres deberemos teclear 30 en el campo
anchura de texto

El hecho de que limitemos el nmero de caracteres que se visualizara en el campo texto, no

implica que no se pueda escribir ms texto del que cabe en l. En este caso veremos que
conforme tecleemos, el texto se ira desplazando a la izquierda.
Si deseamos limitar el nmero de caracteres que se puedan insertar en un campo, podemos
especificando el mximo de caracteres aceptados en el campo "Caracteres mximos".

Hay aun un elemento ms que es de mucha utilidad en el uso de los formularios.

Se trata de el "valor inicial", si no especificamos nada, el campo texto en el formulario aparecer
vaco.

Podemos, utilizando el "valor inicial", mostrar un texto en el interior del campo texto. Con l,
daremos al usuario la posibilidad de aceptar el valor inicial sugerido o simplemente utilizarlo como
informacin de ayuda.

Las reas de textos I

Un rea de texto es una ventana que permite al usuario introducir mltiples lneas de texto.

Para insertar un rea de texto, podemos hacerlo desde la opcinrea de texto del
submenformulario, que encontramos en el men Insertar.

O bien podemos pulsar en el botn rea de texto en la barra de formulario, de el panel insertar.

Tambin podemos simplemente insertar un campo de texto de una lnea, como ya hemos visto, y
en el panel propiedades pulsar la opcin varias lneas.

Las reas de textos II

Podemos definir el rea de textos, en el campo anchura de caracteres en el panel propiedades,

en la imagen de abajo hemos establecido un ancho de 30 caracteres.
No podemos definir, como hacamos en el campo de texto de una lnea, el nmero mximo de
caracteres, sin embargo podemos especificar el nmero de filas que se mostraran en pantalla, en
el campo Lneas nm.

Al igual que en el campo texto, podemos darle un valor inicial al rea de texto que ayude o sugiera
respuestas a nuestros visitantes.
Por ltimo podemos controlar cmo ser el desplazamiento por el interior del rea de texto desde
la opcin "Ajuste".
Con ajuste predeterminado el navegador inserta automticamente un retorno de carro despus
de la ltima palabra completa que se teclee cuando alcanzamos el margen derecho del rea texto.

Con ajuste virtual, veremos cmo el texto cambia de lnea al llegar al final de la lnea, pero sin que
se inserte ningn retorno de carro. Con ajuste fsico el navegador insertar un retorno de carro al
finalizar la lnea, con esta opcin tambin ser enviado el retorno de carro al servidor.
Por ltimo. Vamos a ver la ltima opcin del campo texto, los campos contraseas.
Un campo contrasea es un tipo especial de campo texto, que muestra con asteriscos o puntos
gruesos, el texto que el usuario teclee en el campo. Se suele utilizar este campo en el caso de que
necesitemos enviar datos sensibles a travs del formulario. Por ejemplo una contrasea o un
nmero de tarjeta de crdito.
Para insertar un campo contrasea, primero crearemos un campo texto de una sola lnea y
despus seleccionaremos la opcin Contrasea en el campo tipo en el panel propiedades.

Insertando Casillas de Verificacin.

Una casilla de verificacin es un pequeo cuadrado que el usuario de nuestra pgina puede activar
o desactivar con un simple clic. Cuando la casilla de verificacin est activada, una marca
aparecer en su interior. Si la desactivamos, o no la activamos, la casilla aparecer vaca.
Utilizaremos las casillas de verificacin cuando queramos ofrecer a nuestros visitantes la
posibilidad de que elijan ninguna, una, o varias opciones entre las que hayamos creado.
Para insertar una casilla de verificacin elegiremos la opcin Casilla de verificacin del
submen Formulario, de el men Insertar.

O pulsando en el botn Casilla de verificacin en la barra Formulario de el panel Insertar.

En el panel propiedades podemos configurar las opciones para las casillas de verificacin.

La primera es el Nombre de la casilla", para poder manejar correctamente los valores

deberemos darle un nombre que el navegador pueda enviar al servidor.
A continuacin vemos la propiedad "Valor activado", con el valor anterior le decimos qu valor
enviamos al servidor, y con este le decimos el contenido del valor que recibir el servidor cuando la
casilla est activada.

Por ltimo con el "valor inicial", decidimos que la casilla aparezca marcada o no, cuando es
visitada la pgina por el usuario, de esta manera podemos ayudarle sugiriendo la respuesta.
Resumen multimedia de la leccin 10 ;