Banner Pixelado

¡Hola! Estoy configurando mi tienda y al incluir el banner, la calidad de los banners es horrible, se ve pixelado y con poca definición.

-Estoy diseñando esto en photoshop, en un documento de 1200 x 475 px y una resolución de 300. (he probado con resoluciones sugeridas en otros post pero la imagen se mantiene pixelada al momento de publicarla)

-El tema que estoy utilizando es Refresh.

Hola, @Cristobal2 :

Gracias por escribirnos. Entiendo que estás usando el tema Refresh en tu tienda. Con todo, cuando configuras una imagen de banner con diferentes tamaños aparece pixelada, ¿cierto? Será un placer ayudar.

Para agilizar los tiempos de carga, Shopify comprime automáticamente las imágenes de las tiendas online. Comprimir una imagen significa reducir su tamaño de archivo para que las páginas carguen más rápido. En este caso, puedes comprobar si la imagen se ve correctamente al subirla al panel de control de tu tienda y el problema radica únicamente en la configuración propia del tema Refresh que estás utilizando.

Dime, si subes la imagen de banner a través de la sección Contenido > Archivos en el panel de control de tu tienda, ¿podrías confirmarme si dicha imagen se ve borrosa dentro de esta sección? En caso de que no sea así; si configuras la imagen que has subido a esta sección directamente a la sección del banner de tu tienda a través de Tienda online > Temas > Personalizar, ¿sigue apareciendo con un aspecto borroso?

Si, en efecto, el problema sigue presente; otra cuestión que puede estar afectando a la visualización de las imágenes es que estas sean demasiado pequeñas. Para facilitar las cosas, te dejo una guía de tamaños recomendados de imágenes para el tema Refresh de Shopify. Este artículo pertenece a la plataforma de TinyIMG que son expertos en el ámbito de optimización de imágenes y SEO para las tiendas que se han creado a través de la plataforma de Shopify. Con todo, te dejo también estos tamaños a continuación:

  • Imágenes de productos: 1000 x 1000 px - 1:1
  • Imágenes de colección: 750 x 750 px - 1:1
  • Imágenes de diapositivas: 2048 x 1024 px - 2:1
  • Imágenes de blog: 2048 x 867 px - 16:9

En este caso, ¿has probado el tamaño de imagen de diapositiva con aspecto 2:1? Si esto no soluciona la cuestión del banner borroso, ¿podrías confirmarme si has instalado algún tipo de app o has hecho cambios de código desde que sucede esto? Si instalas una nueva versión del tema Refresh, ¿el error persiste?

Mientras revisas esto, me pregunto cómo está siendo tu experiencia con Shopify hasta el momento. Dime, ¿qué tipo de tienda has creado con nuestra plataforma? ¿Qué productos o servicios ofreces a los clientes? ¿Qué objetivos a corto y largo plazo te gustaría conseguir con Shopify y con tu tienda?

1 Like

El problema se vio solucionado luego de subir las imágenes desde el panel de contenido. Gracias

1 Like

hola, ya hice de todo, tiene los aspectos recomendados, subí imagen desde el editor de personalizar tienda, desde el panel de contenido, nada sirve, cuando inspecciono la imagen, queda con width de 375, cuando en realidad es de 750, se comprime demasiado, no sé si es el tema. “Dawn”

Hola, @IsabelBrand :

Gracias por la respuesta. Entiendo que estás configurando un banner con el tema Dawn de Shopify. Sin embargo, cuando Shopify realiza la compresión de la imagen, esta queda con tamaño muy pequeño que hace que no se visualice correctamente en la página web, ¿cierto? Será un placer ayudar.

Antes de nada, las recomendaciones de imágenes varían en función del tema que estés usando y la sección que estés configurando. En el caso de la imagen de banner del tema Dawn de Shopify, el tamaño recomendando es 1600px x 1050px. Es posible que al subir la imagen con un ancho de 750, el sistema no esté aplicando bien la compresión y por ello no se visualiza correctamente en la página web.

Dime, ¿podrías confirmarme si has probado a subir una imagen de banner con un tamaño superior al ancho de 750? En este caso, ¿has probado con el tamaño recomendado de 1600px x 1050px? ¿El problema con la visualización de la imagen se sigue mostrando en tu web? Si es así, sería de gran ayuda que me dieras más detalles de lo que está ocurriendo, ¿la imagen se ve pixelada, borrosa, cortada, etc.? ¿Podrías también compartir conmigo la URL de tu tienda o una captura de pantalla de cómo se ve dicha imagen?

Entretanto, puedes acceder a la guía de tamaños recomendados que compartía en la respuesta anterior para revisar con más detalle los tamaños específicos del tema Dawn de Shopify. En esta, encontrarás recomendaciones para diferentes secciones: banner, productos, colecciones, blogs, etc.

Si aumentar el tamaño de la imagen para que siga la recomendación no funciona, junto a los otros consejos que comentas que ya has aplicado. Por ejemplo, subir la imagen desde la sección de contenido; lo ideal sería instalar un nuevo tema gratuito diferente de Shopify. Esto te permitirá revisar si el error con la visualización de imagen de banner aparece también con otras plantillas distintas de nuestra plataforma. En este caso, ¿podrías también confirmarme si, en efecto, el error sigue presente con otras plantillas?

Mientras revisas esto, me pregunto cómo está siendo tu experiencia con Shopify hasta el momento. Dime, ¿qué tipo de tienda has creado con nuestra plataforma? ¿Qué productos o servicios ofreces a los clientes? ¿Qué objetivos a corto y largo plazo te gustaría conseguir con Shopify y con tu tienda?