Un mejor diseño de formulario de contacto comienza con la usabilidad. El objetivo de un formulario es obvio: necesita información del usuario. El formulario debe ser lo suficientemente intuitivo para que los usuarios sepan exactamente qué hacer y no se desvíen en el proceso de completar esa acción.
Los mejores formularios de contacto son fáciles de ver e incluyen elementos altamente utilizables con los que los usuarios pueden interactuar sin pensar en ellos. (Suena un poco más fácil de lo que es a veces.) Pero afortunadamente, tenemos una selección de consejos para ayudarlo a diseñar mejores formularios de contacto.
1. Hazlo en una columna
Las formas verticales funcionan bien porque los usuarios están acostumbrados a desplazarse. Facilita ver el principio y el final de la forma. ¿Qué es más fácil? ¿Hojear un formulario verticalmente o rellenar elementos a través y luego hacia abajo en la pantalla? Crear un formulario con una sola columna vertical es la solución más fácil para muchos usuarios, ya que solo tienen que pensar en una acción: desplazarse por la pantalla a través del formulario.
Puede funcionar para campos similares, como respuesta corta para un nombre, dirección de correo electrónico y número de teléfono. También puede funcionar bien para elementos como una pantalla de pago.
Esta forma también funciona mejor con formatos de respuesta, de modo que la forma tiene la misma forma en diferentes dispositivos, proporcionando una experiencia de usuario más consistente. Esto puede ser particularmente importante con el comercio electrónico o los formularios de pago porque no desea que la experiencia varíe, creando preguntas sobre la validez y la credibilidad del formulario.
2. Grupo de contenido lógico
Los pequeños bloques de preguntas o campos visualmente agrupados pueden hacer que un formulario sea más fácil de entender. Mantenga elementos similares juntos (como información de dirección o campos de pago), y agrupe elementos con sus etiquetas y cualquier otro texto instructivo. Los usuarios nunca deben cuestionar a qué campo se relaciona una etiqueta o instrucción.
Las agrupaciones lógicas de contenido crean un flujo para el formulario, donde los usuarios pueden anticipar qué información viene a continuación. Esto hace que la experiencia sea fácil y agradable.
3. Coloque las etiquetas sobre el contenido
La mayoría de las herramientas de creación de formularios le ofrecen muchas opciones para colocar etiquetas o información sobre herramientas. Resista la tentación de volverse demasiado creativo y coloque etiquetas sobre el campo donde va la información. Esta es la colocación más común y utilizable para las etiquetas.
Además, esta ubicación se convierte fácilmente a otros dispositivos. Piense en el formulario en un teléfono en lugar de un escritorio, por ejemplo. Si el formulario aparece antes de la etiqueta, puede planear qué información colocar en el campo incluso antes de desplazarse hacia ella, y se mantendrá hasta que el campo del formulario esté completo. Pero si la etiqueta está debajo del campo, puede quedar atrapado en un patrón de desplazamiento hacia abajo y luego hacia arriba nuevamente para ver las instrucciones y completar el formulario.
Si bien esto puede parecer ahora un gran problema, puede ser frustrante para los usuarios. Y con formularios más largos, puede dar lugar a errores en todo el formulario. Este es un problema importante de usabilidad en el diseño de su formulario de contacto.
4. No solicite demasiada información
Cuanto menos comprometidos y leales sean los usuarios, menos campos aceptarán para completar una acción. Es más probable que los formularios más cortos se llenen completamente que los formularios largos que solicitan información innecesaria. (¿Realmente necesita ingresar el tipo de tarjeta de crédito que tiene en una página de pago? La respuesta es no, el número indica el tipo de tarjeta, así que no haga que los usuarios ingresen esta información innecesaria).
Cuanto menos comprometidos y leales sean los usuarios, menos campos aceptarán para completar una acción. Para los nuevos usuarios, está bien pedir una dirección de correo electrónico. Espere un correo electrónico de confirmación (una vez que hayan invertido un poco más) o un seguimiento para ampliar la información recopilada para incluir un nombre, código postal o fecha de nacimiento.
Las formas simples y cortas tienen tasas de participación más altas que las formas de contacto largas y exhaustivas. Diseñar adecuadamente.
5. Haz el botón obvio
Asegúrese de que la micro-copia dentro del botón le dice exactamente lo que sucede Una vez que el usuario completa cada campo en el formulario, ¿es obvia la acción final? Con demasiada frecuencia, la creación de un botón fácil de ver es el paso olvidado en el diseño de la forma. El botón debe ser claramente visible. Use un color específico para el botón final y asegúrese de que la micro copia dentro del botón le diga exactamente qué sucede (enviar, completar el pago, etc.).
Consejo de bonificación: Si usa un captcha u otro tipo de desafío humano, colóquelo entre el último campo del formulario y el botón de envío. (No hay nada más molesto que hacer clic en Enviar solo para que el captcha te obligue a repetir la acción o, peor aún, para que comiences de nuevo.)
Ah, y un consejo más que no hace falta decir? ¡Informe a los usuarios cuando un formulario se complete con éxito! Un simple? Gracias? el diálogo es a menudo suficiente.
6. Utilice los tipos de campo apropiados
Un buen diseñador de formularios sabe que un tipo de campo no se ajusta a toda la información. Haga coincidir el tipo de campo con los datos que se recopilan para facilitar a los usuarios completar formularios correctamente. No utilizarías un menú desplegable para un número de teléfono, ¿verdad?
Si bien este es uno de esos consejos que parece totalmente obvio, ocurre demasiado mal la mayor parte del tiempo.
Piense en este campo en un formulario de contacto: la mejor manera de contactarme es por correo electrónico o por teléfono. El uso de una opción de botón deja claro que el usuario debe seleccionar uno. El uso de un menú desplegable es una acción demasiado compleja para una opción u otra. Y definitivamente no necesitas esto como un campo de respuesta breve.
El uso del tipo correcto de campo no solo hará que los formularios sean más fáciles para los usuarios, sino que también agilizará su recopilación y análisis de datos.
7. Validar los datos donde sea posible
¿No te encanta cuando un formulario te informa sobre los errores sobre la marcha en lugar de al final? ¿No te encanta cuando un formulario te dice acerca de los errores? a medida que avanza en lugar de al final? No solo puede ver y corregir el error, sino que también ahorra tiempo y dolores de cabeza en el proceso.
El uso de la validación en los formularios de contacto es una necesidad. Desde la confirmación de que una dirección de correo electrónico sigue el formato adecuado, hasta la validación del número de dígitos de un código postal o número de teléfono, estas pequeñas cosas pueden hacer una gran diferencia.
Y si no lo estás haciendo, estás en la minoría. Un estudio del Instituto Baymard muestra que el 60 por ciento de los formularios utilizan validación en línea. Entonces, no es solo una herramienta de usabilidad, se está convirtiendo rápidamente en un patrón (y expectativa) comúnmente aceptado por el usuario.
Conclusión
Los dos tipos de formularios más populares en los proyectos de diseño de sitios web son, probablemente, suscripciones de correo electrónico y formularios de contacto. Comience por asegurarse de que estos formularios estén configurados correctamente y modifique el diseño para que sean más utilizables. (Si nota una mayor participación, es probable que esté funcionando).
Los mismos conceptos se pueden aplicar a los formularios en todo el diseño, así como a encuestas, páginas de pago y otra recopilación de datos. Estos conceptos se amplían para cumplir con cualquier elemento del sitio web donde el usuario necesita ingresar información para completar un proceso.