5 tips para diseñar en Squarespace con el editor dinámico
Consejos para sacar partido al nuevo editor de Squarespace como si fueras profesional
La llegada del editor dinámico a Squarespace (fluid engine en inglés) aún es relativamente reciente. Algunos usuarios todavía no están convencidos de que esta nueva experiencia de diseño sea un cambio para mejor, sin embargo, prácticamente cada semana hay mejoras y nuevas funciones que añaden potencia y flexibilidad a la plataforma.
En mi opinión, no negaré que me parece que hay un par de áreas que aún requieren atención por parte del equipo técnico, pero también agradezco las nuevas posibilidades que han llegado.
Así que el día de hoy te traigo 5 tips para aprovechar toda esta nueva funcionalidad que te ofrece Squarespace para crear tu página web.
Marcas de tiempo:
00:00 Intro
01:07 Activar la cuadrícula para centrar los bloques de contenido
02:40 Ajustar vs rellenar fotos y botones
04:29 Llevar el contenido a las orillas de la sección
06:04 Superponer bloques
08:25 Recomendaciones para editar la vista móvil en Squarespace
10:22 Duplicar bloques
11:51 Seguir diseñando secciones con el editor clásico
1 Activar la cuadrícula
Una vez que comiences a editar las secciones dentro de tus páginas, asegúrate de activar la cuadrícula para centrar y ajustar el tamaño de los elementos.
Para ello haz click en la letra G de tu teclado una vez que te encuentres en el modo de edición (G por GRID de cuadrícula en inglés).
La cuadrícula te ofrecerá una referencia para la colocación y tamaño de cualquier bloque de contenido que quieras añadir a tu sección. Además también aparecerán líneas que te permitirán centrar los elementos.
2 Ajustar vs rellenar en imágenes y botones
Con el editor dinámico tenemos la posibilidad de elegir entre “ajustar” o “rellenar” una imagen y cada botón.
Esto quiere decir que el elemento puede:
Ajustarse a su tamaño y forma originales
Rellenar el contenedor que le hayamos asignado en la cuadrícula
No hay una opción mejor que la otra, todo depende de tu diseño. Recomiendo que pruebes qué funciona mejor en cada caso. No te olvides de revisar la vista móvil para determinar la mejor alternativa.
3 Quitar márgenes a una sección
Esta nueva función permite desaparecer los márgenes superior e inferior de una sección.
Por defecto, el editor dinámico nos permite llevar elementos a las orillas izquierda y derecha, por lo que sólo requieres activar está función si deseas eliminar el margen de arriba y de abajo en tu sección.
Para ello, dirígete a EDITAR SECCIÓN y bajo el apartado de SECCIÓN, deshabilita la palanca RELLENAR PANTALLA.
Quizá suena a poca cosa en palabras, sin embargo es muy útil en la práctica ya que abre muchas posibilidades para diseñar.
Con esta función puedes:
Crear layouts divididos
Simular efectos de “collage” entre una sección y otra
Agregar detalles en las orillas como divisores, formas o fotografías
Acercar una sección a la anterior o la siguiente
4 Bloque para agregar formas y superposición de elementos
Este tip es un 2 en 1 ya que, para presentarte el nuevo bloque de FORMAS de Squarespace también podemos hablar sobre la nueva posibilidad de colocar bloques de contenido uno arriba de otro.
Para agregar una forma, haz click en AGREGAR BLOQUE y busca FORMA. Aparecerá un rectángulo que luego podrás editar para darle la forma y color que desees.
Ahora que es posible super poner bloques, puedes usar las formas para añadir divertidos detalles al frente o detrás de tus imágenes, por ejemplo.
5 Optimizar el diseño móvil en Squarespace
El editor dinámico permite diseñar la vista móvil de forma independiente a la de escritorio. Esto nos ofrece mayor flexibilidad y también nos obliga a trabajar un poco más.
Siempre que diseñes una nueva sección o que edites una sección existente, asegúrate de revisar que todo luce como deseas en la vista móvil también. Squarespace colocará un puntito azul sobre el ícono móvil cuando detecte que haz realizado cambios en desktop que debes revisar en móvil.
Contempla la vista móvil en todo momento. El editor dinámico nos permite duplicar bloques o conjuntos de bloques, lo que facilita mucho diseñar listas, tablas de precios, o cualquier tipo layout que requiera la repetición de ciertos elementos.
Si vas a duplicar elementos, recomiendo que te asegures que el primer conjunto de bloques está optimizado para móvil antes de duplicar, de esta forma se duplicará el conjunto optimizado y no tendrás que reorganizar todo en la vista móvil una y otra vez.
Si no se entiende lo que escribo, recomiendo ver el video que acompaña este artículo a partir del minuto 8:25 aprox.
Facilítate la tarea de diseñar y elige tu plantilla Premium:
y recuerda:
#SéDiferenteHazLaDiferencia
