Product Detail Page

La galería de imágenes es lo primero que la mayoría de usuarios explora al aterrizar en un PDP; fallar aquí destruye la confianza antes de que lean el precio. El zoom debe entregar una versión de mayor resolución en el momento de activarse, no escalar la imagen ya mostrada, escalar al 200% una imagen de display produce pixelado y comunica descuido. En móvil, pinch-to-zoom y double-tap son patrones esperados, y deben solicitar la imagen de alta resolución bajo demanda. Baymard documenta que un porcentaje significativo de sitios no entrega resolución o zoom suficiente, una falla básica que erosiona la percepción de calidad del producto.

Cada imagen de la galería debe responder una pregunta de compra específica, en orden de relevancia: plano limpio sobre fondo neutro → escala (objeto de referencia o modelo) → detalle de acabados → contexto de uso (lifestyle) → empaque. Un set mínimo de cinco imágenes cubre la mayoría de dudas para la mayoría de productos; moda o productos técnicos pueden requerir hasta quince. El antipatrón clásico es seis fotos del mismo ángulo con distinto fondo: no aportan información nueva y dejan sin resolver la pregunta más costosa, la de dimensiones. Baymard documenta que muchos usuarios que intentan evaluar el tamaño de un producto abandonan el ítem cuando no hay imágenes a escala.

El área visible sin scroll debe contener, sin excepción: nombre del producto, precio completo, selector de variantes, estado de disponibilidad y el botón de agregar al carrito. Estos cinco elementos forman el núcleo de decisión; si alguno cae below the fold, el usuario debe hacer una acción extra antes de poder comprar, lo que incrementa el abandono. Cualquier información adicional, descripción larga, reseñas, envío, va después. El antipatrón típico es enterrar el precio al final de una descripción de marketing y revelar el CTA solo tras varios cientos de píxeles de scroll, obligando al usuario a "buscar" cómo comprar.

Los selectores tipo botón o swatch exponen todas las opciones de inmediato, reduciendo el esfuerzo cognitivo frente a un dropdown que exige interacción para revelar las opciones. Las variantes agotadas deben permanecer visibles, tachadas o atenuadas, para que el usuario comprenda el rango completo del producto, no se confunda como cliente que regresa, y pueda activar una alerta de reposición. Ocultar las agotadas crea la ilusión de que el producto tiene menos opciones de las reales. Baymard documenta que muchos sitios siguen sin cumplir esta pauta en la selección de talla, usando dropdowns en lugar de botones con visibilidad de inventario.

La descripción narrativa (beneficios, uso, marca) y las especificaciones técnicas (materiales, dimensiones, peso, compatibilidad) responden preguntas distintas para audiencias distintas; mezclarlas en un bloque de texto aumenta la carga cognitiva y penaliza a quien solo busca un dato. La solución recomendada: dos a cuatro bullets de beneficios clave visibles, seguidos de un acordeón o tabs para "Especificaciones", "Cuidados" y "Preguntas frecuentes". El acordeón es preferible cuando hay tres o más secciones colapsables. El antipatrón es un párrafo de doscientas palabras que entremezcla marketing, materiales, instrucciones de lavado y compatibilidad: el usuario que solo quiere saber el peso debe leerlo todo.

Las reseñas son el segundo factor de decisión más consultado tras las imágenes. El anchor de la calificación promedio debe ir inmediatamente debajo del nombre del producto, no al pie de página, para ser visible desde el primer momento; las fotos enviadas por usuarios generan más confianza que las reseñas solo-texto, y el conjunto debe poder filtrarse por estrellas y mostrar la fecha de cada reseña para juzgar su vigencia. La investigación de Spiegel (Northwestern) cuantifica el efecto: mostrar cinco o más reseñas eleva la probabilidad de compra un 270% frente a un producto sin reseñas. El antipatrón es esconder la calificación al final, sin fotos, sin fecha y sin filtros.

El costo y tiempo de envío están entre los factores de abandono de carrito más frecuentes, precisamente porque muchos sitios los revelan recién en checkout. Mostrar esta información en el PDP, idealmente con estimación por código postal, elimina la sorpresa y aumenta la confianza. La política de devoluciones debe ser accesible desde el PDP (un link o acordeón "Devoluciones y cambios"), no esconderse tras el menú de ayuda. Baymard documenta que una proporción importante de usuarios espera ver la información de devoluciones en la página de producto y que muchos sitios no la enlazan ahí, dejando la duda sin resolver justo en el momento de decidir.

En móvil el botón "Agregar al carrito" sale del viewport en pocos segundos de scroll típico. Una barra sticky al fondo de la pantalla, que aparece al cruzar el fold original, elimina la fricción de volver arriba y mantiene viva la intención de compra durante toda la lectura de descripción y reseñas. La barra debe incluir lo mínimo para identificar el producto, thumb, nombre abreviado, precio, más el CTA, sin saturarse de contenido secundario. El antipatrón es fijar el CTA desde el primer píxel de carga, tapando contenido desde el inicio y sin contexto del producto: roba espacio cuando todavía no aporta valor.