Diseño de formularios web

Cómo lograr un buen diseño de formularios web

Número de visualizaciones
26/09/2019

Definir un buen diseño de formularios web es un tema peliagudo, ya que siempre va a depender del objetivo concreto de la marca y de la finalidad que tenga el formulario en cuestión (asesoría sobre un tema en concreto, pedidos de productos o comida a domicilio, búsquedas de vuelos, etc).

Sin embargo, sí que deben existir elementos en común y tener en cuenta ciertos aspectos para que nuestro formulario funcione.

El formulario será un fracaso si no tenemos claro nuestro objetivo

Tenerlo claro en cuanto a diseño y dejárselo claro también al usuario. Este debe saber qué va a obtener por rellenar sus datos, hay que tener en cuenta que somos reacios a facilitar nuestros datos personales. Hay que ser concisos en cuanto a texto y mandar un mensaje directo.

En cualquier formulario es prioritario pedir los datos de contacto y nombres del usuario, al fin y al cabo otro de los objetivos de cualquier formulario es el de conseguir cada vez más público. De esta forma, no se nos escaparán.

No obstante, hay que pedir la información necesaria y que los campos a completar no sean más de cinco o seis, porque el usuario puede cansarse o dejar la solicitud de información para más adelante, lo que conllevaría (en un alto porcentaje) la pérdida del usuario.

Inspirarnos en otros… ¿por qué no?

Las grandes empresas saben muy bien cómo estructurar los formularios y qué hacer para que el mayor número de personas los completen con sus datos.

Teniendo claro cuál es el objetivo de nuestro formulario, podremos inspirarnos en la competencia o en empresas de otros sectores.

Os presentamos algunos ejemplos, de sectores diferentes, y del uso que hacen del formulario en sus diferentes objetivos:

El inicio de sesión de AliExpress.

Antes de nada pongámonos en situación. Aliexpress es una tienda en línea fundada en 2010 formada por pequeñas empresas de China y de otros lugares que ofrece productos para compradores internacionales.

El objetivo de esta gran empresa es enviar a domicilio los productos que compramos el línea. Nos ofrecen comodidad.

Esta comodidad se aprecia desde el primer momento en el que nos registramos/iniciamos sesión en la página. A diferencia de otras empresas del mismo sector, Aliexpress nos permite acceder rápidamente usando cualquier de nuestras redes sociales (Facebook, Google, Instagram, Twitter, Pinterest, Vk, entre otros). Nos ahorra de esta forma el molesto proceso de ingresar rellenando nuestros datos.

Es por eso que te aconsejamos añadir un campo de Autocompletar con los datos de Facebook.

Asesoría de Legalitas.

Legalitas es una empresa que se dedica a la asesoría jurídica a distancia.

En este caso, el objetivo del formulario que nos presenta la marca es el de asesorar al cliente en materia jurídica por teléfono, por eso mismo nos presentan dos formularios.

El primero y el más llamativo, nos persigue a lo largo del scroll de la página, en la parte superior de nuestra pantalla y es tan fácil de rellenar como poner nuestro número de teléfono (sin la necesidad de abrir una nueva ventana o salir de la página de navegación) y así el asesor se encargaría de llamarnos para responder nuestras dudas.

El segundo funciona a modo de botón (LLÁMAME GRATIS) y funciona como un Call to Action (más adelante nos detendremos a explicarlo), y al pulsarlo nos abre una ventana modal pidiéndonos solamente el número de teléfono.

La empresa ya tiene nuestros datos de contacto para asesorar e incluso para hacer envíos de SMS para futuras ofertas y promociones.

 

Cuida mucho los Call to Action

Los usuarios deben saber en todo momento qué están completando y qué conseguirán al rellenar el formulario con sus datos. Es por eso que es de vital importancia cuidar las llamada de atención o Call to Action, que son los botones que nos encontramos al rellenar el formulario y al enviarlo.

Cuidar el mensaje del Call to Action es importante. Te pondré un ejemplo:

Si estás diseñando un formulario para una empresa de telefonía móvil y el formulario tiene la finalidad de asesorar y dar información, lo lógico sería usar un texto que funcionaría como Call to Action, en el que pondría “QUIERO INFORMARME”, “SOLICITAR INFORMACIÓN”, “¡LLAMADME!”. En definitiva, usar mensajes claros que refuercen la finalidad de la acción.

No te olvides de la Política de Privacidad

Recuerda dejar un espacio al final del formulario, justo antes del Call to Action, donde el usuario pueda dar su consentimiento al tratamiento de sus datos y pueda leer todo lo relacionado con la Política de Protección de Datos. Será suficiente con un check y “He leído y acepto la Política de Privacidad”. Recuerda añadir un enlace a la información.

 

Puedes usar plantillas para tu formulario

Si no encuentras un diseño apropiado para el formulario que necesitas, siempre podrás recurrir a páginas que te presentan plantillas para que las modifiques con la información que quieres transmitir.

Nosotros te recomendamos TypeForm, una web dedicada a la producción de plantillas para tus formularios. Encontrarás desde la plantilla más clásica y sencilla hasta la más original y llamativa.

Si buscas una opción gratuita, te recomendamos 123formbuilder.

Ahora te toca a ti.

Ya sabes lo principal para hacer un formulario efectivo.

  • Decide el objetivo.
  • Plantea una estructura coherente al objetivo.
  • Presta atención a los botones y Call to Actions.

¡Adelante con esos diseños!

1+
Categorizado en: Diseño Gráfico

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Descubre MasterClass de INESEM. Una plataforma en la que profesionales enseñan en abierto

Profesionales enseñando en abierto