miércoles, 30 de julio de 2014

Form - Realizar una encuestas

Fecha: Julio 30 de 2014
Asignatura: Tecnología e Informática.
Formación en Valor: Autonomía.
Núcleo Integrador: Área de Texto - <textarea>, Elementos de entrada <input> y campo contraseña.
Objetivo: Crear formularios para capturas de datos en páginas web.

Teniendo en cuenta el siguiente código HTML, copie y visualice la página web. desarrolle una página que muestre una encuesta de satisfacción para los clientes de su empres.

<html>
<head> <title>Formulario Y Tablas! </title></head>
<body text="Black" bgcolor="Violet">
<table  border="5" bgcolor="white"">
<th colspan="10"> Encuesta Colegio Eucaristico</th>
<form>
<tr>
<td>Escriba Su Nombre Completo
<br>
<input name="nombre" Type="Text" Size="50">
<br><br>
Escriba Su Contraseña <br>
<input name="nombre" Type="Password" Value="Contraseña" Size="50">
<br>
<td>Seleccione El Sexo <BR>
Masculino <input name="SEXO" type="radio" value="masculino"> <BR>
Femenino <input name="SEXO" type="radio" value="Femenino" checked> <BR><br>
</td>
</tr>

<tr>
<td>Ocupacion <br>
 <input name="ocupacion" type="text" size="50" maxlenght="50">
</td>
<br>
<td>Seleccione Ocupacion<br>
Trabajador<input name="ocupacion" Type="Radio" Value="trabajador"><br>
Estudiante<input name="ocupacion" Type="Radio" Value="estudiante" checked><br>
Ama de Casa<input name="ocupacion" Type="Radio" Value="Ama de casa" checked><br>
Otros<br><input name="ocupacion" Type="Text" Value="Cual?" Size="40" maxlength="50">
</td>

<tr>
<td>En Que Ciudad Vive?
<br>
</td>
<br>
<td>
<select name="ciudad">
<option selected>--- Elige la Ciudad ---</option>
<option>Cartagena</option>
<option>Barranquilla</option>
<option>Santa Marta</option>
</select>
</td>
</tr><br><br>

<tr>
<td>Cual es Su Animal Preferido?
<br>
</td>
<br>
<td>Seleccione La Raza<br>
Pincher <input name="Sexo" Type="Radio" Value="Pincher"><br>
Labrador<input name="Sexo" Type="Radio" Value="Labrador" checked><br>
Pastor Aleman<input name="Sexo" Type="Radio" Value="Pastor Aleman" checked><br>
Golden<input name="Sexo" Type="Radio" Value="Golden" checked><br>
Perro Siberiano<input name="Sexo" Type="Radio" Value="Perro Siberiano" checked><br>
Otros<br><input name="cuidad" Type="Text" Value="Cual?" Size="40" maxlength="50">
</td>
</tr>

<tr>
<td>Esta Usted Interesado Por El Medio Ambiente?<br>
</td>
<td>
<select name="animal" size="3" multiple>
 <option selected>---Seleccione su Respuesta ---</option>
  <option value="ave">Si</option>
  <option>No</option>
  <option>Tal vez</option>
  <option>En Absoluto</option>
</select>
</td>

<tr>
<td>Usted Ha Ayudado a Evitar El Calentamiento Global?
<br></td>
<br>
<td><br>
No<input name="Sexo" Type="Radio" Value="Pincher"><br>
Si<input name="Sexo" Type="Radio" Value="Labrador" checked><br>
Algunas Veces<input name="Sexo" Type="Radio" Value="Pastor Aleman" checked><br>
Porque?<br><input name="cuidad" Type="Text" Value="Explique su Respuesta" Size="40">
</td>
</tr>

<tr>
<td>Que Piensa Usted De los Eco-Apagones?
<br>
</td>
<br>
<td><br>
No Sirven Para Nada<input name="Sexo" Type="Radio" Value="Pincher"><br>
Nos Ayudan a Ahorrar<input name="Sexo" Type="Radio" Value="Labrador" checked><br>
Porque?<br><input name="cuidad" Type="Text" Value="Explique su Respuesta" Size="40" maxlength="50">
</td>
</tr>

<tr>
<th colspan="2"> <input name="SUBMIT" type="submit" value="Aceptar"></th>
</form>
</body>
</html>

lunes, 28 de julio de 2014

Formularios - Atributos

Formulario <form>

Fecha: Julio-28-2014
Asignatura: Tecnología e Informática.
Formación en Valor: Amutonomía.
Núcleo Integrador: Formularios <Form> - Atributos.
Objetivo: Identificar y aplicar los atributos de los formularios..

Un formulario es un elemento que permite recoger datos introducidos por el usuario.
Un formulario está formado, entre otras cosas, por etiquetas, campos de texto, menús desplegables, y botones.
Es muy recomendable utilizar tablas para organizar los elementos de los formularios. Utilizando tablas se consigue una mejor distribución de los elementos del formulario, lo que facilita su comprensión y mejora su apariencia.
Los formularios se insertan a través de las etiquetas <form> y </form>. Entre dichas etiquetas habrá que insertar los diferentes objetos que formarán el formulario. la etiqueta <form>tiene los siguientes atributos:

Los formularios se utilizan para conocer las opiniones, dudas, y otra serie de datos sobre los usuarios, para introducir pedidos a través de la red, tienen multitud de aplicaciones.

Los formularios se insertan a través de las etiquetas <form> y </form>. Entre dichas etiquetas habrá que insertar los diferentes objetos que formarán el formulario. la etiqueta <form>tiene los siguientes atributos:

El atributo action indica una dirección de correo electrónico a la que mandar el formulario, o la dirección del programa que se encargará de procesar el contenido del formulario.

El atributo enctype indica el modo en que será cifrada la información para su envío. Por defecto tiene el valor application/x-www-form-urlencoded.

El atributo method indica el metodo mediante el que se transferirán las variables del formulario. Su valor puede ser get o post.

El valor get se utiliza cuando no se van a producir cambios en ningún documento o programa que no sea el navegador del usuario que pretende mandar el formulario, como ocurre cuando se realizan consultas sobre una base de datos.

El valor post se utiliza cuando sí se van a producir cambios, como ocurre cuando el usuario manda datos que deben ser almacenados en una base de datos.

Se recomienda utilizar el valor post.

Ejercicio: Copie y pegue esta código en un documento (Bloc de Notas) y grabe el archivo como formulario.html

<html>
 <head> <title> Formularios en paginas Web </title></head>
<body>
<H1>ENCUESTA DEL COLEGIO EUCARISTICO</H1><BR>
<form action="mailto:mi_correo@gmail.com" method="post" enctype="text/plain" >
Escriba las observaciones que tenga sobre el colegio <BR>
<textarea name="Observaciones" cols="60" rows="3">Escribe tus observaciones</textarea>
 <BR>
<input name="boton" type="submit" value="Enviar">
</form>
</body>
</html>


Debe aparecer la siguiente información:

Llene la observación y luego de clic sobre el botón ENVIAR.

Nota: Si tiene cuenta con gmail. puede notar que al dar clic en el botón ENVIAR, se activa el correo y muestra la información capturada. lista para enviar al correo.

miércoles, 16 de julio de 2014

Páginas Web con Marcos o Frame - Taller

Fecha: Julio 16 de 2014.
Asignatura: Tecnología e Informática.
Formación en Valor: Autonomía
Núcleo Integrado: Marcos <frameset> - Taller.
Objetivo: Desarrollo de páginas Web utilizando Marcos o Frame.

Taller: Desarrolle un sitio Web con las siguientes características:
1. Debe utilizar el formato de la clase pasada donde se trabajaba en Frame o Marcos (Utilizando los archivos INDEX.HTML, MARCO_IZQUIERDO.HTML, MARCO_PRINCIPAL.HTML, MARCO_SUPERIOR.HTML), adicional a estos archivos se debe trabajar con las siguientes páginas Web:
  • a. Quienes Somos.
  • b. Misión y Visión.
  • c. Lista de Productos de la empresa.
  • d. Producto principal de la empresa.

2. Las páginas anteriores deben estar vinculadas por medio de la página MARCO_IZQUIERDO.HTML, los vínculos deben hacer sobre imágenes.

3. Todas las páginas deben estar organizadas utilizando Tablas (MARCO_SUPERIOR.HTML, es la excepción).