creacion web diseño pagina web reformas

 

 

                   

FORMULARIOS

Los formularios son los principales elementos que permiten que el visitante interactúe con nuestra pagina.

Los formularios son programas que están escritos en lenguajes de programación como: C, Perl, Java, Visual Basic, a este tipo de programas se les suele denominar como CGI (Common Gateway Interface). Los formularios son plantillas en las cuales el usuario introduce los datos o selecciona una opción y la envía a un servidor o a nuestra dirección de correo electrónico, (la cual utiliza lo que en programación se conoce con el nombre de "Código Transportable"). Un formulario trabaja básicamente así: el visitante selecciona diferentes datos (campos) cada uno de los cuales quedará asociado a una variable. La principal aplicabilidad de los formularios es la posibilidad de crear cuestionarios, encuestas, páginas de comentarios o cualquier documento en la que se desee una interacción por parte del usuario.

La etiqueta utilizada para crear un formulario es <FORM>...<FORM>.

Para que esta etiqueta pueda funcionar debe tener unos atributos.

Cajas de texto

Existen tres formas de insertar un texto en un formulario.

La primera es <INPUT TYPE="TEXT" name=nombre>

EJEMPLO:



El valor TYPE="TEXT" indica que el tipo de dato que se va a introducir es un texto.

La segunda forma de insertar un texto es una variacion de la primera en vez de colocar TYPE=TEXT se coloca TYPE=PASSWORD.

EJEMPLO:



El valor TYPE="PASSWORD" indica que lo que se va a introducir es una clave o una contraseña.

A simple vista no se puede diferenciar la una de la otra, la variacion se da a el momento que la persona introduce los datos. En el primero aparece el texto normal, en el segundo aparecen una estrellitas(esto es por razones de seguridad).

El tamaño de la caja tambien se puede variar esto se hace a traves del valor SIZE. Su valor por defecto es de 20.

Existe otro atributo que es MAXLENGTH el cual define el número máximo de caracteres que puede introducir el usuario.

Por ultimo esta VALUE que indica el texto por defecto que contendrá la caja.

EJEMPLO

Por favor, introduce tu nombre:<br>
<form>
<input type="password" name="Nombre" size="10" maxlength="10">
</form>

El cual se veria asi:

Por favor, introduce tu nombre:
La tercera forma de introducir un texto es a traves de la etiqueta <TEXTAREA> ...</TEXTAREA>

EJEMPLO:



Al igual que el anterior tambien se puede modificar su tamaño:

ROWS define el numero de filas que ocupará la caja de texto.

COLS Columnas que ocupará la caja de texto

EJEMPLO:

<form>
Introduce la opinión que se merece este tutorial:<br>
<textarea name="comentario" rows="8" cols="60">
</textarea>
</form>

El cual se veria asi:

Introduce la opinión que se merece este tutorial:


Elementos de Menú

Estos elementos le permitirán a nuestro visitante elegir entre varias opciones, que han sido predeterminadas por nosotros. Esto lo podemos hacer de dos maneras. La primera es:

<INPUT NAME="Respuesta" TYPE=RADIO VALUE="mal">mal
<INPUT NAME="Respuesta" TYPE=RADIO VALUE="bien">bien
<INPUT NAME="Respuesta" TYPE=RADIO VALUE="nada">nada

El cual se veria asi:

mal
bien
nada


Para asociar varios botones de radio a una misma variable les pondremos a todos ellos el mismo NAME. Aparte de esto acepta los siguientes parámetros:

VALUE Este es el valor que asignará a la variable.

CHECKED Si lo indicamos en una de las opciones esta será la que se active por defecto.

La segunda forma es por medio de listas de selección. Para emplearlas deberemos utilizar dos etiquetas, SELECT y OPTION. Veamos un ejemplo:

<SELECT NAME="Colores">
<OPTION>Rojo
<OPTION>Azul
<OPTION>Verde
<OPTION>Otros
</SELECT>

El cual se veria asi:



Explicacion:

<select name="Colores"> Aquí definimos el nombre de la variable que contendrá la información.

option Con esta etiqueta definimos cuantas opciones consideremos necesarias.

</select> Esta cierra la definición de este elemento del formulario.

Atributos de SELECT

SIZE Indica el número de opciones que podremos ver. Si es mayor que 1 veremos una lista de selección y, si no, veremos una lista desplegable.

MULTIPLE Si lo indicamos podremos elegir más de una opción.

Atributos de OPTION

VALUE Este es el valor que asignará a la variable

SELECTED Si lo indicamos en una de las opciones esta será la seleccionada por defécto.Este atributo es utilizado cuando no queremos que aparezca la primera opción selecionada.

Elementos de confirmación

Puede que yo solamente necesito que el usuario sencillamente me confirme o niegue algo. Lo podremos conseguir por medio de controles de confirmación:

<input type="checkbox" name="nombre-variable">

Ejemplo:

<input type="checkbox" name="feo"&eres feo

El Cual se veria asi:

eres feo

Por defecto esa casilla siempre va a aparecer desactiva si queremos activarla desde el principio utilizamos el valor checked

Ejemplo:

<input type="checkbox" name="feo" checked>eres feo

El Cual se veria asi:

eres feo

Botones

Existen dos tipos de botones : uno que se utiliza para mandar el formulario y otro que sirve para limpiar todo lo que haya rellenado el usuario en caso tal de que se equivoque.

Ejemplo:

<INPUT TYPE=SUBMIT>
<INPUT TYPE=RESET>

El cual se veria asi:



Estos botones por si solo no cumplen ninguna funcion, habria que especificarles la URL a la cual queremos que lleguen esos datos. Supongamos que seria para nuestro correo electronico. Seria asi:

Desea usted recibir información sobre:

<form action="mailto:dirección de correo" method="post" enctype="text/plain">
<input type="radio" name="Información" value="sexo">sexo.
<input type="radio" name="Información" value="">ciencia
<input type="radio" name="Información" value="humor">humor
<input type="submit" value="Enviar">
<input type="reset" value="Borrar">

El cual se veria asi:

Desea usted recibir información sobre:

sexo.
Internet.
humor


Explicacion:

ACTION=URL
Contiene la URL del programa CGI encargado de interpretar la entrada del suario y generar los resultados oportunos.

METHOD= GET / POST Tiene un significado. En principio puede tomar como valor cualquiera de los métodos de transferencia de datos reconocidos por HTTP, pero en la práctica sólo se emplean 2:

GET. Añande los argumento del formulario al URL que se especifica en ACTION (usando como separador el símbolo ?), lo que da lugar a que el programa los reciba como párametros de entrada.

POST. Envía los datos como parte de la entrada estándar.

Otros elementos

TYPE=“hidden”

Es simplemente un almacenamiento interno de datos. El visualizador no muestra el contenido, recogido en el atributo VALUE, pero sí se lo pasa al programa CGI. Resulta un componente muy adecuado para guardar información que se mantiene estable en la página (como un determinado valor que nos indica que los datos que provienen de esta página son los correctos y no otros de otra página distinta). Por ejemplo, si en un documento dado ha leido el nombre de usuarios, éste puede pasar de una página a otra a través de ete tipo de entrada, en vez de agrandar la lista de parámetros añadidos al URL.

<INPUT TYPE=“hidden” NAME=“browser” VALUE=“Arena”>

Este ejemplo, toma un valor oculto (hidden) en la variable browser, como valor “Arena”, que es un tipo de navegador que reconoce el HTML 3.0.

TYPE=“image”

Hace que el visualizador presente una imagen que es sensible al ratón. Lo que el formulario envía al servidor es un registro cuyos campos son el nombre definido para la imagen seguido de los parámetros .x=n .y=n donde n son los números de las coordenas x y del punto en el que estaba el ratón en el momento del envío. Para presentar la imagen se utiliza el atributo SRC del elemento IMG. Este sería un ejemplo de respuesta:

imagen.x=99&imagen.y=15

Se escribe:

<FORM METHOD="POST" ACTION="cgi-bin/mail.pl">
>INPUT TYPE=IMAGE NAME="imagen" SRC="mail.gif">
</FORM>

Los formularios que utilicen este tipo de recursos pueden prescindir del tipo SUBMIT, ya que el formulario se cierra con la imagen.

Fundamentos del lenguaje de programación de web HTML Encabezamiento titulo y cuerpo del documento Otros tabas diferentes Caracteres especiales para incluir en ele documento html cambiar los tamaños y los diferentes tipos de letras todos los codigos de los colores en exadecimal Parrafos salto de linea parrafos horizontales LISTAS TABLAS PARA INSERTAR EN LA WEB Links hacia otras paginas web dentro de tu web o en Internet Insertqar imagenes en la web Formularios para que tus visitantes se comuniquen con Vd. via E-Mail y lleguen a su correo Construir frames para tus páginas web Para insertar videos Applets de Java o animaciones de flash PARA PRACTICAR CON LOS CODIGOS CONTENIDOS EN ESTE MANUAL el sisteme es sencillo copiar el codigo y pegar luego darle a prewie PARA crear botones para tu pagina web desde aqui en linea PARA crear POPUPS para tu pagina web desde aqui en linea PARA crear Botones en flash explicacion de como hacerlo PARA poner sonidos a tus botones  en flash explicacion de como hacerlo PARA Mirar los codigos exadecimales de los colores apropiados para web PARA crear menus descriptivos para tu web desde aqui en línea PARA crear menues dinamicos para tu web en linea desde aquí PARA crear menus en arbol como los del explorador de windows PARA crear textos arcoiris en coloreds para  web desde aqui en linea PARA crear POPUPS para tu pagina web desde aqui en linea PARA crear mas botones para tu pagina web desde aqui en linea PARA poner las barras de navegación del explorador en colores  Por si quieres que tu web aparezca en esta página intercambia tu link aquí  En ete foro podeis consultarnos cualquier tipo de tema de los que aborda este manual aplicaciones aquí  Programas gratuitos para el diseño y mantenimiento de sitios web algunos diseñados en esta web aquí El mejor Top de paginas en Español de la Red WEBMASTER INSCRIBE TU PÁGINA PROMOCIONATE

Manual tutorial en linea dee HTML con ejemplos practicos y editores tambien en linea para practicar o crear directamente una página web Miles de logos para moviles Nokia todos los logos nokia en una sola pagina web Programas utiles para diseñar y crear paginas web totalmente gratuitos Club de contactos y ligues para usuarios de este manual de html

Diseño profesional de webs | Lista de precios Recursos para websmasters gratuitos | Oferta especial | CONTACTENOS | Aquí su publicidad