Usabilidad en la sección de contacto de la web.

julio 19, 2010 | Desarrollo web, Usabilidad

Formulario de contactoVoy a intentar enumerar en éste post distintos puntos con los que podemos mejorar de manera considerable la experiencia de usuario en una de las zonas más importantes de una PYMP (Pequeña Y Mediana Página…), a través de unas sencillas consideraciones.

Una de las cosas que deberemos tener en cuenta es que, es posible que la forma en que un usuario necesite contactar con nosotros no se limite a la web, sobre todo si se trata de una página web corporative. Con ésto quiero decir que, al igual que ofreceremos un formulario de contacto, también deberíamos mostrar de forma clara, las distintas maneras de contactar con la empresa de modo off-line.
Ésto es:

  • Dirección. (Utilizado sobre todo para correo ordinario, burofaxes, etc)
  • Teléfono. (El método síncrono de comunicación por excelencia)
  • Coordenadas GPS. (De reciente incorporación, que resulta muy útil si lo que pretendemos es llegar a su/s oficina/s.)
  • Persona de Contacto. (Da un toque personal en la comunicación empresa – usuario)

También podemos enriquecerlo con un mapa dinámico, por ejemplo con Google Maps©. Su implementación es muy sencilla, basta con buscar la dirección desde la web, y hacer uso de la herramienta ‘Enlazar’, que nos devolverá el código necesario para incrustar en la web.

El siguiente aspecto en el que centraremos nuestra atención, será en el apartado de contacto online.
En éste caso, la opción más usada es la de implementar un formulario, con aquellos datos que necesitemos del usuario del sitio web.

En un principio puede parecer trivial, pero nos fijaremos en algunos detalles que no siempre tenemos en cuenta.

Trataremos de empatizar con el usuario, que no siempre es experto en el uso de éstas herramientas y que por lo tanto deberá tener claro qué está pasando en la página y a lo largo del proceso. Para ello, tendremos en cuenta:

  • Destacar el campo del formulario que estamos editando en éste momento.
    Podemos hacerlo a través de CSS, usando el selector :focus del elemento input.
  • Indicar de manera visible aquellos campos del formulario que son obligatorios.
    Sólo hace falta añadir una pequeña nota para advertirlo.
  • Controlar errores en el envío.
    Éstas validaciones se pueden realizar tanto en el lado del cliente, usando javascript, como en el lado del servidor, analizando los datos recibidos a través del formulario. En cualquier caso, la depuración de errores debe ser lo más amplia posible, tratando de evitar en todo momento que la página arroje errores o que se interrumpa el proceso, con lo que perdamos la interacción con el usuario.
  • Si realizamos algún tipo de tratamiento de datos, es importante también de que informemos de ello al usuario y que sea él, quien nos dé su autorización antes de realizar el envío, siguiendo para ello todos los requisitos de la LOPD, de lo que hablaremos más adelante, por ser un tema serio a la par que interesante.
  • Una vez realicemos el envío, debemos bloquear el formulario hasta que el servidor procese la respuesta, para evitar envíos simultaneos. Una vez terminado, mostraremos el resultado obtenido, para confirmar al usuario que sus datos han sido tratados correctamente, o si, por el contrario, ha ocurrido algún error y deberá volver a intentar el proceso.

Tags: , , ,

Comentarios (2)

 

  1. Jesús dice:

    Gracias Juanpol, espero que te haya sido de utilidad.
    Y tu, ¿Qué contenidos añades a ésta sección?

    Se me olvidó incluir en el artículo algo que creo que es muy importante, y es hacer uso de alguna herramienta antispam, como un sistema CAPTCHA.
    Su utilidad está en validar el formulario con alguna acción ‘humana’, como realizar un cálculo matemático simple o reconocer tipografías algo difusas a través de una imagen.
    De ésta manera evitamos el envío masivo de peticiones de un posible spammer.

Déjanos tu opinión