Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.

Ajustar el tamaño de una imagen

Cuando agregas un bloque de Imagen a una página o entrada de blog, varios factores afectan el tamaño con que se verá la imagen en tu sitio:

  • El tamaño del bloque de imagen
  • El diseño que hayas elegido para el bloque de imagen
  • El tamaño de la imagen original (diseño Alineado solamente)

Esta guía te ayuda a comprender esos factores y explica las diferentes opciones para cambiar el tamaño de una imagen.

Mira el video

Antes de comenzar

  • Esta guía explica cómo modificar el tamaño de los Bloques de imagen, lo que te permite añadir imágenes a Páginas de Diseño, entradas de blog y demás áreas de contenidos en Squarespace. Para datos sobre otros tipos de imágenes, ve nuestra información sobre otras imágenes.
  • Te recomendamos cargar una imagen que tenga un ancho entre 1500 y 2500 pixeles. Este rango es la mejor opción para imágenes que se ven bien, pero no sobrecargan tu sitio.
  • Si estás utilizando un diseño predefinido con un Bloque de imagen marcador de posición, agrega tu propia imagen al bloque antes de intentar cambiar su tamaño.

Ajusta el tamaño con otros bloques

Cuando agregas un Bloque de Imagen, se expande para ocupar el ancho total del área de contenido. Puedes reducir el tamaño del Bloque de Imagen si añades bloques a cualquiera de los lados. La relación de aspecto (ancho a altura) permanecerá igual, así que la imagen completa se reduce mientras mantiene la misma forma.

La forma más común de hacerlo es con bloques espaciadores, que crean un espacio en blanco. Agrega estos bloques a la izquierda o a la derecha de un bloque de imagen, a continuación, arrastra e icono del controlador para cambiar el tamaño del bloque de imagen.

  1. Haz clic en un punto de inserción para añadir un bloque de espacio.
  2. Arrastra el bloque espaciador a la izquierda o derecha del bloque de imagen.
  3. Haz clic y arrastra el controlador de redimensionamiento.

Cambiar el tamaño de una imagen para hacerla más pequeña utilizando otro bloque.

Para centrar la imagen, añade bloques espaciadores de igual tamaño a ambos lados.

Arrows_pointing_to_two_Spacer_Blocks_with_an_image_in_between_the_blocks.jpg

Otros bloques

Puedes usar este mismo método con otros bloques. Esto resulta especialmente útil para texto que aparece junto a imágenes, como en el .gif que aparece a continuación.

Resizing_an_Image_Block_using_a_Text_Block.gif

Recorta la imagen original

Recortar una imagen puede cambiar la altura y la forma de una imagen cortando y eliminando porciones de ella.

Para recortar la imagen original, usa el Editor de imágenes integrado, como se muestra en la imagen a continuación, o usa tu propio software de terceros y vuelve a cargar la imagen.

Consejo: Por lo general, la imagen recortada permanecerá del mismo ancho en tu sitio. Para cambiar el ancho, utiliza uno de los otros métodos de esta guía.

image_editor_-_example_crop.jpg

Usa el controlador de recorte

Una opción para los diseños Alineado y Póster es hacer clic y arrastrar el controlador de recorte para cortar la imagen verticalmente. Esto dejará la imagen con el mismo ancho, pero cambia la altura.

  1. Haz clic en el Bloque de imagen. Aparece un borde con un controlador circular en la parte inferior.
  2. Haz clic y arrastra el controlador de recorte para recortar la imagen.

Consejos:

  • Presiona y mantén presionada la tecla Mayúscula mientras arrastras el controlador de corte para modificar el tamaño de la imagen en incrementos de 20 píxeles. Esto puede permitir alinear la parte inferior de la imagen con otro bloque.
  • El controlador de recorte solo aparece después de agregar una imagen.
  • Puedes elegir un centro para la imagen recortada usando puntos focales.
  • Haz doble clic en el controlador de recorte para deshacer el recorte.
  • Tira del borde para ampliar la imagen.

Decreasing_the_height_of_an_image_using_the_cropping_handle.gif

Haz clic y arrastra el controlador de recorte hacia abajo para recortar horizontalmente. Esto hace zum sobre la imagen y recorta los lados.

Dragging_the_cropping_handle_down_to_horizontally_crop_an_image.gif

Cambia el tamaño con Estilos de Bloque de imagen

Los diseños TarjetaSuperposición y Collage tienen una opción para ajustar el tamaño en su configuración de estilo.

  1. Mientras editas una página, abre Estilos del sitio y, a continuación, haz clic en Bloques de imagen.
  2. Desplázate hasta la sección de ese diseño. (Por ejemplo, desplázate hasta la sección Bloque de imagen: Tarjeta).
  3. Usa el ajuste Ancho de imagen para cambiar el tamaño. El texto de la imagen se ajustará automáticamente al espacio.
  4. Haz clic en Guardar.
  1. En el Menú de Inicio, haz clic en Diseño y, luego, en Estilos del sitio.
  2. Desplázate hasta la sección de ese diseño. (Por ejemplo, desplázate hasta la sección Bloque de imagen: Tarjeta).
  3. Usa el ajuste Ancho de Imagen para cambiar el tamaño. El texto de imagen se hará automáticamente más grande o más pequeño para adaptarse al espacio.
  4. Haz clic en Guardar.
Consejo: Esto afecta a todos los Bloques de imagen con ese diseño.

Ampliar para cubrir el bloque

Si estás usando el diseño Incorporado y tu imagen es más angosta que el Bloque de imagen, la imagen conservará su ancho original. Verás un espacio en blanco a ambos lados de la imagen dentro del bloque. Esto preserva la calidad original de la imagen.

Para llenar el espacio en blanco y que la imagen ocupe todo el ancho del bloque:

  1. Abre el bloque de imagen y haz clic en Diseño.
  2. Activa el botón Estirar.

Consejos:

  • Expandir una imagen puede afectar a la calidad de imagen.
  • Para reducir la necesidad de expandirla, te recomendamos cargar una imagen que tenga un ancho entre 1500 y 2500 pixeles.
  • Si la imagen es más ancha que el área del bloque de imagen, se reducirá hasta caber (no se recortará).
  • Los otros diseños se expanden automáticamente.

Arrow_pointing_to_the_Stretch_setting_in_the_Inline_Image_Block.jpg

Opciones por diseño

Aquí encontrarás una guía rápida para las diferentes opciones disponibles en cada diseño:

Opción Inline (Alineado) Poster (Póster) Card (Tarjeta) Overlap (Superpuesta) Collage (Collage) Apilada
Ajusta el tamaño con bloques
Recorta la imagen original
Usa el controlador de recorte
Estilos del sitio

Estirar para llenar n/a n/a n/a n/a n/a

Otras imágenes

Tu sitio tiene otras opciones para agregar imágenes, todas con sus propias opciones de ajuste de tamaño:

Consejo: Para cualquier bloque, puedes usar el método de Ajustar el tamaño con otros bloques.
¿Fue útil este artículo?
Usuarios a los que les pareció útil: 159 de 580