Blog de personalización de comercio electrónico

Publicado: 2022-04-19

Un gran diseño de página de producto crea excelentes experiencias para los clientes. Sin embargo, hay dos desafíos importantes que enfrentan las páginas de productos.


En primer lugar, hay muchos tipos de compradores que interactúan con las páginas de productos, desde los que exploran hasta los que están listos para comprar ahora. Y segundo, los productos son diversos. Cada uno tiene su propio conjunto de atributos, lo que hace que sea poco probable que el diseño de una página de producto se ajuste perfectamente a cada producto.


Esta publicación explora las mejores prácticas de diseño de productos para crear experiencias increíbles para los clientes. Analizamos cómo utilizar el diseño para brindar opciones a los clientes en tres áreas importantes: imágenes de la página del producto, el "área de compra" y ventas cruzadas.

Navegacion rapida
Prácticas recomendadas para el diseño de la página del producto: orientación en la mitad superior de la página
Prácticas recomendadas de diseño de imagen de página de producto de comercio electrónico
Diseño de imagen de producto 1: Zoom con puntero
Diseño de imagen de producto 4: cambie dinámicamente las imágenes en función del color seleccionado
Diseño de imagen de producto 3: Incorporación de imágenes de redes sociales
Diseño de imagen de producto 4: proporcionar imágenes a escala
Diseño de imagen de producto 5: hacer que las imágenes adicionales en la galería de imágenes sean obvias
Página del producto Prácticas recomendadas Área de compra: cómo manejar varios grupos de clientes de la manera correcta
Práctica recomendada de diseño de área de compra 1: Proporcione envío gratuito
Comprar práctica recomendada de diseño de área 2: enlaces rápidos para obtener más información
Práctica recomendada de diseño de área de compra 3: botones de llamada a la acción para guardar el artículo
Práctica recomendada de diseño de áreas de compra 4: parte de un look
Práctica recomendada de diseño de área de compra 5: Selección fácil de atributos
Página de producto Mejores prácticas de ventas cruzadas: cómo aumentar las ganancias
Práctica recomendada de diseño de venta cruzada 1: creación de looks
Práctica recomendada de diseño de venta cruzada 2: cambiar dinámicamente las imágenes de los productos en la apariencia
Práctica recomendada de diseño de venta cruzada 3: recomendaciones personalizadas de productos
Mejor práctica de diseño de venta cruzada 4: Fácil navegación a elementos vistos recientemente
Próximos pasos

Prácticas recomendadas para el diseño de la página del producto: orientación en la mitad superior de la página

El diseño de la página del producto es un desafío por varias razones. Primero, la página tiene mucho en juego. Cada cliente pasa por la página de su producto. En segundo lugar, no todos los que ven la página de su producto se encuentran en la misma etapa del recorrido del comprador.

Algunos visitan las páginas de productos en busca del ajuste adecuado. Otros están investigando. Y aún otros vienen con la plena intención de comprar el producto exacto que están buscando.


En tercer lugar, las tiendas de comercio electrónico suelen ofrecer muchos tipos de productos. Sin embargo, a pesar de tener productos con atributos variados, muchas tiendas de comercio electrónico usan una sola plantilla de página de producto.


En otras palabras, las tiendas de comercio electrónico se encuentran tratando de optimizar para muchos tipos de productos y clientes con un solo diseño.


Estas diferentes necesidades imponen demandas insensatas en una página de producto, y la mayoría falla al hacerlo bien. Para ayudar, desglosamos cómo Target trata su página de producto.

Prácticas recomendadas de diseño de imagen de página de producto de comercio electrónico

Las imágenes siguen siendo uno de los elementos más cruciales en el diseño de una página de producto. Algunas mejores prácticas para las imágenes de la página del producto son

  • Habilite el zoom : permita que los clientes vean fácilmente detalles de cerca de sus productos
  • Imágenes de tamaño relativo : da una sensación de tamaño relativo colocando el artículo junto a un objeto común o usado por un modelo.
  • Diversidad de imágenes: incluya imágenes desde diferentes ángulos para brindar una vista completa del producto.
  • Incorpore pruebas sociales: debido a que las imágenes suelen ser el primer elemento que se ve en la página, debe tratar de incorporar pruebas sociales en algunas de sus imágenes.
  • Carruseles transparentes: es fácil pasar por alto los carruseles. Los excelentes diseños de páginas de productos hacen evidente que hay más imágenes para explorar.
  • Detalle las variaciones del producto : ayude a los clientes a comprender las diferentes versiones del producto, como colores, tamaños o complementos.

A continuación, mostramos cómo Target optimiza las imágenes de la página de su producto.

Práctica recomendada 1 para el diseño de imágenes de productos: hacer zoom con el puntero

Los detalles importan. Para ayudar a los clientes a ver y comprender sus productos, Target habilita una función de zoom intuitiva y fácil de usar en todas las imágenes de sus productos.

Simplemente desplace el cursor sobre la imagen y se cambiará de tamaño, lo que le permitirá inspeccionar cualquier parte de la imagen que desee.

Diseño de imagen de producto 2: cambie dinámicamente las imágenes en función del color seleccionado

Muchos productos tienen variaciones.

Debe cambiar las imágenes destacadas para que coincidan con los atributos del producto seleccionado.


En este caso, el producto es un vestido camiseta de manga corta. El vestido está disponible en 9 colores diferentes.

Target hace un excelente trabajo cambiando dinámicamente las imágenes destacadas para que coincidan con el color seleccionado.


Los clientes ahora pueden inspeccionar el color exacto que les interesa.

Diseño de imagen de producto 3: Incorporación de imágenes de redes sociales

Me encanta cómo Target incorpora contenido generado por el usuario en los diseños de las páginas de sus productos.

En este caso, después de las tres tomas de imagen de modelo, comienzan a mostrar imágenes de clientes habituales con el vestido puesto.


¿Cómo selecciona Target estas publicaciones? Una forma es a través de su canal de Instagram. Han creado un hashtag #targetstyle para brindarles a los clientes una manera fácil de interactuar con la marca.

Luego, pueden buscar rápidamente imágenes cargadas que se ajusten a sus criterios para una imagen de página de producto. Luego, envían un simple comentario al perfil solicitando permiso para usar la imagen en su sitio.

Una vez más, hacen uso de un hashtag para que sea sencillo para su equipo. A continuación se muestra un intercambio de ejemplo.

Y el equipo no se detiene en una sola publicación generada por el usuario.


Múltiples imágenes generadas por el usuario hacen que los clientes se sientan seguros al comprar el artículo.

Diseño de imagen de producto 4: proporcionar imágenes a escala

Las imágenes destacadas de Target incorporan un modelo para permitir que los visitantes vean cómo les queda el vestido. Cosas como lo ajustado que es, lo corto que es el vestido en longitud y manga, y el escote son difíciles de describir con palabras.


Aún mejor, los visitantes pueden ver cómo le queda el vestido a las personas que no son modelos a través de las imágenes generadas por el usuario.

Diseño de imagen de producto 5: hacer que las imágenes adicionales en la galería de imágenes sean obvias

Target no sobrecarga el carrusel de imágenes. En su lugar, hacen evidente que hay más imágenes presentes al colocar una superposición oscura y mensajes que permiten a los visitantes del sitio saber cuántas imágenes hay disponibles.


Esta es la única superposición oscura en toda la página del producto.

Página del producto Prácticas recomendadas Área de compra: cómo manejar varios grupos de clientes de la manera correcta

El "área de compra" describe los widgets donde los clientes pueden comprar el artículo.

Tradicionalmente, en las computadoras de escritorio, esto está arriba del pliegue en el lado derecho. Las mejores prácticas para las áreas de compra de la página del producto incluyen

  • Proporcione reseñas de clientes : las reseñas son una forma poderosa de prueba social. Las revisiones deben resumirse de una manera fácil de entender. Los clientes deben poder inspeccionar las reseñas en detalle.
  • Cree enlaces cortos para obtener más información : brinde a los clientes una manera fácil de obtener más información, ya sea a través de reseñas o preguntas frecuentes específicas.
  • Seleccione fácilmente los atributos del producto : haga que seleccionar el tipo de producto que desean comprar sea fácil.
  • Proporcione información de envío: los costos de envío son la razón principal por la cual se abandona el carrito de compras . Mostrar los costos de envío por adelantado y, mejor aún, brindar formas claras de lograr el envío gratuito, elimina esta razón para el abandono del carrito.
  • Ofrezca más de un método de envío : opciones de velocidad, como la entrega al día siguiente y la ubicación (como las estrategias de hacer clic y recolectar ).

Target hace un excelente trabajo al abordar múltiples tipos de compradores a la vez.

Práctica recomendada de diseño de área de compra 1: Proporcione envío gratuito

Los costos de envío inesperados son la razón principal del abandono del carrito .


Target incorpora el beneficio de envío gratis en su estrategia de precios de valor. Saben que los clientes valoran el envío gratuito, por lo que lo utilizan como un incentivo para que los clientes aumenten el valor promedio de los pedidos de comercio electrónico .

Comprar práctica recomendada de diseño de área 2: enlaces rápidos para obtener más información

No todos los visitantes de la página del producto están listos para comprar.


Target hace un gran trabajo proporcionando enlaces rápidos para saltar a otras partes de la página. En la parte superior dan dos opciones.


La primera es ver reseñas en detalle.


El segundo salta a una sección de preguntas y respuestas. Una táctica interesante que utilizan es organizar las preguntas frecuentes por popularidad. Los que se preguntan con mayor frecuencia se colocan en la parte superior.

Me gusta especialmente que Target permita a los clientes responder y proporcionar comentarios sobre los artículos. Insertan dinámicamente una etiqueta "Miembro del equipo de destino" cuando ellos mismos aclaran las preguntas frecuentes.

Práctica recomendada de diseño de área de compra 3: botones de llamada a la acción para guardar el artículo

Otros clientes buscan comprar más tarde. Hemos visto que el comportamiento de compra en línea incorpora cada vez más investigación, sobre todo en la investigación emergente en línea, el comportamiento de compra fuera de línea .


Aquí, Target ofrece a los clientes una manera fácil de guardar el producto en una lista personal o registrarlo como regalo.

Práctica recomendada de diseño de áreas de compra 4: parte de un look

Target curates busca sus productos.


Las apariencias son en parte educación y en parte ventas adicionales. Educan a los clientes sobre cómo juntar varios artículos para crear un conjunto completo. En el proceso, crean ventas cruzadas implícitas.


Exploramos los looks con más detalle aquí .

Práctica recomendada de diseño de área de compra 5: Selección fácil de atributos

Por último, Target hace un trabajo increíble al exponer las diversas opciones de una manera fácil e intuitiva.

La clave es exponer visualmente los atributos del producto en lugar de ocultarlos en los menús desplegables. Los visitantes pueden ver fácilmente varias opciones de color y seleccionar rápidamente su color y tamaño preferidos es muy sencillo.

Página de producto Mejores prácticas de ventas cruzadas: cómo aumentar las ganancias

Finalmente, quiero explorar las mejores prácticas de venta cruzada de la página del producto.


La tecnología de personalización ha abierto numerosas formas de hacer recomendaciones poderosas y relevantes. Aquí hay una breve lista de las mejores prácticas de diseño de páginas de productos que puede implementar para aumentar las ganancias.

  • Utilice recomendaciones de productos personalizadas   - La técnica de venta cruzada más eficaz sigue siendo la recomendación personalizada de productos.
  • Cree y aproveche los segmentos de clientes basados ​​en el comportamiento : las recomendaciones y ofertas deben basarse en el comportamiento del cliente, como compras anteriores y productos vistos durante la sesión.
  • Múltiples tipos de widgets de recomendación de productos : no se limite a uno solo   tipos de widgets de recomendación . Utilice varios widgets.

Práctica recomendada de diseño de venta cruzada 1: creación de looks

Como se mencionó, las apariencias hacen más que educar a los clientes. Proporcionan una forma natural de ofrecer productos complementarios. Aquí, Target ofrece una variedad de looks para el producto.


Cuando hace clic en uno de los looks, aparece un widget de elemento simple. Puede navegar fácilmente a cualquiera de los productos complementarios, guardarlos o ver más detalles.

Práctica recomendada de diseño de venta cruzada 2: cambiar dinámicamente las imágenes de los productos en la apariencia

Cuando ofrece varios atributos del producto, es importante que personalice las ventas cruzadas que realiza.


La personalización dinámica de los looks es un uso fantástico del contenido dinámico.


Aquí, Target actualiza dinámicamente el widget de apariencia para que coincida con los atributos del producto seleccionado. Tanto las imágenes en sí como los accesorios a juego se modifican en tiempo real.

Práctica recomendada de diseño de venta cruzada 3: recomendaciones personalizadas de productos

El widget de recomendación de productos de Target es flexible. Ofrece una barra de navegación simple para permitir a los clientes filtrar los productos recomendados. En este caso, el producto que estamos viendo se ajusta tanto a un escote redondo como a un largo mini.


Target nos da la opción de filtrar en función de cualquiera.

Cambiar al tipo de longitud mini actualiza dinámicamente los productos sugeridos.

Asimismo, al seleccionar "mostrar más" se ampliará el número de elementos sugeridos. Esta funcionalidad es perfecta para los compradores que buscan agregar a su carrito o navegar. En lugar de tener que navegar de regreso a la categoría de la que provienen, pueden ver qué artículos quieren en la página.

Mejor práctica de diseño de venta cruzada 4: Fácil navegación a elementos vistos recientemente

Por último, Target facilita que los compradores encuentren productos anteriores. Su segundo widget de recomendación de productos son artículos vistos recientemente.


A medida que los compradores revisan el catálogo de productos, este es un historial continuo en la sesión de los productos en los que han expresado interés.

Próximos pasos

El diseño de la página del producto es crucial para convertir a los visitantes en clientes.


Para satisfacer los requisitos de múltiples tipos de clientes y presentar correctamente las ofertas correctas, debe considerar asociarse con un proveedor de personalización .

Barilliance potencia cientos de páginas de productos de tiendas de comercio electrónico con contenido personalizado.   Haga clic aquí para ver si Barilliance es una buena opción para su tienda.