Agrega imágenes atractivas a tu sitio y modifícalas para que se muestren más grandes o más pequeñas.

El uso de imágenes es una excelente manera de dividir el texto, resaltar tus productos o portafolio y mostrar la personalidad de tu marca. Después de agregar imágenes a las páginas de tu sitio, puedes cambiar su tamaño al aumentarlo o reducirlo.

Todos los sitios de Squarespace también tienen un diseño adaptable. Esto significa que el tamaño de las imágenes cambia automáticamente, según el dispositivo que usen los que lo visitan para acceder a tu sitio. En esta guía, mostramos diferentes formas de agregar, cambiar tamaño y personalizar tus imágenes.

Mira el video

Añadir imágenes

Hay muchas maneras de agregar imágenes a tu sitio. Asegúrate de seguir nuestras pautas de formato para que tus imágenes se vean bien en cualquier dispositivo. Puedes:

• Agrega imágenes individuales con bloques de imágenes.
• Agrega conjuntos de imágenes en diseños llamativos con secciones de galería.
• Crea diseños de imágenes, texto y botones usando diseños inteligentes.
• Crea banners con imágenes de fondo de sección para establecer el tono de una página.
• Usa imágenes para destacar diferentes proyectos en las páginas de portafolio.
• Añade un logotipo para el sitio, un logotipo para compartir en redes sociales y un ícono de Favoritos para que la personalización de la marca sea cohesiva y sólida.
• Muestra varias imágenes en entradas de blog y otras áreas de contenido de elementos de la colección con bloques de galería.
• Usa imágenes destacadas para representar elementos de la colección, como entradas de blog y eventos. Después, usa un bloque de resumen para mostrar esas imágenes destacadas en otras áreas del sitio.
• Cargar imágenes de productos para mostrar los diferentes estilos y ángulos de un artículo, y en diferentes partes de tu sitio con bloques de productos.
• Resalta las imágenes más recientes de tu Instagram con bloques de Instagram.

Solución de problemas al subir imágenes

Si subir una imagen no funciona, comprueba si hay problemas con tu navegador o dispositivo. Recomendamos seguir los pasos de solución de problemas de nuestro navegador y volver a intentarlo.

Reutilizar imágenes

Puedes reutilizar cualquier imagen que ya hayas cargado a tu sitio. Usa la biblioteca de recursos para ver y administrar todas las imágenes cargadas. Para obtener más información, visita Administrar y reutilizar imágenes y videos.

Imágenes de stock

Si no tienes tus propias imágenes, puedes agregar imágenes de stock a través de nuestras asociaciones con Unsplash y Getty Images. También puedes reutilizar cualquier imagen de stock o cargada en otras áreas de tu sitio.

Agregar imágenes en la aplicación de Squarespace

En la aplicación de Squarespace, puedes agregar imágenes a cualquier área de tu sitio que las admita, como secciones de galería y bloques de imágenes. Ten en cuenta que algunas páginas de tu sitio que admiten la capacidad de agregar imágenes pueden estar limitadas de otras maneras mientras editas en la aplicación.

Para añadir una imagen:

1. Pulsa + o Añadir imagen.
2. Según el área de la imagen y si usas un dispositivo iOS o Android, puedes:
   • Tomar una nueva foto.
   • Cargar una imagen de tu biblioteca de fotos.
   • Cargar una imagen de tus archivos.
   • Reutilizar una imagen.
3. Pulsa las imágenes para añadir títulos, descripciones y URL clickthrough.

Según el dispositivo que utilices, también puedes seguir estos consejos:

• En iOS, si subes a un bloque de imagen, puedes buscar y agregar imágenes de stock.
• En un iPad, puedes arrastrar y soltar imágenes desde Fotos a la aplicación de Squarespace con Split View.
• Puede añadir imágenes a Mi biblioteca para volver a utilizarlas en un equipo. En iOS, también puedes reutilizar imágenes en el editor de productos. Si deseas informarte mejor, consulta Reutilizar imágenes.

Cambiar tamaño de imágenes

Después de agregar imágenes, puedes agrandarlas o reducirlas en la página. Por ejemplo, una imagen puede ser demasiado grande y saturar el resto del contenido de la página. O puede que tu logotipo sea demasiado pequeño, lo que dificulta su lectura. La forma en que cambias el tamaño de una imagen depende de cómo la hayas agregado a tu sitio.

Bloques

La forma en que cambias el tamaño de los bloques depende del editor:

• Editor dinámico: cambia el tamaño de los bloques directamente en la página haciendo clic y arrastrando.
• Editor clásico: reduce el ancho de cualquier bloque agregando otros bloques al lado. Por ejemplo, si agregas un bloque de espacio junto a un bloque de imagen, se reduce el tamaño y el ancho del bloque de imagen a la mitad. Luego, puedes cambiar el ancho del bloque de espacio para hacer que el bloque de imagen sea más grande o más pequeño.

Muchos bloques tienen otras opciones para personalizar aún más el tamaño y la forma de una imagen:

• Bloques de imagen: en el editor clásico, usa el controlador de recorte para cambiar la altura de los bloques de imagen en línea y en forma de póster.
• Bloques de galería: según el diseño, puedes recortar o cambiar el tamaño de las imágenes.
• Bloques de sumario: usa la configuración de diseño para cambiar el aspecto de tus imágenes.
• Bloques de Instagram: usa la configuración para elegir un diseño y cambiar la relación de aspecto.

Páginas y secciones

• Secciones de galería: aplica estilo a la galería para que las imágenes se vean como te gustaría. También puedes probar con otro diseño.
• Páginas de portafolio: aplica estilo a la sección de portafolio para cambiar cómo aparecen las imágenes.
• Páginas de tienda: aplica estilo a tus páginas de tienda para cambiar la relación de aspecto y el ancho de la imagen.
• Si tu sitio está en la versión 7.0, también puedes agregar imágenes a las páginas de galería y a las páginas de portada. Algunas plantillas de la versión 7.0 admiten imágenes de fondo en todo el sitio. Si necesitas ayuda para cambiar el tamaño de las imágenes, consulta la guía de tu plantilla

Otras áreas de tu sitio

• Imágenes de banner: cambia el alto o el ancho de la sección de la página con la imagen de fondo. Estas imágenes siempre experimentan algún grado de recorte en dispositivos móviles.
• Logotipo del sitio: cambia la posición y el tamaño de tu logotipo.

Opciones de imagen avanzadas

Ve más allá de lo básico con imágenes interactivas, animaciones y formas de imagen.

• Agrega texto alternativo a tus imágenes para que aparezcan en las búsquedas y hagan que el sitio sea más accesible para los visitantes que utilizan lectores de pantalla.
• Agrega animaciones llamativas y efectos de imagen a los bloques de imagen para que tu sitio sea único y dinámico.
• Edita las imágenes con el editor integrado para lograr el aspecto perfecto. Por ejemplo, tal vez quieras recortar, rotar o agregar filtros.
• Configura las imágenes para que se abran en lightbox y destaquen del otro contenido.
• Convierte las imágenes en enlaces con URL clickthrough.
• Utiliza los efectos de desplazamiento para mostrar más información cuando los visitantes muevan el cursor sobre una imagen.
• Usa formas de imágenes para dar variedad y efectos visuales únicos a tus imágenes.

Consejo: Para hacer cambios en las dimensiones del archivo de imagen original, te recomendamos que utilices un software de edición de imágenes de terceros. Por ejemplo, si subiste una imagen de 600 x 600 píxeles, pero quieres que sea de 400 x 400 píxeles, editarás la imagen en tu dispositivo y, a continuación, la subirás de nuevo a tu sitio.

Cambiar el tamaño de las imágenes para redes sociales

Si quieres cambiar el tamaño y recortar imágenes a dimensiones específicas para usarlas fuera de Squarespace o en plataformas de redes sociales, usa el redimensionador de imágenes gratuito de Squarespace.

Puedes subir varios archivos .jpg o .png y luego seleccionar los tamaños que quieras. Selecciona tamaños preestablecidos para usar en Instagram, Facebook, YouTube, X (anteriormente Twitter) y Snapchat, así como otras relaciones de aspecto estándar.

Después de cambiar el tamaño de tus imágenes, haz clic en el icono de descarga en la esquina superior derecha para descargar las imágenes en un archivo .zip. Las nuevas imágenes conservan el formato de archivo de la versión original.

Nota: El redimensionador de imágenes está diseñado para cargar imágenes y cambiar su tamaño directamente desde tu dispositivo para usarlas en las redes sociales. No es posible usar imágenes que ya has subido a tu sitio de Squarespace o transferir imágenes del redimensionador a tu sitio, pero puedes subir imágenes redimensionadas a tu sitio después de descargarlas.

Próximos pasos

• Mira la serie de videos Todo sobre imágenes para obtener tutoriales sobre el uso de imágenes en Squarespace.
• Para ofrecer a tus visitantes una experiencia aún más dinámica, también puedes agregar videos a tu sitio.
• Para informarte sobre cómo hacer tus imágenes más accesibles, visita Hacer que los audios, imágenes y videos sean más accesibles.