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

Páginas de proyecto (familia York)

La Página de proyecto en la familia de plantillas York es una vista de galería personalizada, diseñada con el fin de crear elegantes diseños para portafolios. Usa la Página de proyecto para elaborar diseños que combinen texto e imágenes de maneras atractivas.

York, Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori y Taylor comparten la misma estructura y las mismas funciones de base. Esta guía se refiere a todas estas plantillas. Estas plantillas también admiten Páginas de galería, que ofrecen distintas opciones.

Configurar la Página de proyecto

Para configurar una Página de proyecto:

  1. Ve al Menú de inicio y haz clic en Páginas.
  2. Haz clic en el icono + para añadir un Proyecto.
  3. Para obtener los mejores resultados, añade varias imágenes o videos e incluye un título y una descripción de cada uno de ellos. 

Añadir imágenes y videos

Para añadir imágenes y videos:

  1. En el Menú de Inicio, haz clic en Páginas.
  2. Haz clic en tu Página de proyecto, en el panel de la izquierda.
  3. Sube imágenes, añade imágenes de stock y carga videos. Todos los videos deben tener una imagen en miniatura.
  4. Configura el estado de publicación de tu imagen o video. 

Para editar la configuración de las imágenes y los videos que ya hayas cargado, haz doble clic en la imagen o en el video, en el panel de Página de proyecto.

Diseño

Usa la sección Proyecto: Diseño de Estilos del sitio para ajustar el diseño.

  • Alineación de las imágenes: Alinea todas las leyendas y las imágenes a la derecha, la izquierda o centradas.
  • Espaciado de las imágenes: Ajusta el espacio entre cada imagen del Proyecto.
  • Espaciado de los banners: Ajusta el espacio entre el encabezado de la página y la primera imagen. La altura del texto en la sección Página: Texto introductorio también puede modificarlo.
  • Permitir imágenes verticales y cuadradas de ancho completo: Muestra las imágenes verticales y cuadradas con el ancho del área principal de contenidos. Si has seleccionado Proyecto sin bordes, aparecerán con el ancho del navegador. Este ajuste está habilitado cuando se ha configurado Estilo de la leyenda en imágenes verticales y cuadradas como Estándar o Desplazada.
Nota: Las Páginas de proyecto no admiten lightboxes, URL de enlace profundo ni URL clickthrough. En lugar de una URL clickthrough, puedes agregar un enlace a la leyenda de la imagen. 

Añadir leyendas

Para añadir o ajustar el texto del título y de la descripción:

  1. En el Menú de Inicio, haz clic en Páginas.
  2. Haz clic en la Página de proyecto.
  3. El panel de Página de proyecto, haz doble clic en la imagen. 
  4. Añade tu texto en los campos Título y Descripción.

Los títulos y las descripciones aparecen debajo de las imágenes apaisadas y debajo o al lado de las imágenes verticales y cuadradas. Ajusta su diseño en la sección Proyecto: Diseño de Estilos del sitio.

  • Usa el ajuste Mostrar leyendas del proyecto para mostrar u ocultar todo el texto del nombre y la descripción de las imágenes.
  • Contraer el espaciado en imágenes apaisadas quita el espacio debajo de las imágenes apaisadas que no tienen leyendas.

Usa los ajustes de Proyecto: Sección de fuentes en Estilos del sitio para modificar el estilo del texto del título y las descripciones de tus imágenes.

  • Para justificar el texto a la izquierda, la derecha o el centro, usa los ajustes Alineación del título de la leyenda y Alineación del cuerpo de la leyenda
  • Para las leyendas que aparecen al lado de imágenes verticales o cuadradas, usa el ajuste Alternar las leyendas de las imágenes.

Si seleccionaste Alineación de la imagen: Centro y marcaste Mostrar las leyendas del proyecto, puedes ajustar también en qué lugar de la página aparecen las leyendas con los ajustes Estilo de la leyenda de imágenes verticales y cuadradas y Estilo de la leyenda de imágenes apaisadas.

  • Para cualquiera de estos ajustes, elegir Estándar muestra la leyenda directamente debajo de la imagen y Desplazada mueve la leyenda más abajo con el mismo espacio desde la siguiente imagen.
  • Elegir Estilo de la leyenda de imágenes verticales y cuadradas: Alternar mueve las leyendas al lado de las imágenes cuadradas y verticales. Las leyendas alternan a la derecha y la izquierda de las imágenes. Las imágenes que no tengan leyendas estarán centradas.
  • Elegir Estilo de la leyenda de imágenes apaisadas: Recuadro mueve las leyendas hacia arriba, debajo de las imágenes apaisadas, para que se superpongan levemente.

project-page-example.png

Tamaños de imágenes y videos

Las imágenes de las Páginas de proyecto nunca se extenderán más allá de sus dimensiones originales, incluso si las configuras sin bordes. Esto impide que tus imágenes se vean difusas o pixeladas.

  • Por lo general, el tamaño de la imagen de tu Página de proyecto se determina según las dimensiones originales de tu imagen. Si quieres que la imagen aparezca más grande en la página, carga una imagen de dimensiones más grandes.
  • Para reducir el tamaño de la imagen en la página, carga una imagen con dimensiones más pequeñas. 
  • El ajuste Relleno externo del sitio puede afectar el ancho de las imágenes que no se configuran como imágenes sin bordes.
  • El ancho del video lo configura el sitio que lo aloja. Para personalizar el ancho del video, usa el código para insertar el video y selecciona manualmente el ancho dentro del código.
  • Si necesitas ayuda con los banners y el diseño adaptativo, lee nuestras mejores prácticas.

Imágenes sin bordes

Las imágenes sin bordes se extienden hasta los bordes del navegador e ignoran el relleno externo. Para habilitarlo, primero verifica que tus imágenes tengan el tamaño adecuado. Las imágenes de las Páginas de proyecto nunca se extienden más allá de sus dimensiones originales. Tampoco se mostrarán más anchas que 2500 píxeles debido a como Squarespace optimiza el diseño adaptativo, pero te recomendamos cargar imágenes de, al menos, 2500 píxeles de ancho para obtener los mejores resultados.

Si tus imágenes son suficientemente anchas, puedes usar Estilos del sitio para hacer que no tengan bordes. Esto afectará a todas las Páginas de proyecto de tu sitio.

En las Páginas de proyecto, las imágenes solo pueden aparecer sin bordes en los siguientes casos:

  • Las imágenes están centradas.
  • Las leyendas están debajo de las imágenes.
  • Las imágenes apaisadas deben configurarse como imágenes sin bordes antes de que las imágenes verticales puedan configurarse como imágenes sin bordes.

Para mostrar todas tus imágenes sin bordes, primero configura las imágenes apaisadas:

  1. Abre Estilos del sitio y desplázate hasta la sección Proyecto: Diseño.
  2. Elige Alineación de la imagen: centro. Esto centra tus imágenes.
  3. Verifica que Mostrar leyendas de las imágenes esté marcado, incluso si no tienes leyendas.
  4. Elige Proyecto sin bordes. Esto configurará tus imágenes como imágenes sin bordes.

Luego puedes configurar las imágenes verticales:

  1. Elige Estilo de la leyenda en imágenes verticales y cuadradas: Estándar o Desplazada. Se moverán las leyendas debajo de las imágenes no apaisadas.
  2. Marca Permitir ancho completo en imágenes verticales y cuadradas. Esto configurará tus imágenes verticales como imágenes sin bordes.
  3. Save and refresh the page.

Mover imágenes

Para modificar el orden de las imágenes en la página, cambia el orden dentro del panel de página. Los paneles de Página de proyecto tienen las mismas funciones que los paneles de Página de galería.

Puedes mover una imagen y su título y leyenda correspondientes entre cualquier Página de proyecto o Página de galería. Para obtener más información, visita Mover contenido entre páginas.

Encabezado y pie de página

Además de las imágenes y las leyendas, las Páginas de proyecto admiten lo siguiente:

Si tu Página de proyecto no tiene una imagen en miniatura, la primera imagen que añadas en tu Página de proyecto automáticamente será la imagen del banner en la parte superior. Añade una imagen en miniatura para reemplazarlo o quita la marca en Mostrar banner del proyecto, en Estilos del sitio para ocultarlo de todas las Páginas de proyecto.

Carga de las páginas

Las imágenes y las leyendas de las Páginas de proyecto aparentan deslizarse de arriba abajo cuando te desplazas hacia abajo en la página. Para deshabilitar este efecto, quita la marca en el ajuste Imágenes y leyendas en cascada. Cuando la opción está desmarcada, las imágenes y las leyendas ingresan difuminadas.

Página de galería versus Página de proyecto

Además de Páginas de galería, estas plantillas admiten Páginas de galería estándar.

Mientras que las Páginas de proyecto son buenas para una combinación de imágenes y texto, las Páginas de galería son ideales para centrarse únicamente en las imágenes y los videos. A diferencia de las Páginas de proyecto, las Páginas de galería admiten URL de enlace profundo, URL clickthroughfunciones de lightbox.

Para probar ambas opciones, puedes mover las imágenes entre las Páginas de galería y las Páginas de proyecto.

Nota: Las Páginas de galería no admiten videos en el banner de página.

Cómo cambiar de plantilla

Si cambias a cualquier plantilla distinta de York, Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori o Taylor, tus Páginas de proyecto se convertirán en Páginas de galería.

Si vuelves a cambiar a York, Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori y Taylor, es posible que debas crear nuevas Páginas de proyecto y Páginas de galería y mover las imágenesa estas páginas para recrear el formato original. 

Móvil

En los dispositivos móviles y los navegadores más angostos, el contenido se apila verticalmente en una sola columna.

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 38 de 82
Páginas de proyecto (familia York)