7 Errores de usabilidad que debes evitar en tu sitio eCommerce

En FREED hemos realizado más de 200 auditorías expertas a sitios eCommerce, donde la usabilidad web es uno de los aspectos más importantes entre todos los puntos que evaluamos. En base a esa experiencia, estamos compartiendo contigo, en distintos artículos que puedes encontrar en nuestro blog, muchos consejos para mejorar y advertencias de errores que se cometen frecuentemente. Anteriormente explicamos qué es la Usabilidad y por qué nos debe importar, nota que te servirá como complemento de los contenidos que veremos aquí.

Tabla de contenidos

Ahora queremos profundizar en los errores de usabilidad que detectamos comúnmente en los sitios eCommerce de nuestros clientes, centrándonos en los más críticos, con el fin de que revises el estado de tu propio sitio y hagas las mejoras necesarias para optimizar tu negocio online.

Errores de usabilidad web que debes evitar en tu sitio eCommerce

1. No se adapta correctamente a las pantallas de dispositivos móviles

Cada vez más personas disfrutan de la comodidad de hacer sus compras a través del teléfono móvil y dan preferencia a las experiencias fluidas a la hora de realizar una compra. Si bien el diseño responsivo, que permite navegar por el sitio eCommerce usando distintos dispositivos, ya es un estándar para prácticamente todas las plataformas y en todo proyecto de desarrollo web, aún es recurrente encontrar errores como los siguientes:

  • Los textos sobrepasan el ancho de la pantalla o se superponen sobre otros contenidos.
  • Los textos de los botones se salen de los márgenes de la pieza gráfica o esta se parte.
  • Las fotografías sobrepasan los márgenes de la pantalla.
  • El menú no se despliega o los links no funcionan al tocarlos.
  • Algunas funcionalidades operan con dificultades o simplemente no se ejecutan.
  • Las ventanas tipo lightbox o popup dificultan la navegación (en la mayoría de las veces la “X” para cerrarla no está a la vista o está prácticamente oculta).

Este tipo de problemas afectan directamente la experiencia del cliente potencial y se traducen inmediatamente en la pérdida de ventas. Si piensas que una buena parte del tráfico de usuarios de internet proviene desde dispositivos móviles y hoy ya es una tendencia el mCommerce (la masificación de las compras a través del smartphone), este es el primer punto al que debes dar foco en la gestión de tu negocio online en término de usabilidad web. Nuestra recomendación es revisar constantemente cómo se comporta tu sitio en distintos dispositivos y sistemas operativos para móviles. Debes estar pendiente a este tipo de detalles que responden a los cambios de comportamiento de las personas y así tener la seguridad de que estás atendiendo adecuadamente a esa demanda.

2. La navegación es confusa

Ejemplo de navegación confusa.

Ejemplo de navegación confusa debido a un menú que cuenta con subcategorías de productos ubicadas de forma poco intuitiva, lo que dificulta que el usuario las encuentre rápidamente.

Tu premisa debe ser: llevar al cliente a donde quiere ir de manera fácil y rápida. Piensa que una persona que entró a tu sitio eCommerce llegó ahí porque probablemente hizo una búsqueda en Google, así que ya tiene claro qué producto o servicio quiere comprar. Ahora el desafío es cumplir con ese objetivo sin problemas. En este punto debes poner atención a tu menú, donde las categorías y subcategorías tienen que ilustrar el contenido que realmente está en esa sección.

Además, evita las estructuras complejas y garantiza que la persona llegue a su objetivo. Es decir, diseña una navegación con pocos niveles para que así sea fácil llegar y pon ayudas como los breadcrumbs o migas de pan. Y nunca olvides esto: antes que invertir en un diseño innovador, la prioridad es ofrecer una navegación consistente.

Ejemplo de navegación optimizada.

Ahora vemos el menú del mismo sitio eCommerce, tras realizar el rediseño del sitio. La navegación fue optimizada mostrando subcategorías mejor definidas y usando imágenes para permitir una rápida identificación.

3. Múltiples alineamientos y ruido visual

Este punto se conecta con el anterior porque el diseño es un factor que puede estropear por completo la usabilidad web de un negocio online. Aquí tu objetivo de ser:

  • Un diseño agradable, que se vea bien a primera vista y que ayude a mantener al usuario dentro del sitio web.
  • Evitar el exceso de imágenes, botones, enlaces y de otros elementos que distraigan a la persona del foco, que no es otro que concretar una compra.
  • Ofrecer una experiencia simple. Esto se logra dejando suficiente espacio en blanco; sí, aunque cueste creerlo, debes dejar espacios sin contenido para que el usuario pueda leer con mayor nitidez los textos e imágenes y así evitar las confusiones que llevan a acciones erróneas al interactuar con el sitio eCommerce.

4. Falta de información crítica

Ejemplo de footer que no contiene enlaces a información crítica.

Ejemplo de un sitio web eCommerce: el footer no contiene enlaces a información crítica como Términos y condiciones, políticas del sitio, Ayuda, Acerca de nosotros y medios de contacto.

Es vital que en los flujos importantes, como el de compra, tengas ayuda contextual que facilite a las personas la resolución de las tareas, como el formato con que se deben ingresar los datos y alertas de error para corregir información mal escrita.

Asimismo, tu usuario debe contar con todo el respaldo y la información que es crucial para tomar decisiones en relación con la compra. Se trata de publicar en tu sitio eCommerce y en un lugar visible:

  • Medios de contacto (formulario, teléfonos, email, etc.).
  • Las políticas del sitio (Términos y Condiciones, Cookies, Privacidad, Envíos, Cambios y Devoluciones).
  • Quiénes somos y otros datos sobre la empresa.
  • Preguntas frecuentes y sección de Ayuda.
  • Formas de pago, etc.
Footer de FREED.TOOLS con enlaces a información crítica.

El footer de FREED.TOOLS con enlaces a información crítica para la decisión de compra.

5. Un buscador ineficiente

Google es el buscador más popular y prácticamente tiene el monopolio de internet, pero no le dejes todo a él. Como decíamos antes, la persona que llegó a tu sitio probablemente ya sabe qué quiere comprar, así que querrá moverse rápido, evitará el uso del menú y lo primero que hará será ir al buscador. O sea, querrá repetir la misma experiencia exitosa que tuvo con Google pero dentro de tu sitio eCommerce. Por eso, debes habilitar un buscador que garantice una usabilidad web óptima, cumpliendo con lo siguiente:

  • Que todos los contenidos referidos a la información crítica para una compra (que vimos en el punto anterior), y no solo los productos, esté indexada y sea fácilmente encontrable.
  • Que los resultados se entreguen rápidamente y de una forma ordenada y clara, con el fin de poder llegar en un clic a lo que se está buscando. Que el buscador esté presente en todas las páginas del sitio eCommerce, ubicado en la parte superior o cabecera (header).
El buscador de FREED.TOOLS.

El buscador de FREED.TOOLS está presente en todo el sitio y entrega resultados claros y ordenados sobre todos los contenidos del sitio.

6. Tipografía y colores inadecuados para la lectura en web

Ejemplo de textos difíciles de leer.

Ejemplo de una página web donde se cometen dos errores que dificultan la lectura: se usa una tipografía de tamaño inadecuado y un fondo que no ofrece buen contraste.

Parte de una buena experiencia de usuario con tu sitio eCommerce pasa por favorecer la lectura en pantalla, asegurando una correcta legibilidad. Piensa que las personas entrarán a buscar información y la idea es que se sientan cómodas, pero suele ser cansador leer el contenido de un sitio web; es más, los usuarios prefieren escanear la página en busca de datos importantes. Entonces, para hacer más grata esta experiencia:

  • Usa fuentes fáciles de leer en pantalla, a veces las fuentes más sofisticadas empeoran las cosas porque resultan ilegibles.
  • Usa un color adecuado y de un tamaño suficiente.
  • Asegura un buen contraste entre el color de fondo de la pantalla y la tonalidad que usas en las tipografías.
Ejemplo de página que cumple con los parámetros de usabilidad.

Esta página cumple con los parámetros de usabilidad que comentamos.

7. Inconsistencias en varias dimensiones

Este último punto podría decirse que es un resumen de cómo asegurar la consistencia desde la navegación al contenido dentro de tu sitio eCommerce. La premisa es: utiliza un diseño estándar en todas las páginas. Muchas veces los alardes de creatividad obstaculizan la experiencia del usuario y terminan cayendo en la lista de problemas de usabilidad web, cuando la realidad es que no importa cuánto trabajo hayas hecho para que el sitio web sea atractivo, porque lo que requieren los usuarios es una apariencia y sensación de consistencia. Por eso, un buen diseñador web debe saber definir los límites para garantizar esta consistencia al navegar por cada una de sus páginas. Para cumplir con este precepto, debes:

  • Evitar la coexistencia de distintos diseños dentro de tu sitio eCommerce.
  • Evitar el diseño de minisitios fuera de tu sitio que impliquen sacar al usuario de la navegación natural.
  • Mantener siempre un diseño que favorezca páginas simples e informativas.

En resumen

Los usuarios siempre favorecen lo simple y una funcionalidad intuitiva, por sobre un diseño sofisticado e innovador. Así que tu desafío no debe ser tener un negocio online con todo lo último en tecnología y diseño, sino evitar errores de usabilidad web, hacer un trabajo de mejora continua aprendiendo de esos errores y tener como prioridad ofrecer una experiencia fluida a tus clientes.

Si quieres profundizar en este tema, te invitamos a revisar otros de nuestros artículos como los argumentos para convencer a tu jefe para invertir en usabilidad y experiencia del usuario y usabilidad y UX en tiempos de “vacas flacas”.

¿Conoces otros problemas de usabilidad web en sitios eCommerce? Compártelos con nuestra comunidad.


1 comment


  • Soledad Borel

    Muy útil, muchas gracias


Leave a comment

Please note, comments must be approved before they are published