Cómo crear una galería de fotos o vídeos con Squarespace

Cuando utilizas imágenes o vídeos en tu página web, ¿los publicas uno a uno o prefieres organizarlos en una galería? 

Las galerías pueden ser una opción estupenda para un diseño más compacto, así como una buena forma de agrupar varias imágenes o vídeos que compartan un tema o una categoría. Puedes crear galerías con presentaciones de diapositivas, carruseles y otros tipos de galerías para tus archivos multimedia en una página de Squarespace; solo necesitas saber cómo hacerlo. Por suerte, me tienes a mí para ayudarte.

7.0 Páginas de galería

En primer lugar, hablemos de las páginas de galería. Squarespace 7.0 es más restrictivo en cuanto al diseño que la versión 7.1, por lo que, en lugar de poder añadir una galería a una página de contenido ya existente, es necesario crear una página específica para la galería. Si quieres incluir una galería en otro tipo de contenido, como una entrada de blog, debes:

• Crea una página de galería y rellénala con tus archivos multimedia.

• Utiliza un bloque de galería para extraer contenido de la página de la galería e incrustarlo en tu página principal.

Las páginas de galería también presentan ciertas limitaciones. Su diseño y estilo provienen de la plantilla principal, y no es posible modificarlas en gran medida sin implementar código personalizado. No obstante, puedes elegir si tu galería tendrá formato de cuadrícula, presentación de diapositivas, visualización apilada o carrusel. Puedes incluir hasta 250 elementos multimedia —fotos y vídeos— en una galería, y puedes mezclar fotos y vídeos en la misma galería.

Por el lado positivo, añadir una página de galería es muy fácil. Solo tienes que iniciar sesión en tu panel de control, hacer clic en «Páginas» en el menú de inicio y, a continuación, hacer clic en «Galería». A partir de ahí, personaliza la página de galería igual que harías con cualquier otra página de Squarespace.

7.0 y 7.1: Bloques de galería

Los bloques de galería son ligeramente diferentes de las páginas de galería. Mientras que una página es, bueno, una página completa de tu sitio web, un bloque es un elemento que se puede utilizar dentro de una página. Un bloque de galería se puede utilizar en una página, en una entrada de blog o en otras secciones de tu sitio web, y puede obtener sus datos de una página de galería o funcionar de forma independiente.

El lugar donde puedes utilizar un bloque de galería depende de si tu sitio web está en la versión 7.0 o 7.1. 

• Los sitios 7.0 pueden insertar bloques de galería en cualquier área de contenido de su sitio.

• 7.1 Los sitios web pueden colocar bloques de galería en cualquier lugar donde no se admita una sección de galería. Esto incluye entradas de blog, elementos individuales y cuadros informativos de productos. Los bloques de galería no se pueden añadir a páginas de diseño, páginas de destino de colecciones, pies de página ni subpáginas de portafolio.

ACTUALIZACIÓN DE NOVIEMBRE DE 2024: Beyondspace.studio ha publicado un complemento gratuito que permite recuperar los bloques de galería en las secciones de Squarespace 7.1 (motores Classic y Fluid), incluida la función «Galería existente». Puedes consultar los pasos detallados en esta entrada.

Para crear un bloque de galería tanto en la versión 7.1 como en la 7.0, haz clic en cualquier lugar donde se pueda añadir un bloque de galería. Haz clic para insertar un bloque de galería. En el bloque resultante, la pestaña «Contenido» te permite añadir tus imágenes o vídeos, mientras que la pestaña «Diseño» te permite personalizar el estilo y el diseño del bloque.

¿Qué es mejor: los bloques de galería o las páginas de galería?

Al ver lo anterior, quizá te preguntes cuál de los dos deberías utilizar. ¿Qué es mejor, los bloques o las páginas, y por qué?

La verdad es que ambos tienen ventajas e inconvenientes. Depende en gran medida del uso que le vayas a dar. Así que hablemos de las ventajas de cada uno. En primer lugar, las ventajas del bloque de galería:

• Los bloques de galería son uniformes en todas las plantillas de los sitios web con la versión 7.0. Aunque el estilo general puede variar si cambias de plantilla, el formato y el contenido de un bloque de galería se mantendrán si decides realizar ese cambio.

• Los bloques de galería son precisamente eso: bloques. En una página que puede contener varios tipos de bloques, los bloques de galería se integran a la perfección con otros tipos de bloques, como los de texto.

• Los bloques de galería se pueden añadir prácticamente en cualquier lugar de tu sitio web, siempre y cuando tu plantilla permita añadir un bloque en el lugar donde quieras colocarlo.

• Los bloques de galería pueden extraer su contenido de una página de galería. De este modo, puedes insertar el mismo bloque de galería en varias páginas y, si necesitas cambiar una imagen del mismo, basta con cambiarla en la página de galería para que los cambios se reflejen automáticamente en los bloques de galería.

¿Y qué hay de las páginas de galería? Tienen algunas ventajas propias.

• Pueden incluir funciones especiales para plantillas concretas en sitios web con la versión 7.0. Por ejemplo, Momentum permite el recorte a sangre en lugar del recorte tradicional. 

• Las páginas de galería se pueden añadir a las páginas de índice, al igual que cualquier otro tipo de página principal. Si eres un creador de contenidos multimedia y tienes muchas galerías individuales que compartir, esta puede ser una herramienta estupenda para una web de portfolio.

• Las páginas de galería se pueden añadir a los bloques de resumen, del mismo modo que cualquier otro tipo de página. Esto permite incluir metadatos adicionales y algunas otras funciones útiles.

Todo eso se aplica principalmente a los sitios de la versión 7.0. En los sitios de la versión 7.1, no se pueden utilizar páginas de galería. Sin embargo, sí se pueden utilizar secciones de galería.

¿Y qué hay de las secciones de la galería?

Las secciones de galería son algo así como bloques de galería, diseñadas para sitios web de Squarespace 7.1. Los sitios web de la versión 7.1 pueden utilizar tanto bloques como secciones.

Las secciones de galería se pueden añadir a cualquier página como parte del contenido de la misma. No se pueden añadir a áreas de tu sitio web que no utilicen secciones, como las entradas de blog o las páginas de eventos. En esas páginas, debes utilizar el formato de bloque de galería. 

Para crear una sección de galería, tu sitio web debe ser una versión 7.1. Inicia sesión y ve al menú «Inicio»; a continuación, haz clic en el menú «Páginas» y luego en «+». Haz clic en «Diseños de página», selecciona «Galería» y elige uno de los diseños disponibles para la galería. Si lo deseas, puedes cambiarlo más adelante sin tener que volver a crear la galería.

Esto abre el nuevo editor de secciones. Introduce el título, pulsa Intro y haz clic en «Editar» en la página. Desde allí, puedes añadir imágenes y modificar el estilo de la sección. Cuando hayas terminado, guarda y publica la sección.

Uno de los mayores inconvenientes de las secciones de galería en la versión 7.1, en comparación con los bloques de galería de la versión 7.0, es que no admiten vídeos, solo imágenes. Si quieres incluir vídeos en una galería en un sitio web con la versión 7.1, tendrás que utilizar bloques de galería, lo que podría implicar el uso de un tipo de página diferente.

¿Qué es mejor utilizar, un bloque o una sección, en la versión 7.1?

• Las secciones solo se pueden utilizar en páginas de diseño, páginas de destino y subpáginas de portfolio. Por el contrario, los bloques se pueden utilizar en entradas de blog, descripciones de eventos y cuadros informativos adicionales de productos.

• Las secciones de galería solo muestran la galería y no se les puede añadir ningún otro contenido. Los bloques de galería muestran una galería, pero se pueden añadir junto con otros bloques.

• Los bloques de galería pueden mostrarse como presentaciones de diapositivas, cuadrículas, carruseles o imágenes apiladas. Las secciones de galería pueden ser cuadrículas simples, en franjas o tipo «masonry», o presentaciones de diapositivas simples, completas o en formato «reel». Los «reels» son similares a los bloques de carrusel.

También hay algunas peculiaridades relacionadas con los clics, la funcionalidad de la ventana emergente y la posibilidad de añadir o no animaciones a la galería. 

Ten en cuenta que puedes seguir añadiendo imágenes individuales con total normalidad; todas las restricciones mencionadas anteriormente se aplican únicamente a las galerías. 

Directrices sobre imágenes de Squarespace

Las galerías pueden presentar algunas peculiaridades si intentas subir imágenes con relaciones de aspecto o dimensiones muy diferentes entre sí. Esto se nota especialmente en las páginas web para móviles, que no se pueden ajustar con tanta facilidad como las de ordenador. Squarespace recomienda seguir sus directrices de formato de imágenes, que he reproducido aquí.

• Utiliza únicamente los formatos .jpg, .gif o .png para las imágenes. Lamentablemente, el formato webp no es compatible.

• Intenta que el tamaño de los archivos de imagen sea reducido. Especialmente en el caso de las galerías, donde se cargan docenas o más imágenes a la vez, es recomendable minimizar el tamaño de los archivos para acelerar los tiempos de carga. El límite máximo es de 20 MB por archivo de imagen, pero Squarespace recomienda intentar que no superen los 500 KB.

• Limita los caracteres que utilizas en los nombres de los archivos. Squarespace solo admite letras, números, guiones bajos y guiones. No admite letras acentuadas, signos de interrogación, signos de porcentaje ni el símbolo «&», ya que todos ellos pueden provocar errores de código.

• Tu límite máximo es de 60 megapíxeles. Para calcular la resolución en megapíxeles, cuenta el número de píxeles en horizontal y en vertical, multiplica ambos números entre sí y divide el resultado por un millón. 

• Utiliza colores RGB. Los colores CMYK no se mostrarán correctamente.

• Por lo general, es recomendable que las imágenes tengan una anchura de entre 1.500 y 2.500 píxeles. Las imágenes más grandes se comprimirán verticalmente, mientras que las más cortas pueden estirarse de forma extraña. Esto varía en función del tamaño del contenedor de la galería.

• Crea un nombre de archivo descriptivo. Squarespace utiliza el nombre del archivo como texto alternativo si no se especifica ninguno. Por ese motivo, intenta evitar utilizar nombres de archivo ofensivos o incorrectos. Lo mejor es especificar un texto alternativo, por supuesto, pero si se te olvida, esto sirve como alternativa.

• No te preocupes por el DPI ni el PPI; son unidades de medida para imágenes impresas, no para imágenes web.

La mayor parte de esto ya lo hará tu cámara o el procesamiento de imágenes, pero conviene saberlo por si acaso algo funciona de forma extraña y no estás seguro de a qué se debe.

Añadir vídeos a las galerías

Como se ha mencionado anteriormente, los bloques de galería tanto en la versión 7.0 como en la 7.1, así como las páginas de galería (pero no las secciones de galería), admiten vídeos. Entonces, ¿cómo se pueden añadir vídeos?

Lamentablemente, no es posible subir vídeos directamente. Tienes que utilizar un servicio de alojamiento de vídeos de terceros para subir y alojar tus vídeos, y luego utilizar el sistema de galería para incrustarlos.

Squarespace admite directamente la incrustación de vídeos de YouTube, Vimeo, Wistia y Animoto. Otros servicios de vídeo, como DailyMotion, también pueden funcionar, aunque para ello hay que utilizar el código de incrustación que proporcionan. 

Para añadir un vídeo, haz clic en el signo «+» de una galería para añadir un nuevo elemento multimedia y, a continuación, selecciona «vídeo». Se te pedirá la URL del vídeo, o bien puedes hacer clic en la opción «código personalizado» para añadir el código de incrustación de un sitio web no compatible. También puedes elegir una miniatura personalizada para que se cargue en lugar del vídeo completo, con el fin de mejorar la velocidad del sitio web. 

Si quieres incluir un vídeo en una galería que no lo admite, la mejor opción es utilizar algún tipo de software para convertir el vídeo en un archivo GIF animado. Esto suele dar lugar a un archivo muy grande, por lo que te convendrá utilizar otras herramientas para optimizar y reducir el tamaño del GIF, dependiendo del uso que le vayas a dar al archivo. Ten en cuenta que los GIF animados no incluyen audio, por lo que este método no funciona si quieres que el vídeo incrustado incluya contexto de audio.

Otras opciones de estilo

Si buscas algo un poco más original para que tus galerías de imágenes destaquen entre las del resto de usuarios que utilizan tu plantilla en Squarespace, una opción es comprar una plantilla personalizada de terceros. Tengo varias de ellas en mi página de complementos recomendados.

Complemento de galería de Squarespace con estilo «Masonry »: este complemento funciona tanto en sitios web con la versión 7.0 como con la 7.1 y te ofrece un diseño sencillo de estilo «Masonry» para tus galerías. Puedes elegir si quieres que se aplique a todas las galerías o solo a algunas específicas de tu sitio web.

Galería: Orden aleatorio de imágenes – Se trata de un sencillo complemento de galería tanto para Squarespace 7.0 como para 7.1, aunque no funciona en secciones de galería. Lo que hace es, precisamente, lo que su nombre indica: ordena aleatoriamente las imágenes de las galerías que utilices cada vez que un visitante cargue una página. Se puede aplicar solo a bloques específicos o a todos los bloques, y ofrece algunas opciones de configuración adicionales.

Navegación con puntos para bloques de galería: ¿Sabes que muchas páginas web tienen unos pequeños puntos debajo de una galería, sobre todo aquellas con una presentación automática, para indicarte qué imagen de la serie estás viendo y cuántas más hay en la galería? Eso es precisamente lo que hace este plugin: te muestra esos puntos. Es sencillo y eficaz como complemento para los bloques de galería.

Contador de imágenes de la galería: este es bastante similar al anterior, ya que añade un sencillo contador numérico «1/x» para mostrar al usuario en qué imagen se encuentra dentro de una galería y cuántas imágenes tiene esta. Es más compacto que los puntos y resulta más adecuado para galerías más grandes.

Mis complementos no son los únicos que hay disponibles, pero son los que recomiendo. Si tienes otras ideas o sugerencias, ¡no dudes en decírmelo!

Los 8 mejores temas de Squarespace para nutricionistas

En el sector de la salud y el bienestar, contar con una página web atractiva a la vista y funcional es fundamental para el éxito. Como nutricionista, tu página web no solo debe ofrecer información valiosa sobre tus servicios, sino también crear una sólida presencia en línea que atraiga a los clientes. Squarespace es una plataforma muy popular para crear páginas web impresionantes y, aunque ofrece una gran variedad de plantillas, a veces necesitas un poco más de personalización para que tu sitio destaque de verdad. ¡Ahí es donde entran en juego las plantillas de terceros! En este artículo, ameno y detallado, exploraremos algunas de las mejores plantillas de Squarespace para nutricionistas disponibles de diseñadores de plantillas externos. ¡Pues vamos a ello!

1. Plantilla «Lakshi» de Squarespace

Lakshi es la plantilla perfecta para entrenadores personales y aficionados al fitness que quieran dar a conocer sus servicios. Diseñada pensando en el SEO y la captación de clientes potenciales, Lakshi cuenta con botones de llamada a la acción claros, un formulario de correo electrónico para generar clientes potenciales y una página de blog para compartir conocimientos. Es totalmente adaptativa y personalizable, lo que garantiza que tu página web se vea perfectamente en cualquier dispositivo. Consigue Lakshi aquí:

2. Plantilla «Sarah» de Squarespace

Diseñada específicamente para asesores y consultores de salud, la plantilla «Sarah» ofrece un diseño fresco y moderno que promociona tus servicios de forma eficaz. Con formularios estratégicos de suscripción al boletín, llamadas a la acción y una página dedicada a tus servicios, esta plantilla te ayuda a posicionarte como un profesional en tu campo. Echa un vistazo a «Sarah» aquí:

3. Plantilla de Squarespace sobre salud y nutrición

Esta potente plantilla es perfecta para empresas del sector de la salud y la nutrición que buscan una página web única y eficaz. «Salud y nutrición» incluye todo lo necesario para consolidar una sólida presencia en línea y empezar a recibir más consultas. Ideal para promocionar programas de coaching, suscripciones o cursos en línea. Consíguela aquí:

4. Plantilla de Squarespace «Rise and Shine»

Rise & Shine es una plantilla de Squarespace Fluid Engine estratégica, colorida y elegante, diseñada para empresas de servicios, coaches y consultores. Es perfecta para empresarios creativos que quieran causar una buena impresión en Internet, vender descargas digitales o mostrar un portafolio de trabajos. Descubre Rise & Shine aquí:

5. Plantilla de Squarespace para chef privado

La plantilla «Private Chef» está diseñada para chefs privados, nutricionistas y profesionales de la salud que deseen crear una experiencia web atractiva y personalizada. Con secciones coloridas, imágenes superpuestas y mucho espacio para contar tu historia, esta plantilla te ayuda a darle personalidad a tu profesión. Personalízala aquí:

6. Plantilla de Squarespace para nutricionistas

Nutritionista es una plantilla minimalista de Squarespace dirigida a profesionales del sector de la salud y el bienestar. Sus líneas limpias, sus espacios luminosos para las imágenes y sus menús son ideales para nutricionistas, chefs personales y otros negocios basados en la prestación de servicios. Creada con el motor Fluid de Squarespace, se puede editar fácilmente para adaptarla a tu imagen de marca y a tu negocio. Descubre Nutritionista aquí:

7. Plantilla para un blog y servicios sobre nutrición

La plantilla «Nutrición» es perfecta para nutricionistas que quieran publicar entradas de blog sobre cómo llevar un estilo de vida saludable, dietas y cuidados personales. Esta plantilla destaca por su capacidad para promocionar tus servicios de nutricionista ante los clientes e incluye un diseño de blog muy atractivo visualmente. Empieza a utilizar esta plantilla aquí

8. Plantilla «Pomelo» para Squarespace

Pomelo presenta una paleta de colores cálidos en tonos melocotón y un diseño moderno para que los visitantes de tu página web se sientan motivados y llenos de energía. Ideal para nutricionistas, naturópatas u otras empresas dedicadas al bienestar holístico, Pomelo está disponible en dos versiones: Starter (6 páginas) y Pro (13 páginas). Echa un vistazo a Pomelo aquí:

Tu página web es una parte esencial de tu negocio como nutricionista. Al aprovechar las plantillas de terceros de Squarespace, puedes crear una página web atractiva y funcional que te ayude a destacar frente a la competencia. Tanto si eres entrenador personal, asesor de salud o nutricionista, estas plantillas ofrecen una amplia gama de funciones y diseños que se adaptan a tus necesidades específicas. ¡Anímate a aprovechar todo el potencial de las plantillas de terceros y observa cómo crece tu presencia en Internet!

Las 7 mejores plantillas de Squarespace para diseño de interiores en 2024

Los diseñadores de interiores son expertos en crear espacios visualmente atractivos mediante el equilibrio entre diversos elementos, y contar con una plantilla web igualmente impresionante es esencial para mostrar su trabajo y atraer a nuevos clientes. Squarespace es una plataforma ideal para que los diseñadores de interiores creen su página web, ya que ofrece una gran variedad de plantillas y funciones que se adaptan a sus necesidades específicas. En este artículo, analizaremos las mejores plantillas de Squarespace para diseñadores de interiores, así como opciones de terceros como Adobe y Byron Bay.

1. Utica

Utica es una plantilla de Squarespace 7.1 ideal para profesionales que buscan una página web limpia y elegante en la que mostrar su trabajo. Cuenta con una imagen de cabecera de gran tamaño, lo que permite a los diseñadores crear un impacto visual potente, seguida de una sección de portfolio para mostrar proyectos recientes. El diseño minimalista y las funciones personalizables de Utica la convierten en una opción excelente para los diseñadores de interiores que desean una página web profesional y fácil de usar.

2. Bergen

Bergen es otra plantilla de Squarespace 7.1 que ofrece un diseño elegante y refinado para diseñadores de interiores. Permite a los diseñadores destacar su trabajo en la página de inicio, de modo que cada proyecto sirva de enlace a una página específica con más información. El diseño limpio y la navegación sencilla de Bergen la convierten en una plantilla ideal para los diseñadores que desean mostrar su versatilidad y experiencia.

3. Puertas

Gates es una plantilla de Squarespace 7.1 que pone el foco en el portafolio de un diseñador de interiores, permitiéndole mostrar una amplia variedad de estilos y estéticas. La página de inicio presenta un diseño en forma de cuadrícula con imágenes de proyectos, con la opción de hacer clic en cada foto para ampliarla y verla mejor. Esta plantilla es perfecta para diseñadores que quieran destacar su capacidad para crear espacios diversos y únicos para sus clientes.

4. Artesia

La plantilla «Artesia» de Squarespace, que forma parte de la exquisita gama «York» junto con las plantillas «Lange», «Harris» y «Shibori», ofrece una plataforma singular y creativa, ideal para una página web de diseño de interiores.

La plantilla Artesia incluye una página de inicio atractiva que ofrece a los visitantes una visión general inmediata de todas tus páginas web. Atrae aún más a los usuarios hacia tus trabajos de diseño y tus fuentes de inspiración mediante banners en los que se puede hacer clic o una cuadrícula de miniaturas. Sus diseños personalizables para la página de proyectos te permiten destacar tu portafolio de diseño de forma organizada, con imágenes, títulos y pies de foto.

La plantilla Artesia cuenta con un conjunto de funciones modernas, como efectos de desplazamiento y animaciones de aparición y desaparición progresivas para tus bloques de imágenes. Aprovecha al máximo las imágenes a todo el ancho que mantienen la integridad de tu contenido subido y mejora tu narrativa visual añadiendo bloques de texto sobre las imágenes.

Desde la personalización de las cabeceras hasta la integración de imágenes de banner y vídeos en cualquiera de tus páginas, la plantilla «Artesia» de Squarespace es una opción ideal para crear una presencia online profesional dedicada al diseño de interiores. Las animaciones de las páginas aportan además un toque dinámico a tus galerías, lo que capta la atención de tu público mientras explora tus proyectos de diseño.

Aprovecha las características elegantes y modernas de la plantilla Artesia de Squarespace para mostrar tus trabajos de diseño de interiores con elegancia y fluidez. Nuestros expertos de Strategy Driven Marketing están listos para ayudarte en este proceso. ¡Ponte en contacto con nosotros hoy mismo!

5. Palermo

Palermo está diseñado para crear impresionantes páginas web que sirvan de escaparate para el diseño de interiores. Tanto si eres un decorador autónomo como si diriges una gran agencia de diseño, solo tienes que sustituir el portafolio visual y los detalles por los tuyos propios, y cambiar el botón «Solicitar ahora» por uno que diga «Reservar una consulta» o «Contacta con nosotros» y que enlace con tu método de comunicación preferido.

Si estás gestionando varios proyectos de diseño de interiores, quizá te interese incluso crear una página de inicio independiente que incluya enlaces a las distintas galerías del portafolio de cada proyecto.

6. Abode, de Studio Mesa

Abode es una elegante plantilla de Squarespace 7.1 creada por Studio Mesa, diseñada específicamente para diseñadores de interiores. Incluye cinco páginas listas para su publicación, una biblioteca de código CSS (MesaOS), un manual de la plantilla y una licencia de uso ilimitado. La plantilla presenta un diseño limpio y moderno, con secciones personalizables para mostrar proyectos, presentar a los miembros del equipo y destacar los servicios. Abode es una excelente opción para los diseñadores que buscan una plantilla de terceros que ofrezca un aspecto único y profesional.

Precio: 295 dólares

7. Byron Bay, de The Coast Kit

Byron Bay es una plantilla de Squarespace 7.1 versátil y visualmente atractiva, creada por The Coast Kit, ideal para diseñadores de interiores, fotógrafos y otros profesionales creativos. La plantilla ofrece una base neutra con un conjunto de páginas para compartir tu historia, presentar a tu equipo y mostrar tus servicios. Byron Bay cuenta con una galería para exhibir tu trabajo y una función de reservas para que los clientes puedan concertar citas con facilidad. El diseño de la plantilla incorpora elementos superpuestos y tamaños irregulares, lo que le confiere un aspecto distintivo y atrevido que la distingue del resto de plantillas.

Precio: unos 220 dólares estadounidenses

Squarespace ofrece una gran variedad de plantillas que se adaptan a las necesidades específicas de los diseñadores de interiores, lo que les permite crear páginas web impresionantes para mostrar su trabajo y atraer a nuevos clientes. Además de las plantillas de Squarespace mencionadas anteriormente, existen opciones de terceros, como Abode y Byron Bay, que ofrecen aún más posibilidades de personalización y diseño. Si buscas más inspiración, echa un vistazo a este resumen de los mejores diseñadores de Squarespace, conocidos por crear sitios web con una imagen de marca magnífica. Al elegir la plantilla adecuada y personalizarla para que se adapte a su marca y estilo, los diseñadores de interiores pueden crear un sitio web que no solo tenga un aspecto fantástico, sino que también les ayude a hacer crecer su negocio.