E-commerce para móviles aprovechar al máximo su sitio

Con los avances competitivos continuos en tecnología de teléfonos móviles y tabletas, los desafíos que enfrenta el diseñador de un sitio web de comercio electrónico cambian constantemente. Si bien el progreso tecnológico en esta área es popular entre los consumidores y ofrece constantemente a los propietarios de negocios nuevas oportunidades para llegar a los clientes en escenarios y ubicaciones cada vez más variados, sin duda puede ofrecer a los diseñadores de sitios web algunos obstáculos interesantes. En este artículo vamos a abordar algunos de esos obstáculos. Voy a desglosar algunos de los pasos más importantes a tener en cuenta al preparar un sitio de comercio electrónico para el acceso móvil y ofrecerle algunos consejos basados ​​en mi experiencia..

Cómo compran los consumidores

La demanda de sitios de comercio electrónico accesibles desde dispositivos móviles es alta, pero vale la pena señalar que la forma en que los consumidores compran desde dispositivos móviles es diferente de cómo podrían comprar desde la comodidad de su escritorio. Existe la expectativa de poder acceder a los mismos sitios, pero de tal manera que se simplifique adecuadamente para la pantalla más pequeña.. 

El comportamiento de compra del consumidor en dispositivos móviles difiere significativamente de lo que se observa con dispositivos estáticos más grandes. En una encuesta publicada por Adobe, se destacó que los compradores de tabletas son doble de probabilidades para realizar una compra como compradores de teléfonos inteligentes, demostrando la forma en que la herramienta en particular influye en la actividad del consumidor. Para obtener más información sobre esta tendencia, eche un vistazo a este estudio sobre la compra de tabletas (aquí puede descargar el Estudio de Adobe Digital Marketing Insights 2012). 

La accesibilidad es la clave

Dicho esto, es importante mantener un equilibrio en la accesibilidad; Si bien el acceso a la tableta es obviamente lucrativo y los usuarios móviles más ricos (a su vez, los consumidores más ricos) podrían inclinarse hacia el iPhone, el sitio debería estar diseñado para funcionar igualmente bien en todas las plataformas móviles. Si bien es probable que esta diferencia de comportamiento se mantenga entre los usuarios de dispositivos más grandes y más pequeños, los diseñadores de sitios web pueden abordar el problema siempre que sea posible, teniendo en cuenta otros problemas que afectan las diferencias de comportamiento y, en última instancia, hacen que sea más fácil para los consumidores realizar compras a través del móvil sitio.

1. Priorizar el contenido

Ya sea que estemos hablando de un sitio web receptivo o de una solución móvil específica, es vital asegurarse de que las características más importantes se transfieran y el contenido del sitio móvil se priorice para facilitar su uso. Estas características deben incluir:

  • Una barra de búsqueda accesible en cada página.
  • Enlace a la cesta y acceso a la cuenta.
  • Fácil acceso a cada una de las categorías o marcas.
  • Pie de página simplificado
  • Imágenes de ancho completo, contenido claramente visualizado y llamadas a acciones.
  • Botones "Presionar para llamar" y "Presionar para enviar por correo electrónico"

Un excelente ejemplo de un sitio de comercio electrónico móvil es el sitio web de Toys R Us, al igual que ASOS; Ambos son particularmente claros para navegar y están dispuestos lógicamente.. 

Si encuentra un sitio particularmente agradable de usar en un dispositivo móvil, piense en los motivos y los elementos que hacen que ese sitio sea compatible con dispositivos móviles. - Los buenos sitios frecuentemente tienen mucho en común.

Decidir qué elementos son relevantes tanto para el escritorio como para el móvil es una parte vital del proceso. El truco está en priorizar; ordene sus enlaces de forma lógica y asegúrese de que las funciones funcionen igual de bien para los usuarios móviles que para los usuarios de escritorio. Los elementos más importantes para un sitio de comercio electrónico son:

  • imagenes de productos
  • precio 
  • Botones "añadir a la cesta"

Así que se deduce que estos siempre deben estar en la parte superior de la pantalla. Menos importantes son las redes sociales y los enlaces de productos relacionados, por lo que mientras el sitio debería alentar a estos últimos, Mantener el enfoque en el producto es clave.

El uso de puntos de anclaje dentro de una página es una de las formas de administrar la navegación del cliente; tener una pequeña selección de enlaces debajo del botón "agregar a la cesta" (como "descripción", "información de entrega", "productos relacionados") que, cuando se presiona, se desliza automáticamente a la parte relevante de la pantalla, lo hace fácil Y eficiente para que los usuarios se enteren del producto antes de la compra. Tener un botón 'volver al principio' constantemente presente es una necesidad.

2. Seleccione el marco adecuado

Recomiendo la construcción de sitios web de comercio electrónico utilizando el marco de Twitter Bootstrap. Es simple, fácil de usar y facilita la escala entre pantallas más grandes y más pequeñas sin contratiempos. Esto viene con HTML, CSS y JS para numerosos usos, proporcionando diversos elementos de interfaz, incluidos grupos de botones, menús desplegables, miniaturas, alertas, barras de progreso y mucho más. También ofrecen algunos buenos consejos sobre cómo encajarlo todo, así como algunas plantillas sugeridas y estímulos para 'repetir' [los] ejemplos '. Esto le ayuda a hacer que su sitio sea único, pero con el beneficio de la guía inicial que proporciona el marco.. 

Opendesk se basa en Twitter Boostrap

Actuación

El uso de un marco como este también ayuda con otro aspecto importante del comercio electrónico para dispositivos móviles: optimización del rendimiento. Herramientas como Twitter Bootstrap pueden ayudar a usar CSS en lugar de imágenes siempre que sea posible, lo que ayuda a la optimización del rendimiento. Si se necesita un degradado, use CSS en lugar de una porción de imagen. Se puede optimizar cualquier imagen asegurando que el tamaño del archivo sea lo más pequeño posible sin comprometer la calidad innecesariamente. Los archivos de Javascript y CSS deben reducirse y, lo que es más importante, asegurarse de que los archivos de Javascript no deseados no sean llamados cuando se cargan en un dispositivo móvil. Por ejemplo, si hay un carrusel en la página de inicio y un complemento Javascript de "hacer clic para ampliar" en las páginas del producto, asegúrese de que no estén cargados cuando se acceda al sitio desde un dispositivo móvil. Todas estas comprobaciones ayudan a que el sitio funcione de la manera más eficiente posible para los usuarios móviles..

3. Socializa tus productos

Debido a las formas en que usamos nuestros móviles para redes sociales, es probable que los clientes que ven un sitio desde sus móviles ya hayan iniciado sesión en sus cuentas de Twitter y Facebook. Es importante que su sitio de comercio electrónico esté diseñado para que compartir elementos con amigos y seguidores a través de estas herramientas sea lo más rápido y fácil posible. Después de todo, es publicidad gratuita, por lo que todo lo que se pueda hacer para alentarlo solo puede ser bueno para los negocios.! 

Etsy coloca los enlaces de intercambio social de manera destacada en cada producto.

Una vez más, la naturaleza de los hábitos de navegación móvil significa que es probable que los consumidores estén más limitados en el tiempo que cuando están sentados frente a una computadora y es mucho menos probable que se embarquen en un proceso complicado (esto es relevante para todos los aspectos del sitio de comercio electrónico móvil). , no simplemente redes sociales). Como resultado, es a nuestro favor garantizar que todo lo que se ofrece a través de un sitio de comercio electrónico se pueda ejecutar de forma rápida y sin problemas desde un dispositivo móvil.. 

Los enlaces de redes sociales son tan importantes como cualquier otro elemento; después de todo, a menudo se pueden traducir directamente en más tráfico de sitios web y más ventas de comercio electrónico. Los enlaces que pueden copiarse fácilmente, los botones "me gusta" de Facebook y los botones "seguir" de Twitter deben ser accesibles y sin complicaciones. De la misma manera que el sitio tiene que simplificarse para dispositivos móviles, las expectativas de los usuarios móviles también se simplifican; nadie quiere jugar con infinitas pantallas múltiples en un teléfono móvil. Consulte a continuación nuestra estructura de pago recomendado para ver un ejemplo de lo que queremos decir. Si piensa en el tipo de situaciones en las que se realiza el acceso a Internet móvil con mayor frecuencia (desplazándose, esperando a un amigo, esperando un tren), es importante tomar nota de la mentalidad que acompaña a esas actividades. El consumidor móvil es naturalmente más inquieto que el comprador estático. Los clientes a menudo abandonarán un sitio móvil por completo si se enfrentan a una experiencia frustrante de forma remota. Todo lo relacionado con las compras móviles se remonta al punto básico que, si es complicado de hacer, es muy probable que el consumidor no lo haga. Eche un vistazo aquí al Informe de Medios Sociales de Nielsen 2012 para obtener información realmente útil sobre el comportamiento del consumidor a través de las redes sociales..

4. Estructurar (cuidadosamente) el proceso de compra

Como el proceso de pago requiere numerosos campos de texto, puede ser una de las partes más difíciles de un sitio de comercio electrónico. El proceso debe estar bien estructurado y ser fácil de seguir en un dispositivo móvil. Aconsejaría diseñar el carrito de la compra en las siguientes secciones:

  • Lista de productos con botones sencillos + y - para gestionar cantidades
  • Una ventana para códigos de cupones.
  • Gastos de envío claros
  • Costos totales (una vez seleccionada la entrega)
  • Botón grande y claro de 'pago'
  • Botón de "continuar comprando" fácil de encontrar: es importante permitir que el cliente vuelva fácilmente a los productos durante el proceso de compra.

Al diseñar el proceso de compra, una estructura de acordeón es un gran enfoque. Esto le da al usuario una visión clara del proceso y mantiene toda la información relevante en una pantalla. Nuevamente, los sitios web de Toys R Us y ASOS sirven como buenos ejemplos de carritos de compras que son fáciles de usar en dispositivos móviles. 

Recomendaciones sobre soluciones de eCommerce

En el lugar donde trabajo, desarrollamos todos nuestros proyectos de comercio electrónico utilizando nuestro propio sistema que construimos nosotros mismos para hacerlo lo más rápido, confiable y flexible posible. Si usted es un desarrollador web y tiene el tiempo, le recomendamos que invierta ese tiempo en desarrollar un sistema propio.,ya que le permite adaptarlo a sus necesidades precisas. Sin embargo, ¡no subestime cuán complejo e involucrado puede ser esto! Para las personas, a menudo no tiene sentido desde la perspectiva del retorno de la inversión, y puede llevar a más complicaciones cuando el desarrollo y el apoyo deben continuar. Si, en cambio, está buscando una solución "lista para usar", según los requisitos, recomendamos Magento o Shopify. Woocommerce también está ganando popularidad rápidamente debido a su familiar integración con la plataforma Wordpress..

Distribución del tipo de tecnología de carrito de compras utilizada a nivel mundial (marzo de 2014).

Magento es una plataforma de código abierto que se puede descargar y personalizar. El inconveniente de esta opción en particular es que es grande y puede ser lento, por lo que si está utilizando esta plataforma, los puntos anteriores en la optimización del rendimiento serán particularmente relevantes.

Shopify es una solución alojada que es rápida y fácil de usar. Constantemente se lanzan nuevos complementos y actualizaciones y, como resultado, es fácil encontrar complementos que ayudarán a acelerar su sitio de comercio electrónico para dispositivos móviles. Echa un vistazo a la serie reciente Aprende cómo crear temas para Shopify para obtener más información.

Conclusión

Vale la pena 'comprar' un poco por ti mismo; Visite diferentes sitios de comercio electrónico desde un dispositivo móvil y tome nota de los que son buenos y, lo que es más importante, los que son malos. Los sitios que se ven bien desde una pantalla de escritorio no siempre se traducen bien en dispositivos móviles. Tome nota de las cosas malas tanto como de las que encuentre útiles, para evitar cometer los mismos errores.. 

Recuerda; mantenlo simple. Cuanto más claros sean los pasos y más transparente sea el proceso de compra, mejor.Los consumidores móviles esperan una experiencia sin complicaciones y de respuesta rápida; comprar desde un móvil es inherentemente un estado mental tanto como una opción de dispositivo. Sobre todo, facilite a sus clientes que gasten su dinero con usted,en lugar de con otra persona cuyo sitio simplemente está mejor estructurado.