¿Por qué la imagen se muestra de forma diferente en dispositivos móviles y computadoras de escritorio?
GemPages adapta automáticamente el diseño de su página a diferentes tamaños de pantalla en función de un diseño adaptativo Principio. Estas son las razones más comunes por las que su imagen puede verse diferente:
- cambio de tamaño responsivoLas imágenes se ajustan a cada dispositivo. Esto permite cambiar el tamaño, la relación de aspecto o el recorte de una imagen.
- Configuración de visibilidad del dispositivoEs posible que haya configurado la imagen para que se muestre solo en el escritorio, solo en el móvil o en ambos.
- Diseño personalizado para cada vistaEs posible que hayas personalizado secciones por separado para dispositivos móviles o computadoras de escritorio, lo que genera variaciones.
¿Cómo arreglar este problema?
Aquí te explicamos cómo garantizar que tu imagen se vea uniforme en todos los dispositivos. Abre el Editor de GemPages Panel de control y siga los pasos rápidos a continuación:
Comprobar la configuración de visibilidad
1. Haga clic en el elemento de imagen.
2. En la barra lateral izquierda, vaya a la Avanzado .
3. Desplácese hasta Mostrar en.
4. Seleccione los dispositivos correctos (computadora de escritorio, tableta, dispositivo móvil).
Ajustar el tamaño de la imagen manualmente
1. Cambiar a Vista móvil utilizando el conmutador de dispositivos.
2. Seleccione el elemento de imagen.
3. Utilice los controles de tamaño y espaciado para ajustar cómo aparece la imagen en el móvil.
4. Repetir para Tablet View si es necesario.
Utilice el mismo elemento de imagen en todos los dispositivos
Si estás usando el mismo elemento de imagen Para todos los dispositivos (computadora de escritorio, tableta, móvil), tenga en cuenta que:
- La imagen puede ser cambiar el tamaño de or recortada de forma diferente según el tamaño de la pantalla.
- Los márgenes, el relleno o el diseño de la sección pueden hacer que la imagen se desplace o se estire.
- En pantallas más pequeñas, la misma imagen puede verse demasiado grande o perder el foco.
Para mantener un aspecto consistente:
1. Seleccione el elemento de imagen.
2. Utilice el Conmutador de dispositivos Para obtener una vista previa de cómo aparece en cada dispositivo
3. Ajuste configuraciones como Ancho/Alto máximo, Relleno/Margen y Ajuste de objeto.
4. Aplique valores diferentes para cada dispositivo alternando los Icono de dispositivo al lado de cada configuración.
Subir diferentes versiones de imágenes para cada dispositivo (opcional)
Si una imagen no funciona bien en todos los dispositivos, pruebe este enfoque:
1. Prepare varias versiones de la misma imagen (por ejemplo, optimizada para computadoras de escritorio y dispositivos móviles).
2. Cargue cada versión como un elemento de imagen separado en su diseño.
3. Utilice el Visibilidad Configuración para mostrar/ocultar cada imagen según el dispositivo.
Ajustar el tamaño de la imagen manualmente
gracias por tus comentarios