Lo que necesita saber para el rediseño de un sitio de comercio electrónico en 2019

¿Este es el año en el que vas a rediseñar tu sitio web de comercio electrónico? Si han pasado algunos años desde que lo hiciste, entonces necesitas saber que muchas cosas han cambiado.

Casi no hace falta decir que un sitio de comercio electrónico moderno debe diseñarse primero para dispositivos móviles, ya que la mayoría de los que trabajo ahora obtienen 70% o más de su tráfico desde dispositivos móviles. Sin embargo, eso es solo un punto de partida: hay muchas sutilezas que debe considerar si desea que su sitio convierta a los usuarios en clientes.

He consultado sobre el usabilidad para una amplia gama de sitios de comercio electrónico en los últimos cinco años y he desarrollado los principios que siguen los mejores. Le mostraré ocho formas de asegurarse de que su sitio esté actualizado para el usuario de hoy, inspirado en las pautas de mi libro. Diseño de sitios web de comercio electrónico.

Evita los videos largos en la página de inicio.

La página de inicio es un lugar para impresionar. Muchos sitios web ponen dinero en la fotografía de gama alta, pero podría considerar usar el video aquí para mostrar los productos o contar la historia de la marca. Después de todo, el video está en todas partes ahora, especialmente en las redes sociales.

Cuando se usa correctamente, el video puede ser excelente para informar a los usuarios y también para entusiasmarlos. Sin embargo, no importa lo llamativo que sea tu video, si el usuario necesita hacer clic en reproducir, prepárate para la mayoría de la gente lo ignora. En las muchas pruebas de usuarios que he visto, este es el comportamiento más común con los videos de la página de destino.

¿Por qué? En esta etapa del viaje del usuario, su capacidad de atención es corta. Es más probable que los usuarios abandonen el sitio por completo y reboten, no dediquen tiempo a ver algo desconocido.

Al principio, debe ayudar a los usuarios a moverse rápidamente, así que apueste por videos cortos, silenciosos, de reproducción automática, en bucle. De esta manera usted obtiene la información a través de ellos sin necesidad de comprometerse profundamente. Los videos más largos pueden ser muy útiles más adelante en el viaje para explicar cosas como las características del producto, cuando el usuario está más interesado.

El sitio de Prynt utiliza un video de reproducción automática corto para mostrar el producto en acción. También hay una opción para ver la cosa completa con sonido.

No llene su página de inicio con exceso de contenido

Si ha realizado el arduo trabajo de marketing para que los usuarios accedan a su página de inicio y haya creado un tono atractivo para su tienda, ¿qué sigue? ¿Hay muchas cosas que podría contarles sobre su compañía, así que ahora es la oportunidad?

Ten cuidado. Cuanto más tiempo haga su página de destino, mayor será el riesgo de que el usuario se apague o se confunda. Si bien los usuarios se sienten cómodos desplazándose, pronto se detendrán si el contenido no está directamente relacionado con su tarea.

Siempre que diseñes, apégate a la regla de 'una página, un propósito'. El propósito de esta página es presentar lo que vende y hacer que el usuario busque esos productos.

¿Realmente necesitan ver sus cinco publicaciones de blog más recientes, sus últimos tweets y una pared de imágenes de Instagram? Las publicaciones sociales son particularmente inútiles, ya que acaba de tener usuarios en tu sitio y hacer clic en ellos los eliminará de nuevo.

Cuantas más cosas pongas en la página, más distracciones que le estas dando al usuario de tu acción principal y la cosa clave que quieres que hagan. Los usuarios de dispositivos móviles tienden a tener sesiones más cortas y se enfocan en lograr tareas; el contenido adicional no ayudará con eso.

Haz tus filtros fácilmente accesibles

Cuando tiene muchos productos, los filtros son esenciales para ayudar a los usuarios a encontrar lo que necesitan. La gran mayoría de los sitios de comercio electrónico (sobre 90% de los que he estudiado.) tienen sus filtros en una superposición en el móvil. Esto tiene sentido cuando no hay mucho espacio disponible, pero significa que los usuarios no son muy propensos a verlos.

Como una regla 95% de usuarios no cambia los valores predeterminados y esto se aplica a la apertura de un menú de filtros para seleccionar opciones específicas. Es algo que se ha confirmado en las pruebas de usuario de comercio electrónico que también he visto. Encontrar productos en las páginas de listas es un área donde la experiencia de navegación de comercio electrónico es superior en el escritorio.

Si los usuarios filtran, es más probable que encuentren un producto que realmente quieren. Tu desafío en el móvil es encontrar maneras de hacerlo que ahorren espacio. Un método es mostrar la categoría de filtro más relevante en la página con botones para las opciones (consulte Macy's a continuación). Al tocar uno, se cargarían los listados con ese filtro aplicado, en cuyo punto se mostraría el siguiente filtro más relevante.

rediseño de comercio electrónico - opciones de filtro de macy
El sitio de Macy's trae algunas opciones de filtro en la página como botones. Burberry hace visibles las categorías de filtro en la página.

Como mínimo, asegúrese de que su botón para llegar al menú de filtro completo sea obvio. También debe indicar claramente cuándo se aplica un filtro, para que los usuarios sepan cuándo están viendo un conjunto limitado de resultados.

Rediseña tus anuncios para imágenes más grandes.

La mayoría de las páginas de listas de comercio electrónico intentan mostrar muchos productos en pantalla al mismo tiempo. Como resultado el producto Las imágenes tienden a ser bastante pequeñas. (Es por eso que tradicionalmente se conocen como imágenes en miniatura).

Sin embargo, la imagen es una parte clave para ayudar al usuario a tomar una decisión sobre qué producto seleccionar. En muchos casos, te dice mucho más que cualquier texto. Los productos como ropa y muebles se basan en que el usuario haga una distinción subjetiva entre las diferentes cosas que se ofrecen.

Incluso puedes tener grandes imágenes en el móvil. Las aplicaciones como Instagram han llevado a los usuarios a esperar una alta calidad dondequiera que estén y muchas veces he visto que los usuarios lo aprecian. No importa dónde se encuentren en el sitio, siempre se ama la buena fotografía.

Airbnb tiene imágenes grandes que se pueden desplazar (izquierda). Zara (derecha) tiene imágenes de ancho de pantalla completa en sus listas.

Por supuesto, si crees que algo se puede vender mejor en unas pocas imágenes, entonces hazlo. Los sitios de viajes a menudo tienen varias fotos en miniaturas de anuncios con una flecha sutil para desplazarse por ellas. Muchos sitios de ropa ofrecen la opción de mostrar el producto solo y ser usados ​​por un modelo.

Mostrar opciones de productos como botones

Sabrá que muchos productos están disponibles en variaciones como el color, el tamaño, el material o algo más. La página de detalles del producto es donde los usuarios finalmente hacen esa elección. Para facilitar la elección, debe evitar deshacerse de estas opciones en los menús desplegables.

Ellos deberían ser botones visuales para ayudar al usuario a ver todas las opciones y deben aclarar cuándo una variación significa un cambio en el precio. Si la variante cambia el aspecto del producto (como el color), al seleccionarlo se debe actualizar la imagen principal del producto. Esto deja al usuario sin dudas sobre lo que se ordenará.

rediseño ecommerce - opciones de tamaño nike
John Lewis (izquierda) tiene colores de productos como botones con indicadores visuales. Nike (derecha) expone todas las opciones de tamaño y deshabilita los tamaños que no están disponibles.

Otro beneficio es que al deshabilitar ciertos botones, el usuario puede ver de un vistazo qué variantes están agotadas. Nuevamente, esto guarda el desplazamiento a través de una lista desplegable de opciones.

Cuando se trata de la selección de tamaño, es mejor no tener un tamaño predeterminado. Si hay usuarios, podría terminar agregando el predeterminado en lugar de uno que ellos quieran. Esto podría llevarlo a obtener muchas devoluciones y clientes frustrados.

Deja fuera los botones de compartir

Facebook, Twitter, Pinterest, Instagram, LinkedIn, Snapchat. Sus usuarios probablemente se reúnen en uno o más de estos redes sociales. Entonces, ¿debería darles botones para compartir en las páginas de detalles de su producto?

Muchos sitios de comercio electrónico aún presentan esos pequeños íconos con la esperanza de que alienten a las personas a promocionar sus productos en la web. Desafortunadamente, son casi una pérdida de tiempo.

Nadie hace clic en ellos. En realidad 0.2% de personas lo hacen, según un estudio. También puede parecer un fragmento de código, pero viene con un montón de cosas adicionales que disminuyen la velocidad de la página.

El auge de los "influencers" pagados significa que el usuario moderno ya no quiere ir a transmitir para las marcas sin algo para ellos. Más personas estarán dispuestas a compartir en privado con un amigo o familiar. Los enlaces que permiten compartir a través de correo electrónico o un servicio de mensajería instantánea como WhatsApp probablemente funcionarán mejor.

Integrar billeteras de pago.

Servicios de billetera de pago tales como PayPalApple Pay y Android Pay están en aumento. Cada vez es más común verlos como opciones en los flujos de pago de comercio electrónico. De hecho, pueden eliminar el pago estándar y posiblemente El uso de tarjetas de crédito y efectivo. en total.

rediseño ecommerce - amazon pay integra
Tamara Mellon (izquierda) tiene la opción de Apple Pay, PayPal y Amazon Pay en su cesta y pago. Gucci ofrece la posibilidad de saltar a PayPal desde la notificación 'agregar a la bolsa'.

Ingresar una contraseña, huella digital o escaneo facial y luego poder completar el proceso de pago de forma inmediata es mucho más conveniente que llenar formularios. Con el comercio electrónico dominado por el móvil, es esencial ofrecer un pago fácil que no implique un rellenado de formularios.

La facilidad de uso debe alentar a más usuarios a completar el proceso de pago con usted. También hay un beneficio de seguridad ya que los usuarios probablemente se sentirán más seguros con una billetera como intermediario si no han oído hablar de su marca antes.

A través de las pruebas de usuario que he ejecutado en flujos de pago, escucho regularmente comentarios como "Prefiero la opción de usar PayPal" y "Soy muy consciente de la seguridad y solo pagaré con PayPal". Actualmente, PayPal es bien conocido, pero cuando decida cuál usar, vaya a los países y dispositivos más populares de su sitio.

Permitir a los usuarios recoger

Un número creciente de sitios web de comercio electrónico ofrece a los usuarios la posibilidad de recoger su pedido en lugar de recibirlo. Es bueno para los usuarios que no están en casa muy a menudo y tampoco pueden recibir la entrega en su lugar de trabajo. Dar esta opción solo aumentará el número de usuarios que pueden comprarte.

El enfoque más fácil (y, a menudo, el mejor) es agregar la colección como una alternativa a la entrega en la caja. Pídale al usuario que ingrese su ubicación y que le muestre las opciones de dónde puede recoger su pedido. También es importante que muestre el horario de apertura del lugar de recogida, ya que estos datos a menudo provienen de la integración con una empresa de entrega.

Una ventana de hacer clic y recopilar de la compra de ASOS, que permite al usuario elegir a qué tienda de conveniencia enviar su envío.

El enfoque más complejo es que usted integre la opción de recopilar en cada página de detalles del producto en el sitio. Esto tiene sentido si tienes tiendas de ladrillos y mortero ya que permite el control de stock en tiendas específicas.

Sin embargo, pueden surgir problemas cuando los usuarios tienen varios productos en su pedido. Si no tienen cuidado, pueden terminar con algunos productos para la entrega y otros para la recolección (una canasta 'mixta'). Para evitar esto lo antes posible, recomiendo que el usuario especifique la recolección o la entrega que se encuentra en la etapa de cesta, por lo que se aplica a todo el pedido.

Más consejos de comercio electrónico.

Fueron ocho formas de asegurarse de que su sitio de comercio electrónico se haya rediseñado para que sea apto para 2019 y más allá. Por supuesto, hay que considerar más que eso al rediseñar un sitio web de comercio electrónico completo. De hecho, he escrito un libro que contiene las pautas de 66 para diseñar tiendas en línea que conviertan, según los años de experiencia de diseño de UX de 10.

El libro se llama Designing Ecommerce Websites, es disponible en Amazon en una variedad de formatos, incluyendo rústica y Kindle. O puedes conseguir el versión digital en PDF en mi sitio, que incluye todas las ilustraciones del libro impreso. También puede obtener 15% de descuento La versión digital por tiempo limitado con el código de promoción PLATAFORMAS.