Formularios en paginas web

Un formulario web dentro de una página web permite al usuario introducir datos los cuales son enviados a un servidor para ser procesados. Los formularios web se parecen a los formularios de papel porque los internautas llenan dichos formularios usando casillas de selección, botones de opción, o campos de texto. Por ejemplo, los formularios web pueden ser usados para introducir datos de envío o datos de una tarjeta de crédito con el objetivo de solicitar un producto o bien ser utilizada para solicitar datos (p. ej., al buscar en un motor de búsqueda).

Además de servir como plantillas para nueva información, los formularios web también pueden ser usados para consultar y mostrar información existente en forma similar a los formularios de combinación de correspondencia, incorporando las mismas ventajas. La separación entre la estructura y los datos subyacentes de un mensaje permite a ambos variar independientemente. El uso de formularios webs para este propósito evita los problemas asociados con la creación explícita de páginas web separadas para cada registro en una base de datos.

Los formularios web están definidos en lenguajes de programación como HTML, Perl, Java o .NET. Las implementaciones de estos lenguajes usualmente invocan automáticamente los idiomas de la interfaz de usuario y otras de sus características, tales como el diseño estructural, y tema, minimizando el tiempo, el costo y el tiempo de programación.

Un formulario en XHTML o HTML es la forma más común de usar un formulario en línea. Utilizando solamente las etiquetas <form> e <input> es posible diseñar la mayoría de formularios de las aplicaciones web.

Los siguientes elementos pueden formar parte de un formulario del lado del usuario:

• Input²
  • type = (para indicar uno de los tipos de control del formulario)
    • Text: una caja de texto que permite ingresar una sola línea de texto.
    • Checkbox: una casilla de selección.
    • Radio: un botón de opción.
    • File: un examinador para subir archivos.
    • Reset: un botón de reinicio que al activarse le dice al navegador que restaure los valores del formulario a su estado inicial
    • Submit: un botón que le dice al navegador que realice la acción del formulario (referido típicamente a mandarlo al servidor).
• Algunas aplicaciones web utilizan otros elementos de formulario que no se pueden crear con <input>. Las listas desplegables y las áreas de texto disponen de sus propias etiquetas (<select> y <textarea> respectivamente):³
  • Select: una lista de elementos que el usuario puede seleccionar.
  • Textarea: muy parecido a la caja de texto pero con la posibilidad de escribir múltiples líneas.

La imagen de ejemplo de la derecha muestra todos estos elementos:

• Una caja de texto que permite ingresar un nombre.
• Un par de botones de opción para seleccionar el sexo.
• Una lista de colores de ojos a elegir.
• Un par de casillas de selección que son seleccionadas si se aplican al usuario.
• Un área de texto que describe la habilidad atlética.
• Un botón submit para enviar la información al servidor.

Estos elementos básicos proveen la mayor cantidad posible de elementos de las interfaces gráficas, pero no todos. Por ejemplo, no hay equivalentes a un combobox, globos de ayudas, vista de árbol, o vista tabular. Una vista tabular, sin embargo, puede ser imitada usando una tabla HTML estándar con elementos input text en cada celda. Una vista de árbol puede ser imitada por medio de tablas anidadas o bien, semánticamente hablando, con listas anidadas. Muchos de estos elementos están disponibles por medio debibliotecas de JavaScript.