Ir al contenido principal

Guía de tamaños de imagen para ThinkWeb

Usar las dimensiones de imagen correctas es clave para que tu sitio web se vea hermoso y profesional. Así tus fotos se ven nítidas y tu sitio carga rápido.

1. Imágenes de encabezado (Hero)

La imagen de encabezado, o imagen "hero", es el banner grande que normalmente se encuentra en la parte superior de tu página web.

  • Tamaño estándar: Ajusta tu foto de encabezado a 1920 píxeles de ancho por 1080 píxeles de alto.

  • Reglas de ancho: El ancho no puede cambiar. Debe ser exactamente de 1920 píxeles para que abarque la pantalla correctamente.

  • Reglas de alto: La altura de tu imagen de encabezado puede variar según tu diseño específico. Sin embargo, si usas una rotación de imágenes (donde varias imágenes se deslizan o se desvanecen una tras otra), la altura debe ser exactamente la misma para todas las imágenes de esa rotación. Si las alturas no coinciden, tu página web saltará hacia arriba y hacia abajo cuando cambien las imágenes.

2. Imágenes estándar

Para las imágenes estándar que se colocan en el resto de tu sitio web, hay tamaños mínimos estrictos que debes seguir según su orientación:

  • Imágenes horizontales (Landscape): El tamaño mínimo absoluto es de 1000 píxeles de ancho por 667 píxeles de alto (lo que da una proporción estándar de 3:2).

  • Imágenes grandes para presentaciones (horizontales): 1920 x 1080 píxeles. Usa este tamaño más grande para presentaciones de diapositivas, especialmente cuando las diapositivas ocupan más del 55% del ancho de la página, para asegurar que tus imágenes se vean claras sin estirarse ni verse borrosas.

  • Imágenes verticales (Portrait): El tamaño mínimo es de 1000 píxeles de ancho por 1500 píxeles de alto (lo que da una proporción de 2:3).

  • Imágenes cuadradas: El tamaño mínimo para una imagen perfectamente cuadrada es de 900 píxeles de ancho por 900 píxeles de alto.

Mejores prácticas importantes

  • No uses imágenes demasiado pequeñas: Si cargas una imagen en un componente que es más pequeño que las dimensiones mínimas requeridas, el sistema la estirará automáticamente para ajustarla. Esto da como resultado una imagen borrosa y pixelada. Siempre intenta cumplir con los requisitos de tamaño mínimo.

  • No uses imágenes demasiado grandes: Aunque puedes subir imágenes más grandes (como una imagen de 3200 x 1800 píxeles para un encabezado con proporción 16:9), debes tener cuidado. Si subes algo de más de 5,000 píxeles, el sistema se volverá considerablemente más lento al mostrar tu página web.

  • Ajusta el tamaño antes de subir: Siempre intenta ajustar el tamaño de tus imágenes a las dimensiones requeridas antes de subirlas.

¿Ha quedado contestada tu pregunta?