Creacion formularios

Para entender la utilidad y desarrollo de formularios web, es necesario remontarnos a uno de los lenguajes donde actualmente sigue vigente y podemos desarrollar cualquier tipo de formulario. Estoy hablando del leguaje HTML que hoy día ya esta en su version HTML5.

Que es HTML?

“HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se trata de la siglas que corresponden a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto”.

HTML no incluye ninguna maquetacion o elaboracion grafica sobre los formularios, unicamente permite tener valores ordenados mediante el uso de etiquetas. Las etiquetas son la columna vertebral del HTML, ya qe se encargan de definir el como, cuando y donde se mostraran en los elementos de un formulario.

Estas etiquetas también definen otros elementos como la tipografía que se muestra en la página, si se incluyen partes del texto en negritas, cursivas, tachadas y otras características de las fuentes. Asimismo determinan cuando deben empezar y terminar los párrafos y otros elementos visuales del formulario.

Que es un formulario?

Uno de los puntos principales en HTML son los formularios y la interaccion con el usuario, permiten enviar y recibir informacion.

El formulario se puede desarrollar mediante campos de texto, cajas de seleccion, botones, chechboxes o botones radio. se debe tener en cuenta que los label de las etiquetas.

Porque usar un formulario web?

Los formularios permiten obtener informacion en tiempo real y a su vez recopilar informacion. Las  empresas lo usan para evaluaciones de desempeño, perfiles en las entrevistas de trabajo y las paginas web para obtener un listado de personas que los contactan; tambien los podemos desarrollar dentro de las organizaciones para optimizar procesos.

Etiquetas para formulario?

Las etiquetas para iniciar un formulario las describiremos a continuacion.

"<form></form>"





El siguiente código muestra la estructura de un formulario, con sus etiquetas de apertura y cierre encerrando un conjunto de controles.

<form>
  [Conjunto de controles]
</form>

Los controles de texto proveen los medios necesarios para recolectar información textual, como nombres, direcciones, frases, mensajes, contraseñas, etc.

El elemento input, teniendo el valor "text" en su atributo type, representa a un campo de entrada de texto. El control asociado a este campo es una caja de texto que permite a los usuarios editar una sola línea de texto regular. Los controles de texto son útiles para recolectar líneas cortas de texto como títulos, nombres, apellidos, descripciones cortas, palabras clave, etiquetas, etc.

<form>
    Ingresa tu nombre completo: <input type="text" name="nombrecompleto">
    <input type="submit" value="Enviar la información">
</form>

 Un campo de texto multilínea se inserta con el elemento textarea. Como anteriormente, el atributo name provee un nombre para el control que ayudará al agente procesador a identificar la información enviada por el usuario.

<form>
  Ingresa tu nombre completo: <input type="text" name="nombrecompleto">
    Deja un mensaje:<br>
    <textarea name="mensaje"></textarea>
</form> 

Una casilla de verificación es un tipo particular de opción que puede ser seleccionada o deseleccionada mediante la interacción del usuario. Esto permite a los autores recolectar información como preferencias, aceptación de términos y condiciones, categorías, o cualquier otra cosa que pueda ser respondida mediante "sí" y "no". Una cosa que este control tiene de particular es que, aún cuando puede ser declarado como parte de un grupo temático, cada casilla es independiente de todas las demás en el formulario.

<form>
    <input type="checkbox" name="peliculas"> Películas<br>
    <input type="checkbox" name="deportes"> Deportes<br>
    <input type="checkbox" name="videojuegos"> Videojuegos
</form>

Mientras que las casillas de verificación son independientes y pueden ser declaradas por sí mismas, los botones de opción necesitan ser agrupados a fin de tener sentido. Un botón de opción también se declara con el elemento input, pero con el valor "radio" en su atributo type. Aquí las cosas se vuelven un poco diferentes a como eran con las casillas de verificación, debido a que el valor del atributo name necesita ser compartido por todas las opciones en un mismo grupo. En otras palabras, este es el mecanismo que se requiere utilizar para crear un grupo de botones de opción.

<form>
    Ingresos:<br>
    <input type="radio" name="ingresos" value="menosde1000"> Menos de  $1,000.00<br>
    <input type="radio" name="ingresos" value="de1000a5000"> De $1,000.00 a $5,000.00<br>
    <input type="radio" name="ingresos" value="masde5000"> Más de $5,000.00
</form>

Una lista de opciones es un control que puede asemejarse, en cuanto a su mecánica, a cada uno de los controles analizados previamente, dependiendo de la presencia del atributo booleano multiple. Este atributo cambia radicalmente la conducta de una lista, haciendo posible la selección de una sola opción a la vez o de muchas.

<form>
Género:
    <select name="genero">
      <option>Masculino</option>
      <option>Femenino</option>
    </select>
</form>

Un botón de envío tiene la acción predefinida de enviar el formulario al que pertenece cuando es activado. A menos que otro mecanismo de envío sea provisto, la presencia de este botón es necesaria si existe la intención de permitir a los usuarios enviar el formulario.

<form>
    Edita tu descripción:
    <input type="text" name="desc">
    <input type="submit" value="Guardar cambios">
</form>



Acabamos de ver las etiqueas y elementos mas usados para la creacion de formularios.


Algunos formularios online 

Aca dejo un par de link que corresponden a algunas herramientas para la crecion online de formularios, espero esta entrada les guste.

 
Google Forms 
Typeform 
Formdesk 
JotForm
Cognito Forms