El formulario web es fundamental en cualquier página que ofrezca productos y/servicios. En relación a esto, en la mayoría de los casos, una conversión en una página web se asocia a un registro en el formulario. No obstante, al mismo tiempo, los formularios son el principal punto de fuga de los usuarios de una web. 

Por este motivo, es crucial diseñar formularios eficientes y eficaces que maximicen la tasa de conversión en una web. En este sentido, atender a aspectos de UX en el formulario de una página puede ser la base del éxito de tu negocio en el entorno digital. De hecho, optimizar el formulario, así como cuidar de los campos que se piden en el mismo, es la base para lograr leads de calidad.

7 claves para diseñar un formulario que convierta

Como ya hemos explicado en anteriores artículos, un diseño bonito no tiene por qué ser un buen diseño. Ahí es, quizá, donde reside la diferencia entre Arte y Diseño. En el primero el artista refleja su visión, mientras que un diseño siempre tiene un fin. En el caso de una página web, lograr leads, muchas veces representados en un formulario que, indudablemente, hay que cuidar. 

Su ubicación, longitud, etiquetas e incluso diseño juegan un papel crucial para llegar a nuestro fin. He ahí el motivo por el que hay que prestar especial atención a la usabilidad en la conceptualización y diseño de formularios. 

1. Cuidado con la longitud

¿Cuántas veces hemos desistido de completar un formulario tras hacer un scroll interminable?, ¿y por rellenar un formulario que parecía no acabar nunca? Para evitar este tipo de situaciones, y otras tantas similares, es recomendable limitarse a pedir los datos necesarios. Esto reducirá la longitud y extensión del formulario, al tiempo que brinda más confianza, pues el usuario no verá invadida su intimidad. Es más, muy en línea con este último rasgo, puede ser una buena opción explicar brevemente para qué es necesario cada dato. 

Por otro lado, es conveniente no pedir datos dos veces, esto es, reutilizar información. Por ejemplo, en el caso de un ecommerce, completar el formulario de facturación con la información recopilada en el de registro o envío. A su vez, es posible que la auto-tabulación resulte de gran ayuda al recoger datos como el número de tarjeta.  

2. Estructura unidireccional 

No nos cansaremos de repetirlo: hay que ponérselo fácil al usuario y una buena alternativa es apostar por un diseño unidireccional en el formulario. ¿Cómo? Optando por una única columna. Puede que haya que hacer scroll (ídem, primer punto), pero seguiremos el orden habitual de navegación. Es decir, de arriba a abajo, por lo que el usuario no tendrá que moverse en dos direcciones (de arriba a abajo, y de izquierda a derecha) para completar el formulario. 

De todas formas, existen algunas excepciones: en campos cortos y lógicos, como “Ciudad”, “Estado”, “Provincia” y “CP”, pueden presentarse en una misma línea. 

3. ¿Cuándo llegamos?

En los viajes y al rellenar un formulario podemos enfrentarnos a la incógnita de cuándo terminaremos. ¡Y cuánto agradecemos, en el primer caso, cuando aparece una señal que nos indica que en 10 kilómetros habremos llegado a nuestro destino! ¿Por qué no hacer algo similar con los formularios? Se podría dividir en diferentes apartados, con sus respectivos pasos, o mostrar el nivel de progreso. 

Un recorrido cómodo que termine con un feedback inmediato confirmando la recepción del formulario. Porque “es de bien nacido ser agradecido” y no puede haber mejor final que un mensaje dándole al usuario las gracias por su tiempo. 

4. Cada cosa por su nombre

La claridad en el etiquetado y en los mensajes de sugerencia, ayuda o error, es fundamental. Por ejemplo, los placeholders (el texto incluido dentro de un campo de un formulario) pueden parecer una buena alternativa. Sin embargo, no resultan de gran ayuda si el usuario olvida lo que se le estaba pidiendo en ese campo y tiene que volver a comprobarlo. En ese caso, una solución es hacer uso de etiquetas flotantes o similares, o bien insertar el texto fuera del recuadro. 

De optar por situar la etiqueta fuera del recuadro, tampoco lo hagas en línea con el campo, justo a la izquierda, es mejor que esté arriba o abajo para respetar el orden unidireccional de la navegación.

Por otro lado, es conveniente organizar los campos del formulario en grupos lógicos y solicitar la información de manera escalonada, empezando por lo más básico. ¿O preguntarías por el grupo sanguíneo en una primera cita?

5. Experiencia óptima

De la misma forma que buscamos cautivar a los clientes a través de nuestras campañas, completar un formulario no tiene que ser una experiencia traumática. La clave está en poner facilidades que van más allá de no desarrollar un formulario demasiado extenso. 

En este sentido, decíamos que no hemos de descuidar aspectos relacionados con la usabilidad. Entre estos se incluye ofrecer ayuda antes de que el usuario lo necesite, hacer la validación del campo al momento y avisar de un error antes de intentar continuar con el proceso. ¿Cuántas veces nos ha ocurrido que creíamos haber completado el formulario de una web y hemos tenido que volver sobre nuestros pasos para rellenar los campos que faltaban o corregir algo?

Asimismo, en lo que a la arquitectura del formulario web se refiere, es conveniente distinguir visualmente los campos deshabilitados, así como marcar el foco en los activos. En el caso de los campos obligatorios y los opcionales, ¿por qué no acabar con los asteriscos y optar por escribir “Opcional”? De esta forma, libramos al usuario de una doble labor de interpretación. Claro y conciso. 

Por último, en ese afán por optimizar espacio, a menudo optamos por las listas desplegables. Estas son recomendables si se ofrecen más de 6 opciones. En el caso de que haya menos, considera hacer uso de botones de radio o casillas de verificación para una selección múltiple. De esta forma, todos los elementos estarán visibles y se minimizará el número de clicks del usuario. 

6. Propuesta de valor

Sí, un formulario tiene que ser funcional. Pero no nos engañemos, si el formulario es tan feo que duele al mirarlo, nadie lo completará. La primera impresión cuenta y esto es así. Tampoco sirve de nada tener una página web repleta de detalles y un copywritting de lo más cuidado, y contar con un formulario simple. Este es un ente en sí mismo y, como tal, debe albergar una propuesta de valor, ser diferente, hacernos diferentes. 

Algo similar ocurre con el botón. ¿Y si acabamos con el “Enviar” y optamos por el “Conseguir mi descuento” que antes de empezar el registro prometimos? ¿Y si lo combinamos con un botón atractivo? Esto va de cumplir sueños y deseos, y de llamar a la acción.

7. Probarlos de vez en cuando para verificar que funcionan

via GIPHY

Por último, debemos asegurarnos de que el formulario de contacto funcione correctamente, así como que su diseño sea responsive y mobile friendly. 

En definitiva, con estas claves podrás conceptualizar, diseñar y desarrollar formularios con los que lograr más conversiones en tu página web. Un formulario web que, aparte de ser funcional, represente la identidad y esencia de tu marca y negocio.  

En Sembi podemos diseñar una página web usable para tu negocio en la que el usuario se sienta cómodo en ella y contacte con vosotros. ¿A qué esperas? Consigue más conversiones aquí.