Comparte este artículo

Actualizado.- 18/11/2020

Continuamos con nuestra serie de artículos dedicados a la UX o usabilidad web. En nuestra entrega anterior, delimitamos que es la usabilidad web y comentamos algunos conceptos interesantes que sin duda nos dejan más claro de qué estamos hablando cuando nos referimos a usabilidad web.

Elementos que mejoran la Usabilidad Web (UX) de un ecommerce

En nuestra entrega de hoy, vamos a revisar algunos elementos fundamentales de usabilidad a tener presentes en cualquier tienda online. Elementos que, si optimizamos bien, ayudarán a los usuarios a realizar aquello que desean en nuestra tienda online y a nosotros a incrementar nuestras tasas de conversión.

Buscador interno

Un buen buscador, que sea simple de usar y efectivo en sus resultados, es quizás una de las herramientas fundamentales que debe tener tu tienda online, si tienes una cantidad considerable de productos/referencias que ofrecer. Debemos tener en cuenta que una buena parte de usuarios que compran en Internet, no se tomarán mucho tiempo en tu tienda, con suerte harán una búsqueda, y si no encuentran el producto que buscan, lo más seguro es que cierren esa pestaña del navegador y pasen a la siguiente tienda, difícilmente vayan a reformular la búsqueda para seguir intentándolo. Y quizás el producto que buscaban estaba dentro del catálogo de tu tienda, pero no han podido dar con él porque falló el buscador, con lo cual, como si no lo hubieras tenido al producto, etc.

Implementar un buscador en tu tienda que cuente con la funcionalidad de autocompletar, al estilo de la funcionalidad que utiliza Google, por ejemplo, para ayudar al usuario con sus frases o cadenas de búsqueda, puede marcar la diferencia. Esta importante funcionalidad, no solo hace que sea más fácil para los visitantes encontrar lo que están buscando, sino que también les brinda un potencial de ventas horizontales al sugerir cosas dentro del ámbito de lo que están buscando.

Página de inicio o home

No todos los compradores ingresan a un sitio a través de la página de inicio o home, pero, para aquellos que lo hacen, esta página es la carta de presentación de tu tienda, por tanto, debería explicar de manera clara y efectiva qué vende y en qué se diferencia de sus competidores. Asimismo, debería exponer las principales ofertas de productos y permitir a los usuarios comenzar a comprar desde el minuto cero.

Si bien esta recomendación puede parecer sencilla, nos encontramos muy a menudo con páginas de inicio demasiado abarrotadas, donde las ofertas y/o productos más representativos de la tienda, se diluyen, se pierden entre la multitud de elementos que la componen. La página de inicio es para un sitio web lo que un escaparate es para una tienda física: cuantos más elementos se amontonan en el escaparate, menor es el valor general percibido (más desorden a menudo significa menor calidad). En definitiva, si deseamos captar la atención de nuestros potenciales clientes, deberíamos asegurarnos de que los elementos del «escaparate virtual» sean una buena representación de lo que está disponible dentro de la tienda.

Menú

La complejidad perjudica las conversiones. Los clics y menús excesivos o la aparente interminable categorización de productos son factores molestos para los compradores. Pero ¿¡cómo hacemos mejoramos esto!? Tenemos que lograr que nuestros menús y opciones de navegación sean simples e intuitivos. Decirlo es fácil, pero hacerlo…

Intentemos limitar los menús para que tengan entre tres y siete encabezados (u opciones de menú principal) y uno o dos subniveles (como máximo) dentro de los encabezados iniciales (opciones de submenús). Además de limitar la cantidad de opciones de navegación, vamos a asegurarnos de que los literales que las describen sean claros y explicativos por sí solos. Usemos etiquetas simples de una o dos palabras, que sean muy directas y transparentes acerca de dónde conducirán. La redacción moderna y divertida puede ser interesante, pero solo si no confunde ni entorpece la facilidad de uso.

Además, como decíamos al principio, a la gente le gusta la familiaridad. Saben que una flecha hacia la izquierda significa que volverán al punto donde estaban y que una manito con un dedo señalador significa que pueden hacer clic porque se trata de un enlace. Una vez más, la originalidad está muy bien, pero cuando hablamos de mejorar la usabilidad web (UX) para finalmente mejorar la conversión, vamos a los símbolos conocidos dentro del ecommerce, y en general dentro de las convenciones web, para que las compras de los usuarios sean más intuitivas y amigables. Por último, pero no menos importante, asegurémonos de que las opciones de navegación funcionen. A todos nos ha pasado más de una vez, navegar por un sitio, quizás a través de intrincadas secciones de navegación por niveles, para finalmente encontrar lo que estábamos buscando, y al hacer click para verlo, aparece un error 404 (o cualquier otro) que provoca que el contenido no esté accesible finalmente (una ficha de producto, por ejemplo).

Te puede interesar

Páginas de categorías, parrillas o listados de productos

Los usuarios que llegan a tu tienda desde un motor de búsqueda externo, a menudo aterrizan en una página o parrilla de categoría, o en una página de listado de productos, si han buscado un tipo de producto (categoría, familia o gama de producto, etc.) en lugar de un producto específico. Estas páginas de nivel intermedio pueden tener un excelente rendimiento SEO, por lo que deberías procurar que la experiencia de usuario dentro de ellas esté muy cuidada, que sean muy fáciles de usar.

Según factores como tipo de producto que vendemos, volumen y amplitud de nuestro catálogo, cantidad de referencias, etc., puede resultar básica la necesidad de implementar algún sistema de filtrado de la información, y, por otro lado, también deberíamos brindar al usuario una manera de poder ordenar la información. Ambas funcionalidades deberían ayudar al usuario a obtener el producto deseado lo antes posible.

El tipo de filtros que implementemos dependerá del tipo de tienda que tenemos y de los productos que vendemos. Por citar un ejemplo, la electrónica tiene muchas especificaciones que se pueden colocar en un filtro, en cambio, una tienda que vende corbatas hechas a mano seguramente necesitará menos filtros, como puede ser el material utilizado, el estilo de vestir (clásico, elegante, informal, casual, por nombrar algunos).

Un sistema de filtros bien pensado puede ahorrar al consumidor una enorme cantidad de tiempo y frustración. Sin embargo, la mayoría de las veces vemos filtros que no se han desarrollado correctamente, que no se ajustan a la categoría de producto en la que se encuentran. Los usuarios no deberían perderse en una intrincada relación de filtros, y claro está, no es conveniente tener filtros generales para todo el sito, sino particulares por cada categoría, ya que, si los tipos de productos son diferentes, tendrán características y especificaciones también distintas. Asimismo, el uso incorrecto de la tecnología detrás de los filtros podría hacer que nuestra tienda genere nuevas URLs para cada búsqueda, y eso es algo que absolutamente no queremos, dadas las implicaciones que puede tener para el SEO (¡todo un mundo hay detrás de esto!).

Un buen ejemplo de utilización de sistemas de filtros lo podemos encontrar en Amazon. Tómate un tiempo para probarlos y estudiarlos a conciencia, podrás sacar interesantes ideas de ellos.

Otro punto importante a tener en cuenta en las tiendas virtuales es la paginación de los productos cuando la cantidad de resultados es grande. Hay diversos sistemas, cada uno de ellos con sus ventajas y desventajas.

Dada la importancia de estos elementos (filtros, ordenamiento, paginación), desarrollaremos más adelante artículos específicos para profundizar debidamente en cada uno de ellos.

Página/ficha de producto

Si el usuario llegó hasta éste nivel de navegación, por decirlo de alguna manera, la decisión de compra puede estar cerca, por tanto, la impresión que se lleve al navegar e interactúar con ésta página será crucial. Es por eso que debemos tratar a las fotos y a la descripción de un producto como elementos importantes en lo que a usabilidad web (UX) se refiere.

Además de brindar una descripción detallada del producto e imágenes de alta calidad, no podemos olvidarnos de cuidar otros detalles como las especificaciones técnicas, el precio (descuento si procede), disponibilidad de stock, costes de envío, opciones de pago, etc.

Volviendo al tema de las fotos, dependiendo de lo que vendamos, es necesario contar con una cierta cantidad de imágenes desde diferentes ángulos. Está claro que deberán tener una buena calidad y suficiente resolución para la versión «zoom». Y, en relación con el zoom o ampliación del tamaño de una imagen, podría jurar que todos alguna vez, al pinchar en la funcionalidad de zoom en la ficha de producto de una tienda virtual, nos encontramos con que la imagen que se despliega para la versión ampliada, ¡es la misma o incluso más pequeña que la imagen normal del producto! Pues, aunque ésta es una regla ya antigua dentro de cualquier checklist básico para una tienda digital, aún hoy vemos que con frecuencia no se respeta, aunque parezca surrealista.

La desventaja clave del comercio electrónico frene al comercio tradicional es que los usuarios no pueden tocar, sentir, ver, probar u oler las ofertas (al menos por ahora). Los clientes tampoco se benefician del impulso esencial de credibilidad que supone tener el producto a comprar en la mano, antes de pagar el precio, es decir, no hay experiencia táctil. Las compras en línea son puramente una experiencia informativa. Esto nuevamente otorga una gran importancia al buen contenido visual.

¿Migas de pan o breadcrumbs? Fundamentales. No sabemos de qué manera ha llegado el usuario a la ficha de un producto, sea navegando por categorías, por un banner promocional en la página de inicio o home, a través del buscador interno, y por supuesto, desde una parrilla de resultados de un buscador externo (Google, Yahoo, algún agregador o marketplace, etc.). En cualquier caso, al aterrizar el visitante en la ficha de producto, y luego de ver e interactuar con la página, puede tener interés en dirigirse a la categoría o subcategoría a la que pertenece el producto, puede querer ir a la página de inicio o home, etc., y es en este punto cuando las migas de pan se vuelven imprescindibles.

Carrito y checkout

¿Alguna vez has comprado en uno de esos sitios donde al momento de pasar al checkout o cierre de la compra, terminas tan mareado con tanto dato y con idas y venidas entre ventanas, popups o similar para cargar o mostrar información adicional? Sí, yo tampoco, por suerte, pero que los hay, los hay. Debemos mantener el proceso de pago lo más simple posible, sin redireccionamientos, sin distracciones ni formularios engorrosos.

El proceso de pago debe ser lineal, simple y transparente, dos o tres pasos como mucho (si se puede sintetizar todo en uno sin llegar al colapso mental ¡mucho mejor!), y la posibilidad de navegar hacia atrás y hacia adelante en los pasos, para el caso de ser necesario agregar o cambiar algún dato.

Otro punto importante es la claridad en las indicaciones de error al finalizar la compra. Si por el motivo que sea, el proceso de compra falla, debemos comunicarlo al usuario mediante notificaciones de errores que sean fáciles de entender para los usuarios. Nada es más frustrante que no poder hacer una compra y no poder entender por qué. Si esto sucede, nuestro cliente potencial tal vez pueda darnos una segunda oportunidad e intentarlo nuevamente, pero es poco probable que lo intente más de dos o tres veces. Dicho esto, presta atención a los mensajes de error de tu tienda, transmite a tu cliente, en un lenguaje claro y directo qué es lo que debe hacer. Intenta que esos mensajes sean fáciles de ver usando texto rojo, amarillo resaltado o incluso parpadeante para aumentar la visibilidad del texto de error (ojo, sin perder de vista el minimalismo, la sobriedad y la elegancia ;)). Además, coloca el mensaje de error directamente encima, debajo o al lado de los elementos específicos que requieren corrección. Es poco deseable la sensación que produce un mensaje de error general en la parte superior o inferior de la página, que te deja desconcertado e intentando adivinar cómo seguir.

Ya tenéis un montón de cuestiones sobre usabilidad a revisar en vuestras tiendas online, seguro que, si las optimizáis todas, los usuarios van a tener una sensación excelente a la hora de navegar por vuestra tienda.

¿Te interesa la Usabilidad Web (UX)? A continuación, más artículos sobre este tema: