La Sostenibilidad Corporativa. Administración Ambiental
Iv bimestre
1. CG
VIRG
E N D E G U A D ALUPE
1 9 7 5
I. E . P.
COMPUTACIÓNCOMPUTACIÓN
INSTITUCIÓN EDUCATIVA PRIVADA
“VIRGEN DE GUADALUPE”
NIVEL
SECUNDARIA DE MENORES
CICLO VII BIMESTRE IV
5°
Grad
o
5°
Grad
o
Secundaria
2.
3. 9° UNIDAD Del: ____________
Al:________________
10° UNIDAD Del: ____________
Al:________________
11° UNIDAD Del: ____________
Al:________________
IV BIMESTRE
Del 13 de Octubre 2008 al 16 de Diciembre 2008
I N D I C EI N D I C E
22322399 Introducción a los formularios
2262261010 Crear un formulario
2322321111 Los resultados del formulario
4.
5. CG
VIRG
E N D E G U A D A
LUPE
1 9 7 5
I. E . P.
Introducción a los formularios
Los formularios son uno de los elementos más utilizados para crear interactividad
entre un sitio web y el internauta. Entre los usos más comunes de los formularios
se encuentran las encuestas, los formularios de pedido y las interfaces de
búsqueda.
Descripción
Los formularios necesitan dos componentes para que funcionen correctamente: el
código HTML (que describe el formulario) y una aplicación en la parte del servidor o
una secuencia de comandos en la parte del cliente (para procesar la información que el
usuario introduce en los campos del formulario). Con Frontpage es muy fácil insertar
formularios en tus páginas web, como éste que ves abajo:
Componentes de los formularios
Los formularios sirven para recabar información de los visitantes y se componen de
cuadros de texto de una línea, cuadros de texto con desplazamiento, casillas de
verificación, botón de opciones, menú desplegable o botón de comando. El uso de uno u
otro de estos componentes dependerá de la información que se solicite al visitante.
Vamos a verlos uno por uno.
Cuadro de texto de una línea
GUIA DE APRENDIZAJE N° 09
Tema: Introducción a los formularios.
Contenidos:
Descripción y componentes de los formularios.
6. Estos cuadros de texto se utilizan para que el visitante escriba un texto corto, como el
nombre y apellidos, el número de teléfono o el correo electrónico.
Cuadro de texto con desplazamiento
Estos cuadros de texto se utilizan en los casos en que el visitante debe introducir un
texto más largo, como un comentario o una observación. Se puede navegar a través del
texto con una barra de desplazamiento.
Casilla de verificación
Estas casillas pueden ser activadas o desactivadas por el visitante. Se utilizan para hacer
una pregunta al visitante cuya respuesta consiste en dos opciones: sí/no.
Botón de opción
Cuando existen más de dos posibles respuestas a una pregunta o una petición, se utilizan
los botones de opción. El visitante deberá marcar una de las opciones.
Menú desplegable
El menú desplegable cumple la misma función que los botones de opción: consiste en
que el visitante elija una de entre las opciones propuestas. Su ventaja radica en que
ocupa menos espacio en el formulario, pues las opciones se recogen en un menú
desplegable. Otra de sus ventajas es que permite varias selecciones.
Botón de comando
Los botones ejecutan acciones concretas. Se suelen utilizar para que los visitantes
envíen el formulario después de rellenarlo o borren los campos restableciendo el
formulario en blanco.
7. _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
Además de estos componentes básicos de un formulario, puedes introducir en un
formulario un campo oculto, que contiene información que no quieres que vea el
visitante, o un campo de imagen, que es un botón que contiene una imagen en lugar de
un texto.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
Comprobación
Completa.
1. Los formularios son uno de los elementos más utlizados para crear
interactividad entre un ………………………………………….. y el
…………………………………….
2. Entre los usos más comunes de los formularios se encuentran, las
……………………………., los…………………………………………………………….. y las
………………………..……
3. Los formularios necesitan dos componentes para que funcionen
correctamente:
a) ……………………………………………………………………………………………
b) …………………………………………………………………………………………….
4. Los componentes de los formularios son:
a) ……………………………………………………………………………………..
b) ……………………………………………………………………………………..
c) ……………………………………………………………………………………..
d) ……………………………………………………………………………………..
e) ……………………………………………………………………………………..
Autoevaluación
8. CG
VIRG
E N D E G U A D A
LUPE
1 9 7 5
I. E . P.
Relaciona.
1. Cuadro de texto de una línea ( ) Ejecutan acciones concretas.
2. Cuadro de texto con desplazamiento ( ) Para escribir texto corto.
3. Casilla de verificación ( ) Para escribir texto largo.
4. Botón de opción ( ) Cuando existen más de dos posibles
respuestas.
5. Menú desplegable ( ) Pueden ser activadas o
desactivadas
por el visitante.
6. Botón de comando ( ) Consiste en elegir una de entre las
opciones propuestas
Dibuja
Un Formulario con cualquiera de sus componentes.
Crear un formulario
El primer paso para crear un formulario es definir para qué se va a utilizar, ya
que en función de su utilidad se utilizarán unos campos y no otros. Normalmente
los formularios se usan para recibir peticiones, organizar consultas, pedir a los
visitantes que se identifiquen en un sitio web con nombre de usuario y contraseña,
etc.
Procedimiento
Puedes crear un formulario nuevo o crearlo a partir de las plantillas que ofrece
Frontpage. En el primer caso, la forma de crearlo es a través de Menú Insertar >
Formulario > Formulario, aunque también puedes hacerlo a partir de las plantillas de
GUIA DE APRENDIZAJE N° 10
Tema: Crear un formulário.
Contenidos:
Procedimiento, Propiedades.
9. Frontpage. Para crearlo desde una plantilla, elige Menú Archivo > Nuevo > Página. En
la pestaña General encontrarás algunas plantillas, como Formulario de comentarios,
Libro de invitados, Registro de usuarios, etc.
Al crear un nuevo formulario sin utilizar las plantillas, Frontpage crea un cuadro de
líneas discontinuas, que será la zona activa del formulario. Ningún elemento del
formulario puede crearse fuera de esta zona rectangular. Al mismo tiempo, Frontpage
también ha insertado los botones ‘Enviar’ y ‘Restablecer’, ya que todo formulario debe
tener estos botones.
El siguiente paso es introducir los campos que conformarán el formulario. Para ello,
utiliza las distintas opciones de Menú Insertar > Formulario. Cada uno de los campos
puede colocarse en la página de la misma forma que el texto: puedes utilizar saltos de
línea, tablas, alineaciones, líneas horizontales, etc. Cada uno de los campos, sean del
tipo que sean, se componen de dos elementos: la etiqueta y el contenido. La primera
especifica qué se le está pidiendo al visitante y el segundo es el espacio que se reserva
para que el visitante introduzca los datos. Para escribir una etiqueta, simplemente sitúa
el cursor al lado del campo y escribe. Por ejemplo:
10. Propiedades de los elementos de formulario
Una vez has establecido dentro del formulario todos los elementos que lo conforman,
puedes modificar las propiedades de cada uno. Para ello, haz doble clic sobre cada
elemento. Para cada tipo de elemento aparece un cuadro de diálogo distinto. Vamos a
verlos:
Propiedades de un cuadro de texto
1. Nombre
Es una referencia interna, no debes confundirlo con el texto que se muestra junto al
campo en el formulario, que es la etiqueta. T1, T2, T3, ... son los nombres
predeterminados para los cuadros de texto de una línea, aunque puedes cambiarlos por
otros nombres que sean más significativos para ti. Debes tener en cuenta que los
resultados del formulario incluirán estos nombres de campos.
2. Valor inicial
En este campo puedes escribir el texto que aparecerá en el cuadro de texto cuando el
formulario se abra por primera vez.
3. Ancho en caracteres
Introduce el número de caracteres que va a determinar el ancho del cuadro de texto. No
significa que el visitante solamente podrá introducir este número de caracteres, sino que
es una medida de longitud de la anchura del campo.
4. Orden de tabulación
Determinará la posición del campo en el orden de tabulación del formulario. Crea un
orden lógico, de arriba a abajo y de izquierda a derecha. Haciendo clic en la tecla
Tabulador, el visitante podrá saltar de forma sencilla de un campo a otro.
5. Campo de contraseña
11. Marca la opción ‘Sí’ si se trata de un campo que va a contener una contraseña. De esta
forma, cada carácter introducido se convierte en un asterisco.
Propiedades de una casilla de verificación
1. Nombre y Orden de tabulación
Para rellenar estos campos sirven las indicaciones vistas arriba.
2. Valor
En este campo está el valor que se devuelve con los resultados del formulario si se
selecciona la casilla. Puedes cambiar el valor predeterminado ‘ON’ por ‘Sí’.
3. Estado inicial
En este campo elige una de las dos opciones, que aparezca activada al cargar la página o
que aparezca desactivada.
Propiedades de un botón de opción
Para los cuatro campos que te aparecen en este cuadro de diálogo sirven las indicaciones
vistas para la casilla de verificación.
Propiedades de un menú desplegable
12. 1. Nombre y Orden de tabulación
Estos campos los rellenarás siguiendo las indicaciones vistas arriba.
2. Opciones
En la parte central del cuadro de diálogo se disponen las diversas opciones que tendrá el
menú desplegable. Puedes hacer clic en el botón ‘Agregar’ para introducirlas. Después,
utiliza los botones ‘Subir’ y ‘Bajar’ para determinar qué opciones se mostrarán más
arriba del menú y cuáles más abajo.
3. Alto
En este campo especifica la cantidad de líneas de texto que deseas que aparezcan en el
cuadro desplegable. Por ejemplo, si el menú desplegable tiene tres opciones, puedes
establecer la altura en 3 para que todas las opciones estén visibles.
4. Permitir selecciones múltiples
Si seleccionas la opción ‘No’, el visitante solamente podrá seleccionar una opción.
Propiedades de un botón de comando
13. 1. Nombre y Orden de tabulación
Para rellenar estos campos sigue las indicaciones vistas arriba.
2. Tipo de botón
Normalmente utilizarás dos tipos de botones en tus formularios: ‘Enviar’ y
‘Restablecer’. El tipo ‘Normal’ crea un botón de comando personalizado para el que
deberás definir una secuencia de comandos que ejecute la acción concreta que deseas.
3. Valor/Etiqueta
Dependiendo del tipo de botón elegido, el valor de la etiqueta será, de forma
predeterminada, ‘Enviar’ o ‘Restablecer’. Puedes cambiar estos valores por otros, como
‘Envíalo’, ‘Borrar’, ‘Ya está’, etc.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
La mejor manera de alinear las etiquetas con sus contenidos es mediante una tabla. Para
ello crea una tabla de dos columnas, en la de la izquierda puedes poner las etiquetas, y
en la de la derecha los campos. De esta forma tu formulario quedará más organizado y
profesional.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
Comprobación
Completa.
1. El primer paso para crear un formulario es definir para que se va a
………………………….
2. Normalmente los formularios se usan para recibir ……………….
……………………….... , ………………………………… ,
…………………………………………………………
3. Puedes crear un formulario …………………… o a partir de las
……………………………..
4. Los campos se componentes de dos elementos:
a) ………………………………….
b) ………………………………….
5. Todos los elementos del formulario se pueden ……..………………………
Autoevaluación
14. Dibuja.
Dibuja un cuadro de texto con sus propiedades.
Crear un formulario de
sugerencia tienes más información sobre el grupo de música Juliet
y quieres compartirlo con nosotros, o simplemente quieres
decirnos lo que piensas de este sitio, puedes hacerlo aquí.
Agradeceremos todos sus comentarios y sugerencias’.
2. Sitúa el punto de inserción bajo este texto y elige Menú Insertar > Formulario >
Formulario. Frontpage crea un cuadro de líneas discontinuas que marcan los límites del
formulario. Además, agrega de forma predeterminada los botones Enviar y Restablecer.
3. Sitúa el punto de inserción sobre los botones y escribe ‘Clase de comentario’. Salta
una línea y elige Menú Insertar > Formulario > Botón de opción. Crea de esta forma 4
botones de opción en la misma línea. Cada uno de ellos tendrá una etiqueta, que serán:
Queja, Problema, Sugerencia, Elogio.
4. Bajo la línea de botones de opción inserta un campo de texto con desplazamiento. Su
etiqueta debe ser: ‘Escribe tus comentarios en ese espacio’
5. Deja los botones de Enviar y Restablecer como están y guarda la página dentro de tu
sitio con el nombre ‘comentario.htm’
Resultado
Previsualiza el resultado de tu trabajo en la pestaña Vista Previa. Al final tu nueva
página debe quedar más o menos así:
P R Á C T I C A
15. CG
VIRG
E N D E G U A D A
LUPE
1 9 7 5
I. E . P.
Los resultados del formulario
El fin de todo formulario es recopilar los datos que ha enviado el visitante para
guardarlos y utilizarlos. A esto se llama resultados del formulario y Frontpage
proporciona distintos sistemas para gestionarlos.
Destino de los resultados
Una vez que el visitante envía el formulario, deben reunirse los datos que se han
introducido, llamados resultados del formulario, para poder verlos, mostrarlos al
visitante o trabajar con ellos si es necesario. FrontPage proporciona varios controladores
de formulario, que toman los resultados y llevan a cabo distintas acciones. Por ejemplo,
puedes guardar los resultados en un archivo de texto o de HTML, puedes enviar los
resultados por correo electrónico, puedes guardar los resultados en una base de datos, o
bien utilizar secuencias de comandos personalizadas para controlar los resultados del
formulario.
Para definir el destino que van a tener los resultados de un formulario, sitúate sobre él y
elige Propiedades de formulario del menú contextual. Te aparecerá una ventana como
ésta:
GUIA DE APRENDIZAJE N° 11
Tema: Los resultados del formulario.
Contenidos:
Destino de los resultados.
16. Puedes elegir entre:
1. Guardar los resultados en un archivo
Cada vez que un visitante envía un formulario, Frontpage anexará los resultados en un
archivo del que debes definir su nombre y su ubicación. Después, puedes abrir el
archivo y ver los resultados. Haz clic en el botón Opciones para ver las posibilidades de
formato de archivo que te permite el programa. Si tienes un libro de visitas para tu web,
puede resultar interesante guardar los resultados en un archivo HTML. Así, podrás crear
un vínculo a ese archivo para que los visitantes puedan ver lo que otros han escrito.
2. Enviar los resultados por correo electrónico
Cada vez que un visitante envía un formulario, Frontpage enviará un mensaje de correo
electrónico a la dirección que establezcas que contiene los resultados de dicho
formulario. Haz clic en el botón Opciones para ver las distintas posibilidades de esta
opción, como por ejemplo elegir el formato del correo, el asunto que llevará, etc.
3. Guardar los resultados en una base de datos
Cada vez que un visitante envía un formulario, Frontpage guardará la información en
una base de datos. Por ejemplo, si utilizas un formulario para reunir información de
contacto, puedes guardar los resultados directamente en una base de datos. Si haces clic
en el botón Opciones podrás elegir la base de datos en la que se guardará la información
del formulario, crear una nueva base de datos, elegir los campos que se guardarán y la
tabla de la base de datos en la que lo harán, etc.
4. Usar una secuencia de comandos personalizada
Puedes utilizar tu propia secuencia de comandos personalizada (ISAPI, NSAPI o CGI)
como controlador de formulario. Utiliza el botón Opciones para ver más opciones.
La página de confirmación
17. El último paso en la creación de un formulario consiste en definir una página de
confirmación, que es la que verán los visitantes una vez que hayan enviado un
formulario. La página de confirmación suele mostrar un mensaje de agradecimiento y el
contenido de uno o más campos del formulario. El visitante puede confirmar que la
información se introdujo correctamente y, si es necesario, puede volver al formulario y
rellenarlo nuevamente.
Puedes crear tu propia página de confirmación o dejar que sea Frontpage quien la cree.
La página de confirmación predeterminada de Frontpage muestra una lista de nombres
de campos del formulario y sus valores.
Para crear una página de confirmación personalizada, sigue estos pasos:
1. Abre una página en blanco y escribe el texto que quieres mostrar después de que el
visitante haya enviado el formulario. Por ejemplo: “Muchas gracias por su comentario.
Con él nos ayuda a mejorar constantemente”.
2. Si quieres mostrar la información que el visitante ha introducido en el formulario para
que verifique si los datos son correctos, elige Menú Insertar > Componente > Campo de
confirmación.
3. En el cuadro Nombre del campo de formulario que se va a confirmar, escribe el
nombre del campo a partir del cual se muestra la información y después haz clic en
Aceptar. El nombre del campo aparecerá entre paréntesis en la página. Cuando se
muestre la página de confirmación al visitante, este campo mostrará en su lugar el dato
que ha introducido del visitante. Repite este paso en cada campo que desees mostrar.
18. 4. Guarda la página.
5. Para asignar la página de confirmación que has creado al formulario, abre la página
que lo contiene y Propiedades de formulario en el menú contextual. Después, haz clic en
el botón Opciones y en la ficha Página de confirmación.
6. En el cuadro Dirección URL escribe el nombre y la ubicación de la página de
confirmación que acabas de crear o haz clic en Examinar para localizarla.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
Si vas a utilizar alguno de los controladores de formulario en lugar de una secuencia de
comandos personalizada, debes asegurarte antes de que las Extensiones de servidor de
Frontpage están instaladas en el servidor en el que está ubicado el sitio web.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
Comprobación
Dibujar 2 formularios distintos.
20. Crear una página de confirmación
La página de confirmación se suele utilizar para agradecer al visitante el haber rellenado
el formulario y también para confirmar que los datos introducidos en él son correctos.
Desarrollo
1. Crea una página en blanco y escribe: ‘Muchas gracias por su comentario, con él nos
ayuda a mejorar constantemente’.
2. Guarda la página en tu sitio con el nombre ‘confirmacion.htm’.
3. Cierra la página ‘confirmacion.htm’ y abre la página que contiene el formulario:
‘comentario.htm’. Haz clic con el botón derecho dentro del formulario y elige
Propiedades de formulario. Después haz clic en el botón Opciones y en la ficha Página
de confirmación.
4. Haz clic en el botón Examinar para seleccionar la página ‘confirmacion.htm’.
Resultado
Esto es todo. Con estos sencillos pasos habrás creado una página para agradecer a los
visitantes el haber rellenado el formulario.