Email-Icon Created with Sketch. Group 3 Created with Sketch. Domains-SVG-Box Created with Sketch. Domains-SVG-Box Created with Sketch. Domains-SVG-Box Created with Sketch. Hosting-SVG-Box Created with Sketch. Hosting-SVG-Box Created with Sketch. Icon-Internet Created with Sketch. Hosting-SVG-Box Created with Sketch. Icon-Internet Created with Sketch. Icon-Internet Created with Sketch. Hosting-SVG-Box Created with Sketch. Hosting-SVG-Box Created with Sketch. Trust Pilot Stars Created with Sketch. 1-5-million Created with Sketch. black-green yellow_blue Control-panel-Icon Created with Sketch. WSB-Brush Created with Sketch. WSB-Brush Created with Sketch. WSB-Brush Created with Sketch. Email-Icon Created with Sketch. Email-Icon Created with Sketch. Email-Icon Created with Sketch. Email-Icon Created with Sketch. Icon-ECommerce-Seperator Created with Sketch. Icon-ECommerce-Seperator Created with Sketch. Icon-ECommerce-Seperator Created with Sketch. icon-slider-next Created with Sketch. icon-slider-prev Created with Sketch. Webmail-icon Created with Sketch. heart Created with Sketch. Open-24-7 Created with Sketch. 247 Created with Sketch. open24 Created with Sketch. 24 7 trusted Created with Sketch. Fill 1 Created with Sketch.

Utilizando imágenes en el Website Builder

Ninguna página web está completa sin imágenes o ilustraciones. Las imágenes dan vida a su página web, pueden ser utilizadas para enfatizar un contenido específico o explicar cómo funciona algo.

En el Website Builder dispone de muchas posibilidades con las imágenes. En esta guía le explicaremos algunas de las opciones disponibles para usted.

Experimente con el componente imagen
Edite imágenes directamente en el Website Builder
Muestre imágenes en una presentación
Alinear imágenes en una cuadrícula
Seleccione una imagen como fondo fijo
Compre imágenes de stock profesionales
Cree un encabezado de imagen responsivo

Ajuste fácilmente el tamaño y la ubicación de cada componente.

Puede arrastrar las asas de tamaño de un componente para hacerlo más grande o más pequeño. Si quiere seleccionar un tamaño específico simplemente escriba la altura y anchura en la caja verde que se hará visible una vez que el componente sea seleccionado.

Para cambiar la ubicación de un componente, selecciónelo y arrástrelo hasta la posición deseada. Use las flechas de dirección en su teclado para mover de píxel en píxel. Una línea azul aparecerá cuando el componente esté centrado y alineado con otros componentes de su página.



Experimente con el componente imagen

Puede hacer con el componente imagen más de lo que cree. Estos son algunos de los trucos que nuestro equipo de diseño utiliza al crear nuestras plantillas.

Play around with the image component

Muestre sólo parte de una imagen - Seleccione el escalado de la imagen a Recortar. Use el deslizador de zoom de Escala en su imagen. Haga doble-clic en el componente y mueva la imagen dentro del componente hasta que la parte que quiera mostrar sea visible.

Haga una foto circular - Ajuste el tamaño de un componente imagen a un cuadrado, de modo que tenga la misma anchura y altura. Bajo Propiedades, ubique las esquinas y añada un valor que sea la mitad exacta de la anchura y altura de la imagen.

Añada una capa de color a una imagen - Coloque un componente fondo sobre la imagen. Elija un color y seleccione la transparencia del componente fondo para desteñir la imagen y darle un tono de color. Añada un componente texto encima, para mantenerlo visible en las pantallas pequeñas.

¿Cómo inserto una imagen?

Edit your images directly in Website Builder

Edite imágenes directamente en el Website Builder

¿Necesita más opciones de edición? Utilice el editor de fotos para editar fácilmente dentro del Website Builder. No necesita usar un programa instalado en su ordenador.

Haga que las imágenes se vean mejor cambiando el color, brillo o tamaño. Utilice la herramienta Mejorar para rediseñar su imagen en un clic.

Elimine imperfecciones o cree la versión espejo de una imagen de modo que se ajuste mejor en su página. También puede ajustar sus imágenes con estilosas herramientas, como pegatinas, marcos y capas.

¿Cómo edito una imagen en Website Builder?


Display your images in a slideshow

Muestre imágenes en una presentación

Muestre sus imágenes favoritas en una presentación. Puede, por ejemplo, usar un slider de imágenes para mostrar de qué se trata su sitio. Coloque un texto corto sobre el slider para completarlo.

También puede crear una presentación para atraer la atención hacia los productos de su Tienda online. Enlace cada foto directamente a la página del producto correspondiente para aumentar las ventas.

Cuando inserte una presentación asegúrese de no incluir más de 3-5 imágenes. Demasiadas imágenes aumentarán el tiempo de carga de su página web y distraerá a sus visitantes.

¿Cómo inserto una presentación de diapositivas?


Place your images in a grid with the gallery component

Alinear imágenes en una cuadrícula

Si quiere mostrar un número de imágenes en una página, puede ser una tarea tediosa alinear todos los componentes entre si. Eso por esto que creamos el componente Galería.

Le permite incluir hasta 100 imágenes en un componente y alinearlas perfectamente en una cuadrícula. Puede ajustar el tamaño de las imágenes y hasta añadir subtítulos.

¿Cómo puedo insertar varias imágenes en una cuadrícula?







Add a fixed background to your website

Seleccione una imagen como fondo fijo

Puede seleccionar una imagen como fondo fijo, de modo que la imagen no se mueva cuando navegue por la página. Esto puede ser útil cuando quiere un paisaje como imagen de fondo.

Añada una playa o puesta de sol, por ejemplo, si está haciendo una página sobre viajes. La imagen permanecerá en su lugar, incluso cuando su visitante navegue por la página. Esto le dará a su página un diseño profesional y unificado, evitando las feas repeticiones o bordes.

¿Cómo añado un fondo fijo?





Give your site that extra touch with professional images

Compre imágenes de stock profesionales

Para darle el toque extra a su página, puede comprar imágenes profesionales de Bigstock. Considere seleccionar un bello fondo para empezar a construir su página.

Los clientes de One.com pueden comprar fotos individuales de Bigstock con descuento, directamente desde el Website Builder.

¿Cómo puedo comprar una foto de Bigstock?








Add a responsive header to your website

Cree un encabezado de imagen responsivo

La mitad de todas las búsquedas en internet son por medio de dispositivos móviles, por lo que es importante que su página se muestre bien en pantallas de diferentes tamaños.

Una de las maneras de hacer esto es por medio de los encabezados de imagen responsivos. Un encabezado responsivo ajusta automáticamente su tamaño al tamaño de la pantalla. Use el componente fondo para insertar y ajustarlo a la anchura de su pantalla.

Nota: Un componente fondo se ocultará en pantallas pequeñas, a no ser que añada otro componente encima.

¿Cómo añado un encabezado responsivo?



Artículos relacionados:

¿Cómo puedo añadir un componente en Website Builder?
¿Cómo puedo crear una página con otra plantilla?