3.1 Diseño de Tienda Online
Algunos consejos que dispararán las ventas
Antes de comenzar a pensar el diseño que debería tener tu tienda web, es importante tener claro lo siguiente: el comercio que se realiza en el mundo análogo, o físico, se apoya inconscientemente en todos los sentidos que tenemos los seres humanos, es decir, la vista, olfato, gusto, tacto, y audición.
En cada decisión de compra, queramos o no, vamos a utilizarlos todos, o al menos, varios de ellos. Por ejemplo, al comprar una fruta, la tomamos con la mano, la sentimos, la miramos, la olemos, etc.
Sin embargo, en el comercio digital los sentidos que podemos utilizar son solo dos: la vista y audición. Es decir, el diseño estará fuertemente condicionado a lo que se pueda lograr utilizando solo esas dos dimensiones. Por lo tanto, hay que darle mucha importancia a la calidad de las imágenes, de los videos y de los relatos que acompañen a los productos / servicios ofrecidos. ¡Debo poder seducir a los potenciales clientes usando solo esos dos sentidos!
¿El diseño de tu tienda está afectando las conversiones?
Cuando construiste tu primer sitio web seguramente te pareció increíble. Se lo mostraste a tus amigos y familiares, y todos te dijeron lo que querías oír. Pero los amigos y la familia rara vez dicen la verdad. No quieren herir tus sentimientos.
Si le preguntas a un experto en comercio electrónico qué le parece la tienda, descubrirás lo que la gente realmente piensa sobre tu primer sitio web. Te dirán “éste es uno de los peores diseños de tiendas que he visto en mi vida».
Eso duele.
Pero sin esa retroalimentación dolorosamente honesta, nunca alcanzarás todo tu potencial como dueño de una tienda.
Sobre todo porque será difícil conseguir ventas si el diseño de tu tienda es anticuado, poco profesional y no cumple con los estándares actuales de diseño de sitios web de comercio electrónico.
Justamente es por esa razón que en este artículo se mencionan los trucos más fáciles de diseño de tiendas que puedes implementar hoy para aumentar las ventas.
1. Mejore el diseño de su tienda con las fotos adecuadas
Las fotos en tu sitio web harán o romperán el diseño de tu tienda. Si eliges las fotos equivocadas, puedes dañar tus conversiones. La tienda Pretty Little Thing tiene imágenes cautivadoras en su tienda online. Sus imágenes de estilo de vida son divertidas, juguetonas y vibrantes que, cuando se combinan, muestran un estilo único de marca visual. Incluso las fotos de sus productos coinciden con el mismo estilo que las imágenes del banner de su página de inicio.
Si estás recién comenzando a operar tu tienda, aquí se entregan algunos consejos prácticos relativos al diseño / uso de imágenes que te servirán como referencia para mejorar el aspecto de tu tienda:
o Elimina logotipos de las imágenes de su producto usando el editor de imágenes deShopify. Asimismo, evita agregar el logotipo de tu marca en tus propias imágenes.
o Asegúrate de que los banner son imágenes de estilo de vida en vez de modelos con fondos blancos.
o Elije fotos de calidad en los sitios web de imágenes profesionales y gratuitas. Las puedes encontrar en los sitios Burst, Unsplash y Pexels. La fotografía de Burst se especializa en eCommerce, así es que usted encontrará imágenes para una amplia gama de nichos.
o Elimina todas las imágenes pixeladas de tu sitio web. Si la imagen parece granulada,puede drásticamente derribar el profesionalismo de tu sitio web. Es mejor encontrar otra imagen en su lugar. Ten en cuenta esto también para las fotos de tus productos.
o Asegúrate que todas las imágenes tengan el mismo tamaño. Sabrás si son del mismo tamaño si observas tus colecciones de productos y ninguna de las imágenes se vea más larga o ancha que otra. Deberían ser todas imágenes cuadradas.
o Evita tener grandes imágenes en tu sitio web. Algunos temas harán que la foto de tu producto ocupe la mitad de la pantalla. El problema es que la imagen tarda mucho tiempo en cargarse. Aunque las imágenes deben ser ampliables, no es deseable tener archivos pesados en tu sitio web, ya que reducirá la velocidad de tu página, y como consecuencia, las conversiones. Utiliza una herramienta de compresión de imágenes para reducir el tamaño del archivo de imagen si observas que las fotografías tardan unos segundos en cargarse.
2. Cómo seleccionar los colores de diseño de la tienda
Uno de los desafíos más grandes que enfrentan los nuevos dueños de tienda al momento de diseñar su sitio web, se refiere a los colores con los que aparecerá su tienda. Cuando se trata de principios de diseño, el consenso general es limitar su diseño a sólo tres colores o menos. La marca azul de Best Buy’s es consistente entre sus volantes de marketing, su sitio web e incluso en la tienda. En su tienda en línea, utilizan un tono de azul oscuro para su fondo temático. Generalmente mantienen su diseño limitado a unos pocos colores. Su logotipo incluye una etiqueta amarilla con una fuente negra y está siempre sobre un fondo azul. Su tienda en línea utiliza una combinación de azul, blanco y gris en su mayoría. Cuando utilizan otros colores, es para agregar énfasis o para permitir una fácil legibilidad.
Aquí se mencionan algunas recomendaciones generales para la selección de color para el diseño del sitio web de eCommerce:
o Busca la psicología básica del color al elegir colores para tu logotipo, tema de la tienda y marca. Cada color evocará emociones diferentes. La combinación decolores también puede convertirse en marca registrada para tu marca. Una regla general que se sugiere es ser consistente dentro del esquema de colores de tu industria. Por ejemplo, la industria de la salud suele utilizar el azul. Las tiendas de fitness suelen utilizar el rojo. Las marcas de alta gama suelen utilizar el color negro.
o Evita los colores distractores. Un problema en un montón de nuevas tiendas en línea es que a veces los colores son tan vibrantes que molestan a la vista. Por ejemplo,una tienda de belleza con un fondo rosa cálido.
A veces, cuando construimos una tienda, elegimos colores que nos gustan en vez decolores que tienen sentido para el nicho. También necesitas hacer una encuesta a tu audiencia para saber lo que piensan de tu combinación de colores.
o Obtén retroalimentación. Los colores incorrectos son un problema común para muchos nuevos empresarios. Asegúrate de comunicarte con el soporte de la plataforma en la cual se desarrolla tu tienda para obtener comentarios sobre la apariencia de ésta.
3. Elija un esquema intuitivo para el diseño de su sitio web
Un esquema intuitivo de un sitio web es uno que sea fácil de navegar, porque el diseño dela tienda sigue prácticas comunes. Algunos dicen que es mejor ser diferente. Sin embargo,es mejor hacer lo que todos los demás están haciendo.
La realidad es que potencialmente estarás vendiendo a audiencias de todo el mundo. Algunas de esas personas no hablan o no entienden el idioma de tu tienda. Al tener un esquema intuitivo, podrán navegar fácilmente por tu sitio web a pesar de la barrera del idioma. Si eliges un esquema que es diferente, una persona puede tener dificultades para encontrar el botón «Añadir al carro» o un “Formulario de contacto”. En síntesis, un esquema adecuado puede ayudarte a aumentar las conversiones de tu tienda.
Al respecto, para los nuevos empresarios es recomendable buscar esquemas en la plataforma Minimal. En general, evita los esquemas donde la navegación se encuentra en el lado izquierdo, ya que es menos intuitiva que la navegación superior. También se recomienda alejarse de los esquemas donde la navegación comienza en la parte inferior y se mueve hacia arriba a medida que se desplaza. Los esquemas de Minimal ofrecen una navegación superior que es estándar en el diseño de eCommerce. Tiene una imagen de banner en la página principal que a menudo se encuentra en muchas tiendas en línea. Elbotón «Añadir al carro» se encuentra por sobre la carpeta, lo que significa que no necesita desplazarse para encontrarlo. En general, es una buena plantilla gratuita para los emprendedores novatos.
4. Mira la impresión general del diseño de tu tienda online
Cuando estabas en la escuela, probablemente revisabas sus tareas antes de entregarlas. Tu tienda en línea es mucho más pública que esa asignación de la escuela y aun así se examina mucho menos.
Cada vez que uno revisa tiendas de eCommerce, es relativamente fácil observar quién ha revisado realmente sus tiendas en línea. Aquí se presentan algunos de los errores más frecuentes de diseño de tiendas en línea y que tienen un impacto negativo en las conversiones:
o El texto de marca-páginas es un texto escrito en latín que los desarrolladores web ponen en una plantilla de sitio web. Este es el texto que usted debe rellenar con su propia copia. Sin embargo, a menudo es posible encontrarse con sitios que no cambiar el texto de ejemplo. Los clientes ven esto y de inmediato saben que su sitio web no está completo ni actualizado. Inmediatamente genera desconfianza quepuede evitar que las ventas ocurran.
o ¡No tengas una página vacía! No tienes idea de cuántas veces se ve esto en sitiosweb nuevos. Es posible que tus clientes lleguen a la página de un producto, pero con frecuencia explorarán los productos antes de hacerlo. Si ves una página de inicio sin imagen de banner, texto de marcador de posición y un diseño de eCommerceincompleto, se van a ir a la siguiente tienda en línea, en vez de continuar explorando en la tuya.
Asegúrese de tener todas las páginas necesarias en tu tienda. Una página Sobre Nosotros permite a los clientes saber quién es usted como marca y qué representa. Una página de Reembolso permite a los clientes saber que pueden recibir reembolsos si no están satisfechos con su pedido. También necesita una página de Contacto para que si los clientes tienen alguna consulta, sepan cómo contactarse con usted. Si usted vende ropa, también necesita asegurarse de que hay Tablas de Tallas para que la gente pueda comprar el producto del tamaño correcto.
5. ¿Hay errores tipográficos en tu tienda en línea?
Podrías tener el sitio web más bonito del mundo. Las combinaciones de colores pueden ser puntuales y cautivadoras. Pero si tiene errores tipográficos, toda esa belleza de diseño de tienda se pierde. Los ojos del cliente se centran en el error tipográfico, haciendo que ese sea el foco y no su producto. Su producto se vuelve esencialmente invisible para ellos.
Puedes usar herramientas como corrector ortográfico Plus para ejecutar tu copia antes de agregarla al sitio web. Si escribes tu contenido en Google Docs primero, puedes hacer clic en Herramientas > Deletrear donde resaltará sus errores.
6. Elige las fuentes adecuadas para tu diseño de tienda
La mejor fuente mejorará la apariencia de tu tienda de eCommerce. Galu Toa es un ejemplo de una tienda en línea que utiliza el énfasis tipográfico como negrita cuidadosamente. Las opciones de fuentes, colores y énfasis se hacen correctamente desde la perspectiva del diseño.
Muchos empresarios novatos usan una fuente gris claro en negrita para el texto que no necesita ser acentuado, lo que no hace un impacto positivo en el diseño general.
He aquí algunos consejos de fuentes para tu tienda:
o Docetica y Arial son las fuentes que más utilizan los principales minoristas en línea.Son las fuentes más comunes, haciéndolas más familiares para el consumidor medio. Cíñase a esas fuentes cuando tenga dudas. Evite fuentes anchas.
o Evitar fuentes coloreadas. En promedio, el negro sobre un fondo blanco es la fuente más fácil de leer. A muchos minoristas les gusta usar un gris claro, sin embargo, es realmente difícil de leer, especialmente para los consumidores mayores.
Mientras que los principios de diseño por lo general dicen que se puede agregar tres colores, cuando se trata de énfasis, lo recomendable es quedarse con uno. Evite poner en negrita y subrayando el texto que desea resaltar. Puede resultar un monstruo. Si hay texto importante que desea enfatizar, es posible ponerlo en negrita. En general, los titulares deben estar en negrita.
7. Actualiza regularmente el diseño de tu tienda
Cada mercado tiene fechas emblemáticas, tales como Navidad, Pascuas, Día de los Enamorados, Cyberdays, etc. Asegúrate de actualizar tu banner con imágenes características de esos días y así sacar provecho de esas fechas. Al actualizar tu banner permanentemente, muestras a los clientes que actualizas constantemente tu sitio web.
Deberías estar agregando nuevos productos a tu tienda en línea en forma periódica. Elimina productos que no funcionan también puede ayudarte. Esto muestra a Google que estás constantemente actualizando tu sitio web, lo que te permite escalar en las búsquedas, lo que eventualmente ayudará a aumentar las conversiones.
Si inicias un blog en tu tienda, necesitas actualizarlo al menos una vez por semana. De lo contrario, muestras a los clientes que tu tienda en línea no está activa.
Cuanto más cambie el aspecto de tu sitio web, más gente lo visitará. Demuestra que tu marca es legítima y activa, ya que los principales minoristas actualizan constantemente el aspecto de sus tiendas online.
8. Deshazte de los pop-ups para mejorar tu diseño de tienda
Cuando se trata de pop-ups, si vas a tenerlos, utiliza uno solo. Será más efectivo para impulsar las conversiones que tener múltiples. Ten en cuenta que las ventanas emergentes generalmente se están volviendo ineficaces.
Por ejemplo, las ventanas emergentes suelen recopilar correos electrónicos. Sin embargo,con un anuncio de retargeting, puedes mantener y fidelizar a los usuarios incluso, sin su correo electrónico.
Eso no quiere decir que no debas recopilar correos electrónicos o utilizar una ventana emergente. Pero deberías probarlo cuidadosamente. ¿Su notificación realmente ayuda a aumentar las conversiones? Si lo quitas ¿se detienen las ventas? Si coleccionas correos electrónicos, ¿se convierten esos correos electrónicos? Si es así, ¿se convierten mejor que un anuncio de retargeting del mismo valor que el correo electrónico?
Los pop-ups pueden ser una pesadilla de diseño desde la perspectiva de la experiencia del usuario. Y mientras que en el escritorio puedes impulsar las conversiones, en el móvil pueden estar previniéndolas.
9. Apague el audio para sus vídeos
Los videos pueden ser excelentes para impulsar las conversiones. Sin embargo, la reproducción automática de vídeos, especialmente aquellos con sonido, arruina completamente la experiencia del usuario. Son molestos, indeseables y forzados. Nadie quiere verse obligado a ver un video mientras navega por un sitio web. Quieren poder navegar en sus propios términos.
Añadir música a su sitio web puede ser pegajoso, así que no haga eso tampoco.
10. Tener categorías de productos específicas
Un gran problema que se observa entre las nuevas tiendas es la falta de categorías de productos. A menudo, los dueños de tiendas agruparán todo en categorías muy amplias como’ Mujer’ y’ Hombre’. Cuando navegas por las tiendas en línea, ¿sueles ver todos los artículos agrupados en una sola categoría? Probablemente no.
Cuando se trata de diseño de eCommerce, la mayoría de los minoristas exitosos profundizan en categorías de productos específicos. Lulu’s, por ejemplo, tiene una categoría de vestidos con 48 subcategorías de ropa. De esta manera, los clientes pueden navegar fácilmente por su tienda online para encontrar el producto que desean.
En este caso, el diseño no se trata de gráficos o imágenes, sino del flujo de su sitio web.Usted necesita ser capaz de diseñar sus categorías de productos en función de cómo la gente los busca. Por ejemplo, una persona puede buscar en función de la tela, el color o el corte, cuando se trata de la moda. Cuando se trata de su tienda, necesitas ser lo más detallado posible para que la navegación de tu tienda en línea sea sin esfuerzo. Los clientes deberían poder encontrar lo que buscan.
11. Diseños de tiendas minimalistas para la victoria
Mike Falkow, Director Creativo de Meritus Media, menciona: «A lo largo de los años ha habido un movimiento hacia un diseño simple, casi minimalista. Esto continuará. La razón por la que esto funciona tan bien en el diseño es que mantiene el sitio con una apariencia profesional y atemporal. También permite a los visuales destacar y captar la atención del visitante”.
12. Incorpore su propuesta de valor único en su diseño de eCommerce
Joe Goldstein, fundador de Contractor Calls, afirma: «Si usted está buscando llevar su sitio web al siguiente nivel, considere lo que hace que su marca sea más que una mercancía, y recuerde que hay mucho más que diseñar que la estética. Si usted es una tienda de comercio electrónico que trata a Amazon como un competidor indirecto, concéntrese en su propuesta de valor único y plásmelo en su diseño. Si usted ofrece un mejor soporte de producto, refleje eso con preguntas frecuentes prominentes, llamadas y un sistema de chat bien integrado. Y si usted tiene una visión única de las necesidades y gustos únicos de sumercado objetivo, asegúrese de que su diseño refleje esa estética».
13. Mantenga su diseño de escaparate sencillo con espacios en blanco
Damon Burton, Presidente de SEO Nacional, sugiere: «si usted está lanzando un sitio web,usted querrá asegurarse de que será útil, comprensible, discreto y estéticamente agradable. Un estilo que gana tracción en el diseño web es el minimalismo, que abarca el uso de espacio negativo para enfatizar la efectividad del diseño. La simplificación de los diseños y la eliminación de componentes innecesarios asegurarán que los usuarios permanezcan comprometidos y libres de distracciones. Sólo ten cuidado de no querer simplificar tan toque deseche las características necesarias».
14. Diseño de la primera tienda móvil
Mali Phonpadith, CEO de SOAR Community Network, aporta diciendo: «hay varias cosas críticas a tener en cuenta si estás planeando diseñar o rediseñar tu sitio web, incluyen primero diseñar para móviles, incorporar imágenes audaces y contenido atractivo (incluyendo animaciones y/o videos será esencial para el compromiso) y revisar tus tiempos de carga. Si no estás considerando cómo es la experiencia de un usuario al visitar tu sitioweb, especialmente en sus dispositivos móviles, perderás clientes y fans/prospectoscomprometidos».
15. Incluir contenido emocional
Anastasia Vasilieva, diseñadora web de Wave, dice: «concéntrate en tu contenido para hacerlo más humano y emocional. Siéntase libre de experimentar con fotos e ilustraciones personalizadas para hacer su sitio web más personal y amigable. Es genial incluir videos y animaciones: muestra tu producto en acción y cuenta tus historias para entretener a los usuarios. En segundo lugar, pulir su imagen visual global. Podemos ver cómo el diseño plano cambió a un mayor uso de sombras y degradados, que están llenos de color y energía. Las sombras volvieron actualizadas para ser más suaves y minimalistas. Los degradados brillantes funcionan muy bien como fondos independientes, así como filtros fotográficos de buena marca para tus imágenes».