Experiencia de usuario en la introducción de tarjetas de crédito

Excelente el análisis The ‘Credit Card Number’ Field Must Allow and Auto-Format Spaces (80% Don’t).

Typing a 15-16 long string of numbers without a single error can be challenging for most users – yet, it’s what all users have to do during the checkout flow as they reach the ‘Credit Card Number’ form field. During our large-scale checkout usability study we observed that a large sub-group of users struggle with correctly typing their 15-16 digit credit card number, and subsequently struggle with verifying that it’s typed correctly. During testing this was observed to be the direct cause for checkout abandonments as users got card validation errors due to simple typos.

Una buena validación

Al rellenar un formulario me he encontrado una excelente validación.

formulario

En muchos formularios, al comprobar si se ha escrito algo en un cuadro de texto obligatorio, sólo se comprueba si está vacío, no se comprueba la longitud de lo escrito. Sin embargo, en este formulario se exige que la longitud mínima del nombre sea 2 y la del apellido 3.

Muy poco usable

El otro día me encontré el siguiente error en el sistema de actas de mi universidad.

En una primera página web se muestra el listado de los alumnos. El sistema solicita la introducción de una nota numérica y una calificación textual que se debe seleccionar en una lista.

Entre ambas calificaciones existe una correspondencia. Por ejemplo, una nota numérica de “6” se corresponde siempre con un “aprobado”, por lo que con introducir la nota numérica es suficiente, pero bueno…

actas-01

El error real que sufrí el otro día fue que en el curso en el que estaba introduciendo las calificaciones no se debía introducir una nota numérica, sólo se debía seleccionar una calificación. Eso lo supe después de introducir una nota numérica a todos los estudiantes:

actas-02

¿No podría haber avisado el sistema en la primera página?

O mucho mejor, ¿no podría la interfaz adaptarse y no mostrar el cuadro de texto para introducir la nota numérica?

Usabilidad de los formularios web

El artículo An Extensive Guide To Web Form Usability es una excelente guía para mejorar la usabilidad de los formularios web.

En este artículo se indica que los componentes de un formulario son:

  1. Labels: These tell users what the corresponding input fields mean.
  2. Input Fields: Input fields enable users to provide feedback. They include text fields, password fields, check boxes, radio buttons, sliders and more.
  3. Actions: These are links or buttons that, when pressed by the user, perform an action, such as submitting the form.
  4. Help: This provides assistance on how to fill out the form.
  5. Messages: Messages give feedback to the user based on their input. They can be positive (such as indicating that the form was submitted successfully) or negative (“The user name you have selected is already taken”).
  6. Validation: These measures ensure that the data submitted by the user conforms to acceptable parameters.