A raíz de un proyecto que tenemos entre manos, en el cual diseñamos y desarrollamos una tienda online, hemos recibido por parte de nuestro cliente una referencia de la competencia, que a efectos prácticos no solamente está posicionado como referente en Europa sino que efectivamente está sacando provecho comercial de su canal online, vendiendo. La lectura de nuestro cliente es clara y comprensible: quiero posicionarme y vender cómo ellos venden.

Pero analizando la referencia que nos ha llegado no hemos querido desaprovechar la oportunidad para hacer un análisis de ella, y a partir de dicho análisis sacar unas conclusiones que todo aquel que quiera realmente vender por Internet tendría que asimilar.

Análisis de la tienda online / e-commerce seton.es

El objetivo de una tienda online / e-commerce es vender

No vamos a entrar en juicios estéticos sobre la web seton.es, ni mucho menos… porque el objetivo principal de un e-commerce es conseguir conversiones, captar nuevos clientes, fidelizar clientes existentes… pero de una forma u otra, y con una estrategia y otra.. en el fondo, vender, vender y volver a vender.

Si ese objetivo se consigue (como nuestro propio cliente comenta que ocurre en el caso que nos ocupa), obviamente la conclusión es que la solución implantada cumple su cometido. Como todo, siempre hay margen de mejora (y no nos cabe duda que en este caso hay mucho margen de mejora), pero si hacemos algo con el objetivo de vender… y vende… blanco y en botella… leche. La cosa funciona, estamos en la primera base, y nuestro objetivo sería la segunda: que funcione mejor / que venda más.

¿Las causas? Aquí es donde empieza la miga…

1) Navegación

La navegación en un e-commerce es algo crítico. Con ella se puede dar un paso adelante para que el usuario encuentre lo que busca, confirme su intención de compra y finalmente compre… o que aunque no encuentre lo que busca se le ofrezca una alternativa, y se logre un contacto comercial.

La web analizada, no presenta una buena estructura de contenidos. Sí que es consistente en el sentido de repetir a lo largo de toda la web una estructura, pero por ejemplo: ¿Cuál es realmente el menú principal? Podemos encontrar hasta tres menús que compiten en relevancia repartidos por la zona superior, la izquierda y la derecha.

¿No sería mejor ofrecer una navegación más consistente y tener los contenidos relevantes accesibles desde el mismo lugar? Las elecciones confunden al usuario, cuantos más procesos de decisión le imponemos más obstáculos le estamos dejando en el camino a su objetivo, y al nuestro, por tanto siempre es recomendable tener un menú único, claro y que refuerce aquello que oriente al usuario a su / nuestro objetivo.

Ese menú ya debe ser una guía o un reflejo de cuál es la estructura básica y el árbol de contenidos, asociando elementos y conceptos y eliminando duplicados.

Referencias
A Good User Interface #3
A Good User Interface #32
Artículo de la Universidad Politécnica de Valencia sobre Ecommerce
Choice Paradox

2) Gestión de la intención de compra

En proyectos de e-commerce es fundamental disponer de un espacio desde el primer impacto en el que el usuario recibe nuestro objetivo de venta. Una forma habitual de lograrlo es mediante el uso de zonas de producto destacadas en la home de la tienda online.

A nivel visual la web analizada dispone en su página principal de un espacio reservado a tal efecto (discutible su visibilidad, diferenciación y formato, pero ahí está) ya que cuenta con un slider para productos «destacados» y de un listado de categorías. Vemos dos problemas importantes aquí:

Primero, y a pesar de que trata de lograr una conversión a compra mediante un botón «call to action», ¡no indica el precio! ¿Cómo puede un usuario decidir comprar algo sin conocer el precio? No vamos a engañar a nadie, la claridad en los precios en una tienda online es un refuerzo positivo.

Por otro lado y aunque el color del botón sea rojo de una intensidad considerable… el diseño de los destacados es tan agresivo que muchos elementos compiten de igual a igual con él. Si quieres emplear un call to action, deberías ayudarle a lograr su propósito.

Creemos que se desaprovecha ese espacio para destacar solamente 2 productos. Y ni siquiera de forma permanente, ya que el slider sólo permite ver uno de forma simultánea. Se nos ocurren varias maneras de mejorar esto, pero siendo muy básicos y pensando en conservar al máximo la estructura actual y objetivo de mostrar categorías, cada categoría podría ser «introducida» a través de un producto estratégicamente seleccionado que pudiera ser adquirido desde la home misma (obviamente con su precio). Eso no tiene por qué pelearse con la posibilidad de destacar de manera global algunas categorías cercanas/relativas al producto. Así cobraría bastante más sentido el enlace «más productos».

En definitiva, estamos hablando de una cuestión de estrategia comercial pura y dura… Quizás aún seamos de los que piensan que en un supermercado todos los productos se colocan por casualidad. Quizás pensemos que como comercio no nos interesa vender más unos productos que otros (queremos venderlo todo!) o realmente estudiar cuáles son los que mejor funcionan, añadir interés adicional a un producto (hablando de señales relativas a nuevas legislaciones por ejemplo), etc…Todo esto nos lleva a la conclusión que indica la necesidad de trazar un plan para saber qué productos ponemos en la home, la variabilidad de los mismos y la estrategia de precios o de textos que los acompañan. La página inicial es una de las piezas más importantes de la tienda online.

Referencias
Homepages and category pages: Show what you sell
State the price to give B2B sites a competitive advantage.
Seven tips for designing an effective call-to-action

3) Identificación, categorización y priorización del contenido

Nos hemos encontrado en más de una ocasión con el requisito o recomendación de poblar de contenido el proyecto. Pensar que cuanta más información le demos al usuario más le ayudaremos. En todas partes. Esta afirmación esconde en su interior verdades y mentiras. Obviamente no rebatiremos que dar información al usuario es vital, pocas veces se consigue vender algo ante un comprador con dudas y más aún teniendo en cuenta lo negativo que es que el usuario no puede tocar físicamente el producto. No. La información hay que dársela. Y bien.

Aquí es donde entra en acción la identificación, categorización y la priorización de los contenidos, que nos ayudarán entre otras cosas a simplificar el punto 1, lo que repercutirá en un usuario orientado y capacitado para llegar al punto donde realmente necesite toda esa información adicional.

Mirando hacia nuestra referencia, vamos a hacer algunas consideraciones:

Imagen conceptos web, de Shutterstock.

Tenemos un menú privilegiado en la cabecera, tamaño destacado y reforzado con iconos. Y con un señor problema llamado catálogo. Os animamos a pulsar en él, a ver si os imaginabais acceder bajo ese nombre, a una sección como esa dentro del contexto de una tienda online.

Llamar cátalogo a un apartado donde encontramos un formulario de solicitud de la versión impresa dentro de una tienda online es duro. Seguramente heredado de la jerga de una empresa con un peso mucho mayor en el mundo físico que en el digital. Y eso no es todo… Encontramos un enlace a «catálogo digital». Si pulsamos sobre dicho enlace, seguramente de nuevo nos llevemos otra sorpresa. Interesante, tenemos dos catálogos diferentes en 2 menús relevantes y un tercer menú completo que en realidad es el auténtico catálogo online, pero que no se identifica como tal y la realidad es que no necesitaría hacerlo si tuviera el peso que se merece.

¿Quieres que la gente encuentre tus productos? Identifica claramente dónde hacerlo. En un e-commerce el menú principal tiene que ser claro, reconocible y ha de convertirse en la puerta de entrada al catálogo de productos. Todo lo que interfiera en ese objetivo es un problema.

Imagen conceptos web, de Shutterstock.

Aquí tenemos otro aspecto interesante. Todas las categorías que se muestran en el menú principal (no llamado así por su peso en la web, sino por la importancia de lo que contiene) nos llevan a otro selector de subcategorías. Sin rastro de productos. Llevamos 2 niveles de navegación en una tienda online, y sólo hemos visto 2 sliders que hablan de algo que se puede comprar pero que no tiene ni precio. Algo está fallando.

Además las subcategorías se nos muestran en formato de rejilla (lo cual no tiene por qué ser mejor que un formato en listado) con la buena intención de representar con una imagen el contenido que nos podremos encontrar en su interior, pero ni las imágenes son representativas en muchos casos, ni siempre es buena idea según a qué nivel de profundidad nos encontremos emplear una imagen de producto con tanto peso visual frente al nombre de la categoría como representación de según qué categorías.

Bola extra: las subcategorías no parecen tener ningún orden lógico, lo cual tendría que analizarse con más conocimiento de causa para entender la motivación de esa decisión, pero a priori impide que el usuario que busca algo concreto, pueda analizar de forma ágil si está en el lugar correcto.

¿Pensabais que habíamos acabado? Pues no. En un buen número de subcategorías, pulsamos y ¡nuevas sub-subcategorías! Y aún sin rastro de un producto que comprar :S En este punto es cuando te das cuenta, que el buscador es tu mejor aliado en esta web. No negamos que en algunas ocasiones se necesitan numerosos niveles de profundidad. NO incorporar un buscador en esta situación hubiese sido un error MUY grave.

Referencias
Increasing e-commerce conversion rates: Category Pages
6 tips to define the best view for your product range: list/grid view

Imagen success concept, de Shutterstock.

Dejando de lado el hecho de que naveguemos hasta en tres niveles de profundidad sin llegar a ningún producto y dado que sería muy subjetivo hablar sobre las causas por las que algunas subcategorías o sub-subcategorías están ordenadas de la forma en la que lo están, nos centraremos en un hecho curioso que hemos detectado y que hace pensar que probablemente este aspecto tampoco ha sido tenido en cuenta.

Pasemos el puntero del ratón sobre la sección «Señalización» > «Evacuación e incendio». Veremos que el orden de la subcategorías es: señalización fotoluminiscente, cajas de seguridad para llaves, equipamiento de intervención…

Si hacemos clic en la categoría padre (Evacuación e incendio), comprobaremos que el orden es diferente: cajas de seguridad para llaves, equipamiento de intervención, señalización fotoluminiscente… ¿Por qué? Algo no cuadra, ¿no? Ahhh los detalles!

Los ejercicios de priorización con clientes suelen ser duros, ante la pregunta ¿qué es más importante? la respuesta suele ser «todo es importante». Pero hay que hacerlos, y si el cliente no lo logra por si mismo pero ya «hace caja» o vende, no es tan complicado que entienda lo que es importante y lo que seguramente no lo sea.

La importancia de un contenido podría ser un motivo puramente económico (es lo que más vende), de status (es una referencia de consumo) o estratégico (potenciar su venta). Pero SIEMPRE hay criterios para hacer una priorización.

Protip: Algo que suele funcionar es no preguntar al cliente en positivo (qué es mejor) sino en negativo (si te obligaramos a quitar algo, qué quitarías).

Referencias
Prioritize: Good Content Bubbles to the Top
Ejemplo «Cut the Clutter»

4) Refuerzo visual jerarquía y profundidad

En la web no se hace un buen uso del contraste, el tamaño y el color. Hay demasiados elementos con colores que complican la identificación de elementos como un simple enlace, qué no lo es y qué es contenido relevante o no. Es necesario crear un estilo visual consistente y que aporte profundidad y jerarquía a los elementos. No hacerle difícil al usuario identificar las acciones principales, que son la base de la conversión… hay un camino que debería estar trazado y preparado para él.

Referencias
Ley de Fitts
A Good User Interface #6
A Good User Interface #11
A Good User Interface #16
A Good User Interface #23
A Good User Interface #31

5) Venta cruzada

En la página analizada no parece que se potencie la venta cruzada mediante las referencias entre diferentes productos, de hecho con el esfuerzo que supone llegar al detalle de un producto, sería muy de agradecer sólo por el hecho de evitar tener que volver a navegar tras diferentes niveles niveles para lograr llegar hasta otro producto. Más allá de esto, la venta cruzada es algo que ninguna tienda online debería dejar de lado.

Referencias
Venta cruzada

6) El producto

Lamentablemente ya hemos comprobado que en nuestro ejemplo el producto no está demasiado bien tratado, pero si analizamos este tratamiento a nivel visual, vemos que ocurre algo muy similar. El espacio dedicado a producto en la web está en torno al 60%, algo más de la mitad del espacio disponible. Es un porcentaje que a priori puede parecer suficiente pero hay estructuras mucho más apetecibles desde el punto de vista del detalle de producto que además simplificarían la organización de la información, y permitirían un mayor espacio para la imagen de producto que es otro factor que puede incrementar las ventas (¿imágenes de detalle de producto de 200 x 195px de ancho sin posibilidad de zoom?).

Hay muchísimos ejemplos sobre lo que consideramos una buena página de detalle de producto, pero basta con dejarse caer por algún recopilatorio como éste para ver ejemplos más que correctos.

Referencias
Common mistakes in ecommerce design, punto 15
The Good: Bigger Product Images
How to create a great e-commerce content strategy

¿Se pueden comparar dos tiendas online por su aspecto? O cómo entender que las comparaciones son odiosas

Sería un grave error pensar que con un mejor diseño y solventando estos aspectos y muchos otros estaríamos en una posición ventajosa con respecto a la web mencionada. Sin duda esto sería una mejora… pero ¿acaso eso garantiza que vamos a vender más que ellos? Sería una bella recompensa al trabajo bien hecho pero al igual que un negocio físico no vende si no hay un equipo y esfuerzo continuo detrás, una tienda online nota esa falta aún más.

Montar un negocio en Internet no exime de trabajar duro y dedicar tiempo al cuidado del mismo. Parece obvio, ¿verdad? Las limitaciones, falta de información y miedos que genera el medio, así como la durísima competencia en precios hace que existan muchos factores que determinan quién se lleva el gato al agua. Hemos conocido casos en los que propietarios de negocios físicos con su correspondiente «reflejo» en el mundo virtual, ni siquiera entraban en su panel de administración para comprobar si había ventas.

Es por ello que más allá de la parte técnica, es responsabilidad directa de nuestro cliente controlar y asumir algunos de los aspectos mencionados para lograr trasladar al mundo online el buen posicionamiento conseguido en el mercado «físico». Ofrecemos unos cuantos extra:

• Promoción del nuevo canal (tanto por si mismo, como usando otros medios: los canales en los que ya se vende actualmente, packaging de producto, adwords, etc.)
• Dedicar recursos al catálogo de la tienda online (no es una lechuga que se planta y la vemos crecer sin regar).
• Fomentar el contacto al máximo con el cliente online.
• Dedicar recursos para la atención de ese cliente que nos llega de la tienda online.
• Analizar estadísticas (para entender qué funciona mejor y qué no).
• Realizar tests con alternativas cuando existan dudas de qué funcionará mejor.
• Pivotar si es necesario para poder asumir los cambios hacia eso que hemos constatado que funciona mejor.
• …

Conclusión

Una tienda online o e-commerce es un proyecto complejo, tanto o más que un negocio físico. Las reglas del juego son en muchas ocasiones desconocidas por la parte interesada y hay muchos factores técnicos que pueden entorpecer el camino… Pero al final la base es realmente la misma que en la venta de producto o servicio físico: oferta y demanda, precios, marketing, acciones comerciales, dedicación, implicación, recursos, atención al cliente…

(Imagen de entrada cortesía de Shutterstock. Link original)