Cómo diseñar mejores campos de texto

La presencia de campos de texto en nuestras interfaces a veces pasa desapercibida, sin embargo, estos son esenciales para que nuestros usuarios consigan sus objetivos, desde los más cotidianos hasta los más específicos. Si nos detenemos a buscarlos, los encontraremos en espacios como formularios de acceso y cajas de comentarios, por ejemplo.

Es casi imposible entrar a un sitio sin toparse con uno de estos campos. Los utilizamos para escribir tweets y para buscar en Google. Si los diseñamos bien, pueden llevarnos a un aumento en el número de conversiones en nuestra plataforma. De igual forma, un campo de texto mal diseñado puede significar el fracaso de nuestros formularios.

Un buen campo de texto es claro, accesible y amigable. No se trata simplemente de dejar un espacio en blanco para que el usuario escriba sobre él, sino que debemos hacerlos atractivos y usables. A continuación, te entregamos algunas recomendaciones para diseñar estos módulos de la mejor manera:

Distínguelos del resto de la interfaz

Es importante que el usuario reconozca claramente los campos con los que debe interactuar. Se recomienda aislar estos módulos en una caja y utilizar un fondo más claro que el del resto de la interfaz. Esto ayudará a diferenciarlos, destacándolos como espacios que pueden ser editados haciendo clic en ellos.

Solicita información de forma clara y precisa

No uses más texto del necesario para solicitar información. Por ejemplo, en vez de pedirle al usuario la “Dirección a la que se enviará el producto”, prueba simplemente pedir su “Dirección de despacho”. Sé tan breve como puedas.

Explica tus solicitudes al usuario

Si tu campo de texto solicita información privada, considera las reticencias que el usuario pueda tener para entregarla. Recuérdale la confidencialidad con la que serán tratados sus datos y traduce tus solicitudes a utilidades relacionadas a los objetivos del usuario.

Entrega pistas y ayudas

Para solicitar datos que requieren exactitud en su redacción, puedes evitar errores limitando el formato de tu campo de texto. Por ejemplo, para teléfonos, divide los números del código de área local; para una edad, no ofrezcas un espacio superior a tres dígitos o para un RUT agrega puntos y guiones automáticamente a medida que el usuario llena el campo.

Siguiendo estos consejos, podrás integrar campos de texto de forma práctica a tu interfaz, construir formularios más amigables y conseguir las interacciones que deseas de parte de tus usuarios.