Rápido que me aburro!

Una de las principales reglas de la usabilidad es aprender que el navegante o el usuario de un sitio, no tiene tiempo y es esencial tener esto en mente a la hora de realizar cualquier desarrollo para la web que contemple la interacción con el navegante. Los formularios son el mejor ejemplo de esto.
A nadie le gusta completar formularios, ni siquiera a la persona con más tiempo del mundo. De ahí que existen tantas herramientas que auto-completan los formularios para ahorrarnos tiempo.

No todas las personas que navegan Internet están apaciblemente sentadas en su silla y con un café en la mano. Algunas están conectándose antes del almuerzo en sus trabajos, otras contando con solo minutos para realizar una operación antes de tener que pagar la hora en un cybercafé.

La cantidad de situaciones en las cuales los usuarios se conectan es infinita pero todas ellas tienen una constante en la que insisto: el tiempo.

A nadie le gusta perderlo, nadie lo tiene.

¿Tipo de sangre?

Cuantas veces quisimos completar un formulario lo más rápido posible para salir del paso y nos encontramos con infinitos campos de texto para llenar terriblemente innecesarios en el camino?
Claro, todo depende del tipo de formulario sea. Si hablamos de un formulario para una nueva cuenta de e-mail, un formulario de contacto o un billing*.
El secreto para todos ellos es el mismo: sólo la información absolutamente necesaria.

Números de fax por ejemplo. Son totalmente innecesarios en la mayoría de los casos. Logrando el contacto mínimo luego puede completarse la ficha del usuario si en realidad necesitamos enviarle un fax al mismo.

¿Qué hice mal?

No hay nada más frustrante que no saber que se está haciendo mal. Algunos formularios que hemos visto en pruebas, carecen de "campos obligatorios".
Hay dos alternativas: o el equipo de desarrollo pensó que todos los campos debían ser completados, o agregaron los campos obligatorios de manera errónea.

Campos obligatorios no presentes.
Muchos sitios piden al usuario completar todo el formulario para poder enviarlo cuando en realidad necesitan menos de la mitad de los datos que obligan al usuario a completar. Las excepciones son los sitios que contienen formularios de billing y algunos formularios de contacto. Campos
obligatorios presentes, pero no presentes.
A ver, que quiero decir con esto? Que los campos obligatorios están presentes pero sólo después que usuario comete el error de no llenarlos.

Muchos sitios
dan por sentado que el e-mail, el nombre de usuario o el código postal son campos que los usuarios reconocerán como obligatorios aunque no haya ninguna indicación de ello.
Luego de que el usuario envió el formulario sin completar cierto campo
obligatorio (digamos, el e-mail), el sitio vuelve a mostrar el formulario indicándole
que ha ocurrido un error y que debe llenar los campos resaltados.

Para este
entonces, el usuario ya está frustrado y tal vez piense que la culpa
fue suya cuando en realidad, hizo lo correcto.

Este error
tan común se soluciona sencillamente agregando:

  • Un asterisco (a un lado del campo de
    texto)
  • La palabra "Obligatorio"
    (a un lado del campo de texto, o debajo del mismo)
  • Títulos en bold para los campos
    obligatorios.

Lo mejor
es minimizar la cantidad de campos obligatorios. Si no logramos un equilibrio
en este tema, el usuario tal vez se canse de tratar y con un click, esté
fuera de nuestro sitio.

Ok, anota mi móvil… es quincecincocientosetentit.. perdón

Verdad que es difícil? Este tema puede parecer muy obvio pero muchos
desarrolladores se sorprenderían de la cantidad de veces que se nos pasa
(a todos, somos todos humanos) el crear un buen campo de texto para ingresar
un dato en concreto.
A la hora de ingresar nuestro teléfono o cualquier otro dato (fecha,
número de tarjeta de crédito) en muchísimos sitios webs,
este nos propone reglas que solamente lo benefician a él y no a nosotros
(los usuarios).

Estas son:

  • No separar con puntos "."
  • Ingresar solamente números
    y no caracteres
  • No separar con espacios vacíos
  • No separar con barras "/"
  • No separar con guiones "-"

Yo cada vez que ingreso un teléfono
lo hago de la siguiente manera:

Teléfono:

Pero la mayoría de los sitios nos obligan
al error cuando por conveniencia (generalmente para poder recibir o transportar
ese dato) nos dicen que ingresemos nuestros teléfonos u otro dato así:

Teléfono:

Nos obligan a releer
dos o tres veces el número que ingresamos y en la mayoría de los
casos cometimos un error al hacerlo. Nuevamente hacemos sentir al navegante
como un idiota.
Todos usamos diferentes formatos para ingresar datos en formularios. Algunos
separamos nuestro número de tarjeta de crédito con un punto, otros
lo hacen con una línea, otros con un numeral, algunos con un simple espacio,
etc.
Debemos crear campos de texto que acepten cualquier tipo de data.

¿Como por ejemplo?

Un buen campo de texto debe ser completado casi sin pensarlo. Una buena manera
de lograr esto es dando el buen ejemplo (y no estoy bromeando). La mayoría
de los sitios poseen un buscador, pero cuantos de ellos agregan debajo del campo
de texto un ejemplo?
La mayoría de los grandes buscadores lo hacían en un momento.
Muchos buscadores no reconocen la frase "Los Simpsons" y devuelven
0 resultados. Pero resulta que nuestro query estaba mal escrito. Luego de unos
minutos de investigación, encontramos que debíamos haber escrito
"Los+Simpsons".

Una solución a esto es agregar
debajo del campo de texto un pequeño ejemplo en itálica.



(Ej: Los+Simpsons, Lost+in+Space)

Esto también es recomendable para los
campos en los que hay que ingresar fechas, códigos postales, etc. ¿Cómo sabemos
si debemos ingresar “Día/Mes/Año” o “Mes/Día/Año” ? Pues aclarando con un ejemplo
caramba!

Ok, ahora solo presiono Envi… NO!

Esto suele sucedernos a TODOS muy a menudo. Ya sea por un arranque repentino
de prisa, o porque utilizamos la tecla TAB demasiadas veces. El botón
de Reset es el diablo. Muerde. No hay que agregarlo ya que en la gran mayoría
de los casos, solo nos trae un problema.

Imagínate haber llenado
3 páginas de un formulario para tu declaración impositiva y te das cuenta que
acabas de cometer un error en uno de los datos que ingresaste. Le haces saber
al buen caballero que te ha dado el formulario para completar que te has equivocado
en uno de los campos y este muy sonriente LO ROMPE y te devuelve uno vacío.
Ahora (iracundo) debes completar todo el formulario otra vez, o levantarte y
alejarte de ese lugar.

En la web sucede
exactamente lo mismo. El botón Reset existe para traer problemas. Al presionarlo
y con un simple comando toda la información ingresada se pierde y solo queda
la frustración de volver a comenzar.

Si un usuario se equivocó en un campo,
lo corregirá de inmediato (siempre y cuando se entere o el formulario mismo
se lo haga saber) pero solo estará dispuesto a corregir ese dato erróneo y no
todo un formulario otra vez.

Por favor espere

Simples palabras para una simple acción. Esperar. En la Web significa
no más de 4 segundos. Muchas veces al enviar un formulario de cualquier
tipo, la gente desesperada por la tardanza del mismo presiona 4 o 5 veces el
botón de envío creando datos repetidos en la base de datos (o
metiéndose en problemas).

Algunos pensarán: “seguro, se soluciona
indicándole que lo haga solo una vez” Depende el caso. En la mayoría de las
veces, no se soluciona PARA NADA indicándole al navegante que solo haga click
una vez para enviar el formulario.
Muchos formularios manejan datos muy delicados como para al momento de enviarlos
agregar una leyenda debajo que diga: “POR FAVOR solo presionar UNA VEZ”.

Eso nos suena a que
si lo hacemos dos veces, la pantalla explotará o algo extraño ocurrirá con nuestra
información privada. Lo mejor es conseguir un Script Java que bloquee el botón
de envío una vez presionado. El colega Manuel Razzari tiene justo uno de esos
horneado hace bastante tiempo y nos lo ofrece en su web.

Con esta información,
ya es más que suficiente para poder crear un formulario usable para nuestros
navegantes, pero todavía hay muchos temas con respecto a los formularios
que hacen de ellos un arma perfecta de captar datos.

Muchos de los errores yo mismo los he
cometido (porqué no? Soy humano!) pero para lograr un “Usable Samurai Design”
debemos caer en cuenta de que constantemente tenemos muchísimo para aprender.