Usabilidad en los registros

Uno de los mayores problemas a los que se enfrenta el diseño web, es el saber recoger toda la información posible de nuestros usuarios, sin que eso suponga una molestia y el consiguiente rechazo por su parte.

Es muy frustrante tener que rellenar un enorme formulario, mal concebido, mal diseñado y mal programado, para poder acceder en muchas ocasiones a un contenido que desconocemos.

Digo esto, porque en más de una ocasión, siguiendo el rastro a una información, me ha ocurrido el llegar a un punto en el que se me exigía registrarme para poder acceder a dicha información, sin conocer si me va a ser útil o no, sin conocer el sitio, he de introducir todos mis datos personales, permitir a una agencia de spam que me inunde el correo y todo ello seguramente para nada…

Bien, ante todo, ningún sitio debería de pedir registro sin que previamente el usuario sepa si le merece o no la pena, engañar en Internet puede darte visitas hoy pero lo que es seguro es que tus usuarios no van a volver mañana. Partiendo de esta máxima, vamos a ver cómo debemos de enfocar un registro de usuarios en nuestro sitio.

Como ya he mencionado, antes de que el usuario introduzca sus datos, tiene que saber qué le va a reportar nuestro sitio, tiene que saber si le interesa o no. Nadie compra una bolsa con un regalo dentro, lo lógico es elegir el regalo, pagarlo y luego llevárselo.

MENOS ES MÁS.

Pidamos sólo los datos necesarios, al menos en un principio. Más adelante, podemos sugerir a nuestro usuario, que complete su registro.
Cuando vamos a hacer la compra en un supermercado, no nos piden la dirección al entrar, sólo nos la piden cuando vamos a pagar y pedimos además que nos la envíen a nuestro domicilio. En ese caso es evidente que sin ese dato no podremos recibir nuestra compra, por lo que no nos parece extraño ni invasivo. Eso mismo es extrapolable a una web, ¿por qué pedir datos que no son de momento necesarios?, esto lo único que origina en la mayoría de las ocasiones es el abandono del usuario.

Otro dato a tener en cuenta es la redundancia de datos, es evidente que si le hemos pedido el código postal y nos ha puesto 28009, el usuario es de Madrid, así que ¿por qué le pedimos de nuevo la provincia?. Todos estos datos encadenados deben de tenerse muy en cuenta a la hora de simplificar el formulario. Por ejemplo, podríamos simplificar aún más, solicitando el mail como nombre de usuario, ya más adelante si él lo desea, podrá, cuando él quiera, modificar ese nombre de usuario por otro más corto, pero con su email ya registrado en nuestra base de datos.

TEXTOS DEL FORMULARIO Y DISEÑO

Todo formulario ha de ir precedido por un título descriptivo del mismo.

No seamos «roñosos» a la hora de utilizar el espacio, es mucho más usable un formulario con un tamaño de fuente lo suficientemente grande y con espacios en blanco que lo hagan menos «espeso».

Para mi, el mejor modo de titular una caja es colocando encima de la caja el texto o titular de la misma, de ese modo además podemos utilizar mejor los espacios entre cajas y hacer un diseño más limpio. Aunque si se trata de un formulario con pocos datos, nada nos impide situar los textos a la izquierda de la caja como hace por ejemplo Twitter.

Existen otros formularios en los que se introduce la información dentro de la caja. En el mejor de los casos esa info desaparece al pulsar sobre la caja, en otros, desgraciadamente, tenemos que borrarlas para comenzar a escribir.

Para más información a la hora de diseñar un formulario, cómo y donde colocar los botones, etc, consulta el post de cómo diseñar un formulario.

Utilizar un lenguaje fácil, amigable, a ser posible utilizar siempre las frases en afirmativo, por ejemplo, no usar «no quiero recibir publicidad» y usar «quiero recibir publicidad»

AGRUPAR CONCEPTOS

En el caso de estar diseñando un formulario completo, debemos agrupar por un lado los datos personales del usuario y por otro los demás. Por ejemplo, si se trata de una web de motos, primero en un bloque pediremos los datos personales y en un segundo bloque le pediremos los datos de su motocicleta o de aquella-as en las que está interesado.

UTILIZAR AYUDAS

En ocasiones es necesario el uso de una ayuda para rellenar un campo, si es así, nada mejor que utilizar ajax para mostrar esa información oculta, podemos ver un ejemplo en el registro de Twitter, en el que además de comprobar cómo no nos piden apenas datos, al pinchar sobre cada caja, nos muestra a continuación la información necesaria para cumplimentarla.

Ejemplo de ayuda en campo de texto

FUNCIONAMIENTO

El usuario se maneja en los formularios pinchando con el ratón sobre la caja o tabulando, por lo que no es nada recomendable el salto automático del focus, ya que esto puede llevar a la confusión a la mayoría de esos usuarios, introduciendo sin querer los datos de una caja en otra.

Por supuesto no hacer recargar la página para habilitar un campo del formulario, esto puede ser un serio problema para conexiones lentas y una molestia para los demás.

Una vez rellenados todos los campos el usuario tiende a pulsar sobre la tecla intro para enviar el formulario, hay que asegurarnos de que esta función del botón de envío no está deshabilitada.

Cuando un usuario envía el formulario, puede ocurrir que algún campo haya quedado en blanco o que la información introducida no sea la correcta, en estos casos, debemos de lanzar un mensaje claro y muy visible al usuario, informándole del error y de la solución y por supuesto sin vaciar ninguno de los campos ya rellenos, de modo que únicamente tenga que ir a esa casilla rellenarla y enviar. En muchos formularios una vez rellena, nos damos cuenta de que hemos solucionado ese error pero que ahora nos dice que volvamos a rellenar alguno de los campos que ya estaban cumplimentados.

Una vez superados todos los obstáculos es imprescindible hacerle conocer al usuario que su formulario ha sido enviado con éxito y orientarle a la hora de poder seguir navegando por la web. En aquellos casos en los que el usuario haya llegado al registro forzado desde una página, lo lógico, será devolverle a dicha página. Y si prevemos que el envío de datos va  a ser lento, deberemos de colocar un mensaje del tipo «Enviando datos», para que el usuario no crea que hay algún error.

Esto son sólo algunos aspectos a tener en cuenta a la hora de diseñar y programar un formulario, basta con aplicar la mala experiencia uno mismo, para ver qué debemos de corregir. Debemos de intentar facilitar por todos los medios la labor al usuario, por ejemplo, no hay cosa peor que meter una fecha y no recibir más que errores, sin saber si es que hay que meter guiones, espacios, o barras. En definitiva y como digo siempre, no hay nada mejor que usar la lógica.

Post relacionados:

• Formularios con Ajax
• Botones del formulario
• ¿Cómo hacer un formulario usable?
• ¿Cómo diseñar un formulario?