Un formulario web (en inglés web form) permite al usuario introducir datos para que sean enviados a un servidor web para que sean procesados.
Cuando realizas una búsqueda en un buscador e introduces las palabras que quieres buscar, estás utilizando un formulario web.
Cuando te registras en un sitio web e introduces tus datos personales, estás utilizando un formulario web.
Cuando realizas una compra e introduces los números de tu tarjeta de crédito, estás utilizando un formulario web.
Cuando realizas una actividad de tipo test en este curso, estás utilizando un formulario web.
En definitiva, un formulario web es un elemento básico en cualquier sitio web.
En las siguientes lecciones vas a aprender a crear formularios con HTML. Sin embargo, los formularios que vayas a crear no van a funcionar, ¿por qué?
Un formulario se compone de dos partes, la parte cliente y la parte servidor. La parte cliente es la que vas a aprender en este curso: la creación del formulario. La parte servidor es la encargada de recibir los datos para procesarlos, como por ejemplo insertarlos en una base de datos. Esta parte no te la vamos a enseñar en este curso, queda pendiente para otro curso.
A continuación se explican los formularios tradicionales con HTML (qué es un formulario, para qué sirve un formulario), se muestran las etiquetas y atributos que se emplean en un formulario y los métodos de envío (GET, POST). Además, se explican los siguientes controles de un formulario:
input.
text.
checkbox.
radio.
file.
password.
hidden.
button.
submit.
image.
reset.
Los usuarios normalmente rellenan un formulario modificando sus controles, antes de enviar el formulario a un agente para que lo procese (a un servidor web, a un servidor de correo, etc.)
¿Y para qué se utilizan?
Pues justamente para eso, para permitir que el usuario envíe información al servidor.
Formularios de registro o acceso a sitios web, formularios de contacto; hasta para escribir un comentario en Facebook estamos utilizando un formulario.
Los formularios se envían mediante dos métodos: GET y POST.
Con GET, el envío está limitado y la información enviada es visible; sin embargo, es útil para poder guardar el resultado en marcadores o favoritos.
y con POST, el envío no tiene limitación y los datos no son visibles en la URL, además, permite la subida de archivos.
Todas las etiquetas de formulario deben ir entre etiquetas <form> y </form> para que su información sea enviada con el formulario.
La etiqueta <input /> es de las más utilizadas en formularios, con ella podemos definir gran parte de los controles típicos de formularios: entradas de tipo texto, casillas de verificación y de opción (conocidas como radio), archivos, contraseñas, campos ocultos y botones varios.
“action” es el único atributo requerido para la etiqueta <form>.
Especifica siempre el atributo “type”.
Necesitarás un botón “submit” para enviar el formulario.
En la medida de lo posible, separa contenido de estilos, lo agradecerás cuando tengas que mantener la web.
Permitir al usuario escribir texto con más de una línea de forma cómoda mediante <textarea>.
Cómo hacer más accesibles nuestros formularios utilizando etiquetas <label> para asociar texto a controles.
Y a agrupar controles en conjuntos con <fieldset> para hacer los formularios más digeribles para el usuario.
Cómo hacer más accesibles nuestros formularios utilizando etiquetas <label> para asociar texto a controles.
Y a agrupar controles en conjuntos con <fieldset> para hacer los formularios más digeribles para el usuario.
Consejos que espero te sean de utilidad:
Utiliza <textarea> en lugar de <input /> de tipo texto cuando el usuario vaya a escribir cantidades de texto considerables.
Usa <select> en lugar de <input /> de tipo “radio” cuando ofrezcas tres o más posibilidades al usuario.
Y, en la medida de lo posible, facilita el trabajo a tus usuarios mediante la etiqueta <label>.
EJEMPLO FORMULARIO DE REGISTRO
Click en la imagen para ampliar
No hay comentarios:
Publicar un comentario