Transcripciones
1. Introducción: Oye, ahí la atención de Karen, co-creativa aquí en este curso, estaremos haciendo un sitio web de Squarespace completamente
personalizado. Así que si quieres el sitio web de
Squarespace, pero quieres que sea un
poco más pulido y
profesional y no solo una especie de diseño
de cortador de galletas que viene con algunos de
los contenidos de demostración Eso es squarespace tiene. Este curso será para ti. No tienes que
ser una persona avanzada del
sitio web para
poder hacer esto. Squarespace es
bastante fácil de usar y siempre y cuando
sepas a dónde ir para Personalizar ciertas cosas y cómo agregar ciertos
elementos propios. Definitivamente
podrás hacer esto. Te sugiero que
tengas tu copia y tus imágenes ya
seleccionadas para tu sitio. Y vamos a ir a
través de iniciar su cuenta de Squarespace,
agregar sus páginas, trabajar con el contenido de
demostración y personalizarlo todo
el camino a través algunas cosas muy básicas como código cambios para que puedas hacer el sitio web completamente personalizado. Te voy a llevar
por encima del hombro y mostrarte algunas opciones. Se trata de sitios web de Squarespace que son completamente personalizados. Normalmente sí empiezo
con un diseño de demostración, pero no me quedo con ellos. Entonces sí, déjame deshacerme de
mis imágenes. Está cortado. Por lo que de nuevo, este es para sitios de
peluquerías.
Tanmuy diferente. El primero fue ballet. Este es un entrenador de salud. Pero estos en realidad no se
parecen al
contenido dental en el que se basan porque están
completamente personalizados. Por lo que les voy a mostrar cómo hacer esto en el siguiente video. Una vez que
comencemos, configuraremos tu
cuenta de Squarespace y nos pondremos en marcha. De acuerdo, nos vemos ahí dentro.
2. Cómo comenzar un espacio: De acuerdo, así que aquí
estamos empezando en esta pequeña porción corta, te
voy a mostrar apenas cómo poner marcha
tu
cuenta de Squarespace. Vamos. Por
supuesto que vas a estar yendo a squarespace.com. De acuerdo, pasemos
a mi video aquí. Por lo que vas a querer
ya sea golpear empezar. Si aún no tienes
una cuenta de Squarespace. Eso solo te llevará directo
a este constructor de plantillas. Por mí, voy a hacer el inicio de sesión
y conocerte en esta porción. Por lo que estoy conectado. Mismo proceso, crear sitio web, plantilla
en blanco u
otra plantilla. Voy a pegarle a otra plantilla. Y ahora estoy de vuelta donde estás tú. Si le pegas a empezar, aquí es justo donde
elegirás una plantilla y de nuevo, estarás personalizado
en esto por completo. Entonces no te quedes demasiado colgado de ello. Simplemente escoge algo
que
sientes que es agradable y limpio. Si eso es lo que
vas a buscar o tiene un poco más de
personalidad, ellos quieren eso. Para que puedas ir a través y
navegar todo lo que quieras. Voy a seguir adelante. este con el que
quiero empezar. Entonces también tienes
vista previa si quieres
ver algo más de cerca. Pero de nuevo, se estará
personalizando esto por completo. Entonces no sientas que estás casada, tienes que
estar casada con ella. Yo sólo voy a
configurar el contenido de la demo. Por lo que este es el título de su sitio. Por lo general recomiendo que título de
su sitio sea
descriptivo de su negocio. Estoy haciendo esto para un cliente. De acuerdo. Y el Sur, puedes
cambiar esto más tarde también, así que no
te preocupes demasiado. Esto te llevará a través de
un tutorial muy rápido. Puedes pasar por esto rápidamente porque te estaré mostrando todo lo
que necesitas saber. De acuerdo, Así que ahora básicamente
tienes la configuración de tu sitio. En primer lugar, me gusta
entrar en marketing, SEO. Asegurémonos de
que el título se vea como tú quieres, ¿verdad? Y entonces eso es realmente todo. Tienes la configuración de tu sitio. Si quieres conectar
un dominio de inmediato, puedes hacerlo aquí y seguir los pasos para
obtener un dominio, o va a
significar que eres dueño? Pero aparte de eso, una vez que hagas clic
y
obtengas esa plantilla, vas a tener
tu sitio iniciado.
3. Cómo agregar páginas: De acuerdo, así
que si has visto alguno de mis otros tutoriales de sitio web, sabes que primero me
gusta empezar
creando todas las páginas de
mi sitio web. Esto me da la capacidad de
estilizar con precisión el
encabezado
y el pie de página y simplemente
moverme y personalizar todas mis
páginas con bastante rapidez. Entonces es sólo parte de mi proceso. No
tienes absolutamente que empezar aquí. Pero lo que sí vengo a nuestro sitio de
demostración aquí es otra vez, solo
sigo adelante y creo, me
aseguro de tener todas
las páginas que quiero. De manera que eso estará en
tu pestaña Páginas. Y tendrás
que asegurarte de tener todas las páginas. Entonces para mí, la página de inicio, está bien. En realidad voy
a borrar eso. No puedo salir de la página de inicio y
vamos a crear una nueva página de inicio. Y de nuevo, incluso empezar
con la maquetación. Empecemos con esto.
Estava a ser la página de
inicio como la página principal. Tú, este icono de engranaje
establecido como página de inicio. De acuerdo, entonces
necesito la página de una clase. Y quieres asegurarte de que todos estos no tienen que ser iguales. El título de la página es como aparece
la página aquí en el
título de navegación es como aparecerá en el menú de navegación. Y la babosa es lo
que escribirías. Y luego necesito mi página about. Voy a llamar a la facultad. Aquí es donde puede ser
útil ya tipo de tenía su café mapeado para que
sepa exactamente lo que necesita. Servicios. Voy a tener esto
sean clases particulares. Y a medida que edites estos, notarás que
los pequeños bads de demostración que aparece a continuación de cada
página desaparecerán. Tienes un nombre de dos palabras. Lo mejor es separarlo con guiones. Yo sólo voy a seguir adelante
y borrar todo
esto de conducta aquí arriba. Y yo sólo voy a hacer esto. Eso se mantiene unido. Demo fuera de ahí. Necesito otra página, que mencioné que
no voy a hacer todavía. Entonces para mí, si necesito
agregar estas cosas para ir en la misma carpeta. Perdón, esa no era la
carpeta de la carpeta de aquí abajo. Por lo que ahora estas cosas que
verás están en un desplegable. Ese es mi contacto
no está vinculado porque contextualiza el botón
Te mostraré cómo
deletrear eso en la porción de
encabezado. Pero esencialmente
escuchando crear. Lo siguiente que necesito
es un calendario de eventos. Entonces esa va a ser
una página de calendario. Eventos que serán un poco diferentes. No lo quiero. De acuerdo, entonces
ese es el orden que quiero. De acuerdo, así que aquí tenemos
nuestras páginas. Repasaremos y personalizaremos
cada uno de ellos uno por uno, comenzando en el siguiente video.
4. Estilo de actualización (fuentes y colores): Entonces, antes de ir a editar
las páginas individuales, hay algunos lugares
donde puedes agregar cambios de texto, cambios color y todo eso
en tu sitio web de Squarespace. Entonces te llevo al editor de estilos y te lo muestro. Porque en nuestro Squarespace, llegamos al diseño de la página. De nuevo, eso es solo la
pestaña Diseño y los estilos de insights. Y aquí es donde puedes hacer tus elecciones de fuente y color. Voy a seguir adelante y
agarrar mi paleta de colores. Entonces si tenemos dos colores, verás esta paleta aquí. Puedes agregar tus propios
colores según sea necesario. ¿ De acuerdo? Entonces si en la paleta
en los colores. Entonces espera,
probablemente vas a querer quedarte para que
tengamos blanco aquí. Ray, quiero hacer que un
poco más gris arrastre eso. Haz esto, así que es
un poco, de acuerdo. Y luego estoy agarrando
un código de color de un tipo que no está en mi pantalla. Entonces si selecciono éste, ¿quieres cambiar el código? Sólo tienes uno. Sí. Entonces entonces probablemente
querrás
dejar uno de tus colores como negro,
también negro o un azul marino
o un gris oscuro. Algo para ver F7 para IED. Seguro por qué eso
no está cambiando para ser el color que yo quiero que sea. O por esto. Entonces si algo
no está funcionando bien, asegúrate de ti, si
lo escribiste. Entonces ahora estos son los
colores que quiero. Entonces cuando vayamos a las fuentes, voy a hacer una pausa por un minuto
mientras miro mis fuentes. De acuerdo, así que cuando estamos
en la sección de fuentes, puedes ver que
tenemos opciones para cambiar los encabezados y párrafos
y luego misceláneos. Así que voy a seleccionar encabezados,
familia, y luego
navegar por todas las fuentes. También puedes escribir una fuente si
sabes lo que buscas. Pro puede bailar. De acuerdo, y puedes cambiar los tamaños de diferentes
fuentes, encabezados. No te preocupes si
no ves tu fuente. Aquí, puedes saltar adelante. Existe una guía de código CSS para agregar
fuentes personalizadas a su sitio web. Pero por ahora vamos
a proceder con esto. Por lo que si encuentras tus fuentes aquí,
puedes seguir adelante con esto. Si no, puedes saltar adelante. Entonces párrafos, lo mismo. Y los botones tienen su
propia fuente también. Decir estándar para esa. Y asegúrate de que si quieres
que sea igual en todos tus tipos de botones por los que
pasas y seleccionas. Entonces miscelánea. También voy a
hacer un Myriad Pro. Muy bien, así que ahora hemos ido adelante y hemos ajustado todas nuestras fuentes y nuestros colores. De nuevo, si necesitabas
agregar una fuente personalizada, puedes seguir adelante y hacer eso. Y verás dos cuando
estés aquí en el editor. Si selecciona, también tiene
la opción de seleccionar un color diferente o
agregar un color personalizado. Por lo que sí tienes más opciones más
allá de esos colores. Pero por el bien de ello en realidad es por
velocidad y eficiencia. Sí quieres asegurarte de tener un blanco y otro negro, gris oscuro. Blanco para fondos,
negro gris oscuro para fuentes. Y sí me suele gustar
tener un color más claro. Yo soy como este gris
o este marrón. Para que así tengas otras
opciones como colores de fondo. De acuerdo, así que esa es solo
tu sección de editor de estilo. A continuación, antes de ir a
cada página individualmente, haremos nuestro encabezado
y nuestros pies de página. Así que mantente atento y salta la siguiente lección en para
saber cómo personalizarlos.
5. Cómo editar formato: De acuerdo, entonces ahora que hemos agregado
nuestros colores y nuestras fuentes, el siguiente paso es seguir
adelante y darle estilo al encabezado. Te llevaré a
ver eso ahora mismo. De acuerdo, así que
vamos a venir aquí a darle estilo al encabezado. Parecía ir a cualquier página
que tenga el encabezado en ella, que deberían ser todas
ellas en este punto. Por lo que sólo tienes que seguir adelante y
pulsa Editar, Editar encabezado del sitio. Y luego aquí,
título del sitio y logo. Aquí es donde
puedes agregar tu logo. Y aquí se puede
ajustar la altura. Y luego aquí
tenemos algunas opciones de lo que se quiere mostrar. Entonces, ¿por qué no quieres
el botón aquí o no? Entonces si no quieres que
el botón diga esto, y entonces el estilo está ahí. Aquí tienes algunas opciones
diferentes. Y sí tengo un
video que entra en estos con mucho mayor detalle. Pero esto es sólido, en cuyo caso solo tienes que
elegir el color de fondo y navegación. Esto es útil si
quieres usar algo
diferente a tu paleta de
colores, de
lo contrario, el tema sería
con tu paleta de colores. Entonces ya ves que puedo elegir cualquier cosa
que sea parte de mi paleta de colores. Si tu logotipo no está sobre un fondo
transparente, vas a querer
asegurarte de que esté en blanco. De lo contrario, tener un logotipo
de fondo transparente soluciona ese problema con bastante rapidez. Entonces esas son tus opciones ahí. Entonces esto es déjame hacerlo. Entonces ahí es donde no lo
hace básico. A ver ahora aquí. Cómo posición fija. Entonces ahora vamos niña, no
quiero
meterme en pergamino conmigo. Un segundo aquí. De
acuerdo, entonces esa opción es, simplemente no se muestra cuando
estás en el modo de edición, sino para el encabezado fijo básico. Por lo tanto, la posición fija significa que el encabezado va a
aparecer mientras te desplazas. Posición fija está en
si golpeamos etcétera, venta básica, eso
se ve así. Donde se queda en su lugar. O si editamos el encabezado del sitio y lo
tenemos se desplazará hacia atrás. Esto solo crea un
pequeño efecto donde en realidad no vemos tanto
el encabezado. Entonces mientras me desplazo, lo
veo un poco desaparece. ¿ De acuerdo? Entonces, si tienes tu logo y todos están contentos
con todo eso, lo siguiente que tal vez quieras
hacer es si este botón, parece extra enorme,
lo
cual sí lo hace. Por lo que da clic en él, lo hará. Entonces ese es el ancho,
la altura que me preocupa. Ahí otra vez. Esto es para botones primarios, botones
secundarios que
podrías tener que hacer. Entonces esto es jugar un botón
secundario. Eso en realidad es botón muy
terciario. A ver. Esa no es
sólo tu página de botones. No es editar esto. De acuerdo, pero eso
hace que nuestros botones más pequeños aquí arriba. Y
eso es lo que quiero hacer. Alguien le pegó a Save. Si quieres que ese botón
sea de un color diferente. También puedes tener, lo siento. Aquí es donde tenemos
esta opción de enlaces sociales. Opción para poder
cambiar al idioma. Se puede habilitar que si
tiene una historia podría querer mostrar el carrito. Aquí. En realidad voy a
cambiar ese estilo a sólido. Y que me va a dar las opciones
para cambiar el botón. Eso no me da la
opción. Entonces se llega al tema. Error con el último, pero voy a venir
aquí, dale a guardar para esto. Estilos de sitio, colores, el
más reciente, seleccione el más reciente. Aquí me da el botón. Aquí. Si quiero
cambiar el color del botón, puedo hacer un color personalizado o
puedo seleccionar de mi paleta. A ver qué me gusta más. Ese me gusta
más. Paleta de nuevo. Muy bien, así es
como
cambiarías el color de tu botón. Entonces el encabezado se
ve bastante bien. Si revisas la guía de código CSS
personalizado, verás opciones. Personalmente quisiera
que quitaran el subrayado de estos, así que lo haremos
hacia el final. Pero si quieres seguir
adelante y hacer eso ahora, puedes localizar la guía CSS para hacerlo y saltar
a esa sección. De lo contrario, en el
siguiente video
lo haremos con el pie
de página de la web, que está aquí abajo.
6. Diseño de pie de estilo: Por lo que a continuación vamos a hacer con el pie de página de su sitio web. Y la razón por la que hacemos primero el
encabezado y el pie de página es porque están en cada
página de su sitio web. Y de esta manera a medida que vayas
y estiles tu sitio web, el cuerpo real de la página, podrás ver que todo coincide con el
encabezado y el pie de página. Entonces vamos a hacer eso. Puerta tan exigente en el fondo. De acuerdo, así que aquí está el aleteo, dependiendo del tipo de plantilla de
demostración que haya seleccionado. Esto puede parecer muy diferente, pero no demasiado preocupado. Para que puedas entrar y
cambiarlo todo. Así que de nuevo, solo vas a ir a cualquier página que
tenga el desenfoque en ella, pulsa Editar, pie de página. Y aquí tenemos las mismas
opciones que
tendríamos en cualquiera de las secciones de la
página. El encabezado es un poco
diferente en la foto de esa manera, pero este es similar a
todas las demás secciones de la página. Por lo que sólo hay que hacer
es editar sección. Si quieres cambiar
el color de fondo. Aquí. Prefiero que sea
esto. Yo puedo hacer esto. Yo creo que sí. Eso puede ser un poco genial. Yo quiero probar este sin embargo. Entonces este contenido depende de ti lo que quieras
tener mostrando. Entonces voy a seguir adelante y
agregar el nombre de la empresa aquí. Espacio. Por lo que también tienen su
dirección y el pie de página. A ellos les gusta tener. Aquí abajo. Si deseas iconos de redes
sociales, puedes poner eso en cualquier lugar. Eso sería añadiendo
un bloque, vínculos sociales. Y una especie de clic y arrastra. Esta es una característica muy nueva. Entonces me voy a ver
funky con él yo mismo. Pero básicamente son
el tipo de opción de cuadrícula. Eres un poco genial. Esa caja azul
es donde va a terminar. Squarespace acaba de lanzar esto y realmente no soy
tanto fan, pero aquí no hay dos. Perfecto. Muy bien, Ahí tienes. Entonces si quieren el layout, el diseño, quieren que
sean, correcto. Deberían ponerlos aquí debajo. ¿ De acuerdo? Para que puedas ver cuando
puedes arrastrar algo, esos cuadrados aparecen y eso te
permite mover
las cosas un poco más con gracia de lo que solía ser posible en el antiguo editor de
Squarespace. Aquí queremos enlaces rápidos. Aquí. En realidad, aquí voy
a seguir adelante. Y aquí va a ser esto, ya verán si yo hice eso. Tenía este enorme espacio. Así que pulsa enter. Si haces Shift Enter o creo que creo
Command Enter en una Mac, obtendrás menos espacio. Por lo que actuaciones. ¿ Qué más quiero? Hagamos recitales, eventos
especiales. Y si necesito
hacer esto más pequeño, hice que quiera
estar en una caja fresca. Muy bien. Entonces eso es bueno para mí. También puedes agregar una
imagen si quieres decir agrega una
versión de logotipo a tu sitio. Por lo que de nuevo,
solo darías clic y arrastrarías eso a donde lo desees. Esa caja azul
es donde va a terminar. Entonces mira aquí que es yo no
necesito eso ahí sin embargo, pero si quieres seguir
adelante y quedarte con eso, podrías quitar ese bloque. De lo contrario,
voy a seguir adelante y decir que esta sección está hecha. Entonces para hacer eso, Hecho Guardar. De acuerdo, así que ahora nuestro
pie de página está hecho.
7. Básicos de motor fluido (constructor): De acuerdo, así que ahora que hemos resuelto nuestro encabezado y pie de página, vamos a entrar en algunos conceptos básicos de
Squarespace cómo crear cambios de página
y hacer ediciones. Hay un nuevo constructor llamado motor
fluido dentro de
Squarespace Seven 0.1. Entonces las cosas pueden verse diferentes
a la última vez que hiciste un sitio de Squarespace o
miraste el tutorial de squarespace. Te voy a enseñar, a
tirarte por encima de mi hombro, y a mostrarte de qué
estoy hablando. Entonces, para editar cualquier página, van a venir
aquí y hacer clic en editar. Puedes editar la vista
de escritorio o móvil. Y el nuevo constructor ha
hecho algunos cambios para que realmente
puedas editar las cosas por separado para
que las cosas puedan ser más receptivas si sigues
adelante y editas. Entonces aquí, al igual que la sección de
pie de página, tenemos editar cada
sección o agregar bloques. Entonces si agrego un bloque, lo que quiero agregar
más texto a esto, se
puede ver las imágenes de
fondo. Es un poco más difícil,
pero a donde me estoy moviendo, ese rectángulo azul es
donde va a ir. Ahora ya está aquí el texto. Entonces así es como
agregarías cualquier elemento. Y se puede ver que hay un montón de cosas
diferentes. Imagen, botón, video, texto, editar el fondo de una sección que está en
la configuración de la sección. Entonces, si no quieres una foto
sino solo un fondo, ya sea un fondo
blanco o un fondo de color diferente, eliminarías la imagen. Y quiero cambiar esta combinación de
colores que puedes seleccionar de tu paleta. Así. Estos
fondos de colores también tendrán un
efecto de superposición diferente en las imágenes. Entonces esto probablemente
tendrá un
efecto diferente en una imagen, luego otra diferente. Por lo que me dieron un add una imagen que puedes subir desde tu computadora. Si necesita usar fotografía de
stock, puede navegar por imágenes
de stock de sus bibliotecas es
si tiene una imagen
que desea utilizar varios
lugares en su sitio, puede seleccionarla
de la biblioteca. No adelante y navegar por las imágenes
de stock. Yo sí tengo fotos para el sitio, pero porque sus hijos
y otorga clases y mientras se han liberado para estar en la página web que me he dado
a conocer en el curso. Voy a usar
fotografía de stock, hacer el curso. Por lo que se puede ver aquí, este círculo dicta el foco de la imagen. Entonces si lo muevo hacia arriba,
será un poco mejor, más para que no le corten la cara. Entonces, si haces clic hacia fuera,
eso hará esto. Otra cosa a tener en cuenta, también
puedes hacer
inserción que crea más espacios en blanco
alrededor de las imágenes. Entonces eso me gusta. Déjalo sangrar por completo. Esto es un poco difícil de leer. Voy a seguir adelante
y deshacerme de eso. Deshazte del botón, y borra cualquier cosa que esté
haciendo clic, elimínalo. Y me meteré en más tipo
de conceptos básicos de diseño de página de inicio. El alineamiento, la altura
es, esto se mantendrá grande. Esto es sólo una gran cantidad de
contenido arriba, el medio. Della lo quiere en el medio. Pero debido a que
todavía no está centrado, parte de eso es que solo
necesito hacer clic y arrastrar. Así que ahora haz clic, mantén pulsado, arrastra. Ahora está mucho más centrado. Los colores son un poco duros, así que voy a ver si
puedo cambiar eso. Eso sigue siendo difícil. Pero se puede ver que no estoy
cambiando la imagen de fondo, pero si solo cambio,
esto sí cambia. Entonces eso es un poco más fácil. De acuerdo, así que eso es una especie
de tus antecedentes. A pesar de que esa es
la sección de encabezado, ese mismo proceso se aplicará
a cualquier otra sección. Textos que en su mayoría
solo puedes editar en una página. Entonces si quería
borrar algo de esto y copiar y pegar mi copia
y puedo hacer eso. También puedo cambiar fácilmente. Entonces quiero que eso sea más pequeño. Esto para ser más grande. Entonces imagen, si selecciono esto, me
dará la opción
de reemplazarlo. Texto el botón. Si selecciono
esto, me dará la opción de
crear los enlaces. Si toco este icono de engranaje, puedo conectarlo inmediatamente
a otra página en el sitio. Esto es solo una visión general realmente
rápida de lo que estás dispuesto
a prestar atención
es a lo que este nuevo constructor.
Tenemosun montón de. Dejadme ir para allá. Sí. Para que pueda poner texto sobre una imagen. Pero tengo mucha más
agilidad con el nuevo constructor en cuanto a colocar artículos. Entonces si quiero hacer esto, también
puedo asegurarme de que
no pase por encima de esta imagen. Asegúrate de que esto esté
más cerca de esto. Entonces hago clic y arrastro hace que
las cosas sean mucho más flexibles. Nuevamente, si esto es demasiado, usted mucha más flexibilidad
con el nuevo constructor. Pero recuerda el clic y arrastra. Están colocando una imagen
como fondo. Esas son realmente las
notas altas de estas secciones. Voy a entrar en algunas de las cosas
más específicas como suscripciones a
boletines
y formularios de contacto en un video posterior en el curso. Pero por ahora esa es una especie de tu recorrido rápido
de cómo usar lo nuevo. Ya que se llama motor fluido, el nuevo constructor de Squarespace. Entonces aquí está.
Sí, motor fluido. De acuerdo, el siguiente, voy a repasar la página de inicio
algunos diseños básicos y empezar
a construir esta página. Haré lo mismo para una página sobre y
una página de servicios. Solo para que puedas ver algunas prácticas
diferentes y mejores prácticas para construir esas páginas
importantes en tu sitio web.
8. Sobre conceptos básicos: De acuerdo, así que ahora
vamos a
entrar rápidamente en tu página Acerca de y te
mostraré algún tipo
de consejos de diseño para eso. Si estoy en el sitio web de
Squarespace, que este, la
página Acerca de es la página de la facultad. Entonces lo he renombrado. Pero si lo miras, esta
es una de esas plantillas. Es algo así, no
sé quién pensó que
este era un buen diseño. Esta imagen está todo el
camino por el medio de la nada. Hay una gran cantidad de inmuebles
sin usar, que a veces es agradable
porque le da al IRS, pero a veces simplemente no es útil. Entonces si tuviéramos que usar esto, una cosa creo que podrías hacer si no tuvieras un diseño como este. Para que puedas mover
esta imagen aquí arriba. Porque así, para que
pueda llegar a esto. Yo quiero sacar
adelante este texto. Entonces eso es esto. Por lo que ahora está en la imagen. Mueve un poco esto hacia atrás. Pero eso lo voy a
hacer más pequeño. Demasiado pequeño porque
ahora ahí vas. Entonces si eres una empresa
que solo necesitaba un simple, apenas sobre quiénes somos un poco de tu declaración de
misión. Este es un layout que
podría funcionar para ti. Por supuesto
querrías matar algo de este
espacio extra en blanco en la parte inferior. Para el sitio del vientre. Para el vientre, digamos, en realidad
vamos a tener un montón de gente
diferente. Entonces esto sería
como instructor uno. Si necesitáramos
tener más de ellos, podríamos estar buscando en
Sección hacer de esta sección un color de fondo diferente para alternar instructor de
análisis. Para obtener esa sección. Instructor. Tres. Va a ser una buena
manera de diseñar todas las
diferentes estructuras. Si tienes más de
una práctica de coaching, no
puedo mostrarte mi
página about en Skillshare, pero este es un redactor
en amigo mío. Entonces lo que hace es de nuevo, presenta quién es y quiere ser muy agradable. Entonces ella tiene este tipo
de puntos de conexión. Y luego presenta
al redactor. Y luego básicamente ha usado
su About page para compartir por qué sus servicios
son diferentes. Y tiene una historia sobre cómo podrías pagarle mucho
dinero
a alguien por copia o si
eres negocios nuevos, va a cambiar,
las cosas van a cambiar. Por lo que tiene una
filosofía diferente detrás de su copia. Entonces ella está
hablando de la filosofía. Por lo que su About page realmente
está trabajando para decir por qué es diferente. Cosa que ella tiene aquí. Él o ella tiene que
conseguir mis servicios. El punto entero
de la página about es realmente construir confianza en ti para luego ir a comprar
tu producto o servicios. Entonces ella está dando la opción aquí. Y este es un
sitio de Squarespace que ella también sí tiene lo que tiene conexión llamados puntos de
conexión. Y ella metió esto mientras
hacía esta gráfica en la que usa. Pero podrías hacer algo
similar en Canva para hacer un gráfico y poner eso ahí para hacer una especie
de puntos de conexión. Esa es una solución alternativa. Pero entonces ella tiene esta historia más larga. Por lo que quieres tener una página
sobre esta larga. Es esta una idea de cómo
realmente puedes usar tu página about para trabajar en apoyar
tus servicios. De lo contrario, sugeriría
mantenerlo corto y sencillo. Explicando una especie de lo
que te hace diferente? ¿ Qué hace que tu
producto sea diferente? ¿ Qué hace diferente a tu
empresa? Y luego
superarlos y agregar un botón a tu página de servicios. Entonces para hacer ese botón de bloque de anuncios. Entonces tendríamos un botón para
cada uno de estos que es como
ver ver clases, porque esperamos
que ahora hayan aprendido lo suficiente sobre esta persona
como instructor. Querían las
clases que imparten. Por lo que la página Acerca de
realmente está destinada a hacer que la gente
llegue a la página de servicios. De acuerdo, y de eso es de lo que
vamos a hablar a continuación.
9. Espacio cuadrado 8: De acuerdo, así que ahora estamos en
la sección Homepage. Aquí es donde pasaremos por algunas de estas secciones que su página de inicio podría
querer tener. Esto se basa apenas hecho tipo de principios de conversión
y experiencia del usuario. Entonces te llevaré por encima
del hombro y haré algunas cosas. Entonces estamos de vuelta en
nuestra página de inicio de demostración. Una opción de diseño común es esta imagen de héroe o banner
en la parte superior de la página de inicio. Esto es llamarlo el tercio superior. Está destinado a captar la atención de
tus espectadores. Por lo que para este propósito
de este sitio, es una compañía de danza y
ofrecen clases de ballet. Entonces básicamente queremos decirle a la
gente que se trata de ballet. Entonces tenemos aquí una imagen
que habla de eso. Si no tienes un
negocio que necesite un negocio
tan fuerte o si no tiene algo que
sea
muy visualmente representativo
del negocio,
la imagen de héroe puede no
ser en realidad la mejor cosa para
poner en el tercio superior, en su lugar
desee poner
algunos textos de guía por encima de él. Y ya ves que
puedes agregar una sección encima de esto realmente fácilmente. Puedes hacer una sección en blanco o algo así
es una buena opción. El texto aquí
va a destacar, sobre todo quien hizo esta
imagen un poco más corta, lo cual creo que puedo hacer con
el nuevo constructor así. Entonces si tuviéramos
algo como esto, esta pequeña
flecha azul nos ayudará a almacenar en esta sección. Me pregunto si tengo que conseguir la altura que
tienen este espacio en blanco. Acabamos de llegar a hacer clic y arrastrar todo y drogas más cerca. Entonces para acortar esto es, este no es exactamente
el estilo de invocación de un sitio web teniendo esto aquí
arriba en lugar de esto. Pero si no tienes una representación visual muy
buena, sí
tienes la opción de
seguir teniendo una imagen aquí. Pero ya sabes, en
realidad no ha abarcado lo que hace tu negocio. Esta podría ser una mejor manera de
ir porque este texto siempre
es querer
destacar más que este texto. E incluso podemos
hacer esto más pequeño. De esta manera entramos en la
siguiente sección rápidamente. Entonces esto es algo que
sí animo a la gente a hacer. No siempre tienes que
hacer lo que está en estilo. Pensarás en lo que es más efectivo para transmitir
tu mensaje, todo cuando estamos
hablando de los inmuebles en la sección superior de tu sitio web. En realidad voy a
mover esta sección hacia abajo. Ya que esto funciona. Voy a poner logo aquí en lugar de este texto. Aquí es donde quiero
tomar una imagen. Esto es algo bonito
y hace que sea realmente fácil poner una imagen
encima de una imagen. ¿ De acuerdo? Entonces dependiendo de lo que
decidas hacer para no, estás tratando de hacer en términos de tener una
opción como esta o una opción como esta en
la parte superior de tu sitio. Lo siguiente que quieres
hacer es realmente darle a la gente una descripción concisa
de lo que haces. Entonces aquí
tengo y otra vez, incluso copia y pega
esto de tu doc. Tienes algunos pares. Esto me lo pregunto tan mal. Esa es la capitalización aquí. Aquí arriba y pega. Esto es que nos dice exactamente
cuál es el negocio. Sección de texto se ve bastante grande. Voy a hacerlo pequeño. Y también en realidad
darle un color. ¿Verdad? A esto se le conoce
tan pequeño como quiero que sea. Entonces si golpeas esta altura, en realidad
puedes espacios en blanco. Retire esa sección.
Enrealidad, voy a editar la sección
de fondo de esta a esta. Entonces aquí podría tener una descripción y subir un archivo esta vez
desde mi computadora. Aquí vemos este texto
ahora difícil de leer, así que sólo voy
adelante y hago esto. Aquí. Vamos a hacer algo el botón. ver si quiero hacer
esta alineación correcta. Es un poco genial. Puedo
cambiar esto por aquí. En realidad sí tengo una
cotización en sus sitios. Voy a usar esta sección. Este es un gran ejemplo
de cómo puedes reutilizar. Entonces este es un fondo
que está insertado. Entonces voy a
reemplazarlo en la biblioteca. Voy a
reemplazarlo de mi computadora. También puedes hacer más superposición, lo que ayudará a que ese texto aparezca. Creo que
vamos a hacer esta. Muy bien. Y así nuestra cotización
es Josephine Baker. De acuerdo, aquí en
tu página de inicio de nuevo, este texto está destinado a
lo que sea sucinto Ejemplo que me suele gustar ser
la sección Acerca de. Entonces esto es realmente como, ok, quiénes somos en pocas palabras, esto justo debajo del héroe
o tercera sección superior, entonces podemos tener
más de un sobre. Entonces esta es nuestra misión. Nosotros profundizamos en eso.
Voya limpiar este texto. Pero por el bien de solo mostrarte un
tutorial para los diseños, no
me voy a meter demasiado en las malas hierbas y personalizar esto. Pero tener una
sección Acerca de a continuación. Y aquí está esto. Un poco de personalidad
es totalmente opcional. Lo siguiente que
normalmente quieres tener en una página de inicio es una sección de
servicios. Esto es lo que llamamos un poste de señalización. Es sólo una especie de dar a la gente una manera de llegar a diferentes
partes de su sitio fácilmente. Yo busco,
voy a elegir. Esta. Puede editar sección está mirando
las diferentes aplicaciones,
diferentes colores. Decide lo que quiero hacer aquí. No voy a hacer eso. Entonces tal vez sí quiero que
esto sea blanco. Entonces aquí edita contenido, puedes decir que no puedo
editar este título, Eso
es porque está aquí. El título. Entonces necesitamos algo
para cada uno de estos. Por lo que el título de esta
pequeña sección, campamentos de
verano e intensivos. Y luego tenemos la
opción de un botón. Pondrías el enlace real aquí si estás listo para
poner eso en alguna parte. Perdón. Y luego para editar la imagen, harías esto. Entonces voy a reemplazar que para estas secciones en realidad
va a
ser importante que todas las imágenes sean
del mismo tamaño. Así que quieres
asegurarte de recortarlos
al mismo tamaño o relación de aspecto
antes de ponerlos. Muy bien, entonces epsilon
max sale demasiado pronto. Entonces iremos la siguiente. Y no me gusta hacer demasiado mientras se está cargando porque
he tenido que pasar donde como pierde este tren del pensamiento si le
das demasiado que
hacer y entonces la
imagen no se carga. Entonces pondrías ahí un enlace. O puedes cambiar el
título del texto del botón. Y luego nuestra tercera opción, sólo porque es del mismo tamaño. Y de nuevo, solo estoy
usando fotos de stock para poner esto en marcha. Pero así es como
haríamos la lista y sí
recomiendo esta es
una característica agradable, mantiene todo bien alineado
y todo se apilar muy bien en el móvil. Por lo que sí sugiero usar la función de lista para
crear este tipo de secciones de señales
en su sitio web. Fue mi lugar de título, no justo. Ahora tenemos nuestra sección de
señales. Así que ese es un buen tipo
de diseño general, muy limpio y
accesible
que es fácil para las personas naveguen y lleguen
a donde necesitan ir. De nuevo, este botón iría a una página Acerca de más grande típicamente. Entonces estos botones
harán que la gente llegue a las diferentes ofrendas. Ahí tienes el diseño de la
página principal.
10. Conceptos básicos de diseño de páginas: De acuerdo, así que ahora
vamos a hablar la página de servicios y aquí es donde la
gente va a ir para ver todos tus
servicios o esta será
la página de ventas reales
donde todos compren. Entonces volvamos a
nuestro sitio de Squarespace. Sería más de la página de una clase. Aquí es donde se
quiere presentar. De esta manera, es algo genial. Es casi como una cartera. Aquí es donde es
posible que desee presentar sus diferentes opciones de clase. Entonces Aquí es donde podríamos
cambiar nuestras clases. Y luego un resumen. Escribe una línea por alguna razón. De acuerdo, así que este
sería tal vez el, así que esta es una sección de
nuevo es sólo la inserción. Entonces para editar esta foto, no
voy a pasar a un
segundo plano. Esperemos a que se cargue. Entonces aquí es donde
describirías el tipo de clase uno. Y debería ser para quién
es el servicio? Y entonces esto
sería aprender más. Por lo que es sección de edición.
Quieroeditar el botón. Y ahí es donde
aprenderían más sobre este servicio. Por lo que la siguiente página
sería una página de ventas más larga. Así que esta es una especie de una manera ordenada establecer un montón de clases
diferentes. También podrías volver atrás y usar esa sección de tipo lista que
habíamos usado anteriormente. Y si tus servicios
son los mismos, en realidad
no
puedes tener miedo. Es posible que tengas un poco
más de un lead
up, aquí arriba describiendo
tus servicios generales o estilo o enfoque. Pero en realidad podrías usar exactamente
los mismos servicios y hacer que estos vayan de nuevo a esa página de ventas de formato más largo,
una página de ventas de formato más largo. Voy a referenciar el sitio de mi amigo Lauren de nuevo, servicios. Entonces esto es lo que ella hace. Así es como básicamente ella es como esto es lo que es este servicio. Si esto se usa es
lo que hay que revisar. Este servicio es si este
es lo revisas. Así que llegar a los detalles. Por lo que esta es una página de ventas de
formato más largo. Nuevamente, hemos destacado testimonios y luego
hay mucha copia, pero ella usa estas
amplias secciones. Entonces de la misma manera que estaba
sugiriendo que uses secciones
alternas
en la página about. Aquí haces exactamente lo
mismo. Pero aquí es donde vas a incluir todos esos detalles. Qué va a conseguir alguien, cuál es el proceso, para
quién es y para quién no. Si tiene
más de un servicio, su
página de servicios reales es más de esta sección de señalización como la
que teníamos en la página principal. Así que eso es solo una visión general
muy rápida de cómo funcionan
todas estas páginas juntas. Pero no quería compartir
eso para que tengas una idea de diferentes formas en las que podrías presentar tus
diferentes tipos de clases.
11. Blog de estilo cuadrado: Así que ahora hemos repasado
algunos diseños básicos para tus páginas principales. Y puedes aplicar las tácticas de
constructor uno-a-uno de
Squarespace y también lo que me viste haciendo,
el tutorial de la página principal. Puedes usar eso para básicamente crear todas tus
páginas en el futuro. Pero sí quería
compartir un poco sobre la página del blog de Squarespace
con esa es diferente. Entonces voy a ir a mi sitio de demostración, y este sitio
no tiene un blog, pero agregaré uno aquí. Con el propósito
de demostrar. Para agregar una página de blog, adelante y
en realidad se puede recoger, recoger, seleccionar el blog aquí. Entonces te da
diferentes diseños. Entonces esta es realmente
una característica agradable. Puedes seleccionar exactamente
lo que quieras. Selecciono, recomiendo
algo como esto o esto que
muestre más blogs, después tenerlos uno a través. Entonces llamaremos a esto, a este blog. Lo arrastraremos
al orden que
queramos en nuestro menú principal. Y entonces aquí realmente tal vez no tengas tanto que necesitas
hacer si quieres ocultar la fecha. Tan bueno en lo que
acabo de hacer ahí fue que golpeé editar la página del blog y me
estaba tomando un segundo para cargar. Todo bien. Entonces, si pulsas editar,
administra publicaciones. Perdón, eso estuvo mal. Sección. Aquí es donde puedes seleccionar
lo que quieres mostrar. Entonces si no quieres que se muestre
la fecha, por ejemplo, las unidades hacen nueve. Sería lo mismo en
una entrada de blog individual si no quieres que se muestre
la fecha. También puedes hacer
colores de la misma manera. Por lo que si quieres hacer
un fondo bastante pierna y poner esto en
el formato te permitirá, permitirte especie de
minimizar algo de esto. Entonces espaciamientos verticales, mucho. Sección de nuevo, aumentar
el espaciado entre postes. Se puede jugar
con estos números y también la opción de inserción para conseguir las cosas un poco
más cerca de lo que quieres. ¿ Por qué es esto? También puedes cambiar
esto lado a lado, lo cual me está gustando mejor porque este otro diseño
era un poco más rígido. Por lo que esta es una opción de nuevo, las fechas volvieron a mostrarse. Para que pueda volver a bajar hasta aquí. Ninguno. Ah, aquí tienes. Meta espaciado. Pero estos son donde
de repente están las cosas. No voy a pasar
demasiado tiempo en esto ya que va a
ser un gusto personal. Pero esencialmente
sólo vendrías por aquí. No hace
mucha diferencia. El patrón vertical va a
ser así. También podrías cambiar. Para ser así. Aquí tienes todas tus opciones. Y de nuevo, si quieres volver
al otro estilo de blog, puedes hacer el blog de rejilla básica. Y puedes jugar con
el espaciado hasta conseguir algo que
te guste. Más. Ahí vamos. Eso fue mejor. Espaciado del título. Perdón, sólo estoy jugando con eso. Entonces, por qué podría no
ser lo más útil, sobre todo porque está
tardando un tiempo en cargarse. Pero sí,
en algún lugar de aquí tendremos espaciado para apretar
esta sección inferior. Entonces sigamos jugando
con esos ajustes. Por lo general tienen algo
que te guste que eso ya se
ve mejor. Y cuando termines, ahorra. Y luego cada
entrada del blog, de nuevo, espaciando. Puedes jugar con un poco más, pero cada entrada de blog a
medida que la
edites, puedes ir a través y
eliminar todas estas. O puedes entrar y simplemente
reemplazarlos con tu contenido. Nuevamente aquí si
no quieres que el autor muestre la sección de edición y
puedes seleccionar o deseleccionar
lo que quieras. En una entrada de blog. Podrías agregar fácilmente imágenes en diferentes espacios
haciendo cosas como esta. De acuerdo, entonces ese es un resumen del blog
muy rápido. Así es como conseguirás
configurar tu blog en tu sitio de noticias.
12. Cómo editar la página de contacto: Por lo que la otra página que vamos a estilo que es un
poco diferente de una página de inicio típica
o simplemente cómo se
editaría cualquiera del cuerpo de cualquiera de las páginas es la página de contacto que uno tiene el contacto forma. Entonces voy a seguir adelante y
mostrarte una página de contacto. Entonces sí tenemos una configuración aquí. Estas realmente thetas necesitan ser simples y darle a
la gente la información. Entonces yo quería, honestamente
cambié tanto de éste. Podrías agregar como una sección de
héroe si
quisieras que hace poco esto. Y quita el botón. Y solo ten esto
decir contacto y otra vez con este
constructor hará esto. ¿ Alguna vez has querido titular
sección a alguna de tus páginas? Se puede hacer algo como esto. Podrías ver este estilo, se muestra mejor
y tener eso. De lo contrario, este es un
bonito diseño simple. A lo que quieres
hacer presta atención es
a este formulario de contacto. Puedes seguir adelante y dejar que
los campos de formulario aquí. Si no necesitas algunas de estas cosas como
el número de teléfono, tal vez puedas cambiar cualquiera
de estas que necesites. Y cuando haces clic
en cada uno, puedes ver que incluso puedes agregar
una descripción si necesitas editar el texto del marcador de posición. Entonces este sería
Joe, Joe, joe.com. Puedes agregar
texto de marcador de posición si lo necesitas, pero así es como
editarías cualquiera de esos campos. El que sí quieres asegurarte de
que lo
haces puede hacer que esta página se ponga en marcha, está conectado al almacenamiento. que puedas conectarte
si quieres que esto Paraque puedas conectarte
si quieres que estoentre en alguno de estos lugares, Mailchimp, google Drive, Zapier, lo
conectaremos
a otro software. Si el software al que
necesitas conectarlo. Lo más fácil de hacer
con un formulario de contacto sin embargo, está relacionado con nosotros para hacer esto
y agregar un correo electrónico aquí. Este sería el
correo electrónico que deseas. Formulario de contacto envíos
a goto para ser notificado. A quién no le gusta esto. Y de esa manera esto irá
al lugar correcto. Así que esa es solo tu página de
contacto y asegúrate que el formulario esté en funcionamiento. Si necesitas editar el
estilo del formato, todo lo que puedes hacer un poco de
eso a partir de los colores. Por lo que el color de ese botón podría
cambiar dependiendo de. Pero si no
te está dando otra opción, entonces vamos a
hacer lo mismo que
hicimos por el botón en el menú. Se trata del diseño, estilos de
sitio, colores, más reciente. Y luego haz clic en el
elemento que deseas cambiar. Entonces este es el botón que, y luego quiero que sea el texto. Así sería como
cambiarías ese color de botón. De acuerdo, y eso es
lo que quiero que sepas de la página de contacto.
13. BONUS Cómo agregar fuentes personalizadas: Entonces estoy en un sitio de demostración y te
voy a mostrar cómo instalar fuentes personalizadas y
hacer Squarespace Seven 0.1. Esto nos ayudará a evitar el
hecho de que realmente solo tenemos una opción de fuente de párrafo
y una opción de fuente de encabezado. Entonces para hacer esto se convierte en
un diseño CSS personalizado. No soy nada en este sitio. Entonces lo primero que
hacemos es agregar una fuente. Por lo que necesitarás identificar
una fuente que te guste. Y vas a
necesitar ya sea un archivo T, T, F o un archivo OTF. Y por lo que podría tener que comprar una fuente si no es
una fuente de código abierto, pero déjame ver si puedo encontrar. Entonces, básicamente,
búscalo. Entonces esta es la fuente de la que estoy hablando. Y está a la altura de ver
si puedes encontrar una versión de descarga para ello. El tipo de letra Frida io es
en realidad uno bastante bueno. Muchas veces sí las
tienen. Entonces aquí vamos. Tienen la OTF
y la CTF y
puedes golpear descarga y
estás recibiendo los archivos. Así que asegúrate de que eres los archivos antes de
entrar y hacer nada de esto. Pero una vez que los tengas,
vamos a venir aquí. Y lo que vamos a hacer es ir
a administrar archivos personalizados, agregar imágenes o fuentes. Y aquí voy a ir a,
tengo una pequeña carpeta de fuentes. Aquí vamos. Um, así que lo vas a
abrir si hay FDF
para descomprimirlos primero. Entonces aquí sólo voy a hacer
esta por ahora. Una vez que se ha subido, es
necesario hacer clic en él. Y ahí es donde
conseguirás la URL aquí. De acuerdo, así que haz clic fuera de él. Entonces a continuación necesitamos agregar
el nombre de la misma, ese código. Y así podrás copiar y pegar esto desde tu guía, el código Add font face. Entonces esto es pedir DRL. Toma esta URL y la
vas a cortar. Lo vas a poner
entre estos dos apóstrofes, pero eso son puntos y comas entre
ahí, entre apóstrofo, punto y coma. Yo estoy ahí dentro. Por lo que ya puedes ver ahora
que se agrega aquí. Y luego solo quieres
nombrar esta fuente. Entonces voy a dar nombre a este archivo. Este se llama
Bodoni audaz poseer. Sería sólo, bien, entonces ahora que tenemos
la fuente ahí y ahora tenemos que asignarla. Entonces a continuación vamos a venir
aquí y conseguir la asignación. Un código de fuente. Verá aquí esto es para H1. Si quieres que
sea para tu H2, solo
agregarías
H2, H3, H3, H4, H4. También puedes agarrar. Esto es un
poco menos intuitivo, pero este punto SQS
RTE guión agrandar, Eso es para su
párrafo uno fuente. Incluso puedes personalizar
eso si lo deseas. Todo lo que necesitas hacer es
asegurarte de que esto sea un reflejo de lo
que quieres asignarlo. Y entonces sólo tienes que seguir
adelante y escribir esto. Ya ves que esto acaba de cambiar eso. Entonces esa es ahora la fuente Bodoni. Por lo que puedes hacer eso por
tantas fuentes como quieras. Te recomiendo que seas un
poco juicioso al respecto. Demasiado código CSS
terminará por ralentizar un poco
tu sitio. Así que adelante y realmente ver qué fuentes de Squarespace
hay ahí que te gustan, y luego elige una
o dos fuentes de encabezado. A lo mejor esa fuente de párrafo, yo diría tres max es realmente lo
que se quiere poner ahí. Yo no pondría más
que eso porque quiero hacer algunas otras personalizaciones CSS muy
probablemente también. Entonces esta es una forma en que podemos
economizar un poco, pero puedes conseguir esas
fuentes personalizadas y ahí, bien.
14. BONUS en formatos de encabezado en 7.1: Este video tutorial es para el encabezado y esa opción
transparente, es
decir, si tienes
alguna nombra un sitio, solía estar ahí y ahora no
está por encima de mi hombro. Y te mostraré las diferentes opciones de
cabecera en los nuevos cuadrados, me 7.1. Entonces este es mi sake demo aquí. Si venimos por aquí, en lugar de tener
esa
pestaña transparente a la que te habrás acostumbrado, tenemos el estilo
y esto ya está aquí. Tan dinámico es un tratamiento. Este es el, esto en realidad
es lo mismo que transparente que
lo que solíamos tener. Tan dinámico bien,
hazlo cualquiera que sea la
barra de ajustes de color aquí, tema. Nosotros hacemos esto, de esta manera. Podemos cambiarlo para
poder ponerlo en cualquiera de nuestros lados de color. Entonces así es como le
darías su propio color. Y los otros son
una especie de tratamientos. Entonces gradiente, este tipo
de cosas. Ese gradiente. Y también tenemos sólido y esto, puedes convertirlo en algo personalizado. También puedes hacer un desenfoque. Ves, puedo
jugar con eso. Qué perdón, esto es el borrón. Entonces si disminuyen la opacidad, van a tener
este efecto aquí. Entonces esto solo te da
muchas opciones diferentes. Tan sencillo, dinámico es tema
transparente. Puedes usar tus temas
de color, sólidos. Puedes hacer colores personalizados
o hacer este efecto de desenfoque, o tenemos gradiente
como eres opciones. Entonces esa es tu nueva configuración de
encabezado. Espero que eso ayude.
15. BONUS Versiones de página móvil: De acuerdo, Entonces una de las
características ordenadas del motor fluido, la versión más reciente
de Squarespace builder es que hacen que sea realmente fácil editar las versiones
móviles de tus páginas. Estoy pensando por encima del
hombro y te
mostraré cómo hacerlo. Entonces, si saltamos
para conseguir eso lejos, si saltamos a este sitio web. Así que este es un sitio web construido
en la versión más reciente. Si vamos a editar
alguna de las páginas, podemos ver que ésta tiene un montón
de capas ordenadas de imágenes. Entonces esta es una imagen, esta es
una imagen, esta es una imagen. Cuando esto primero se agregó en y la versión de escritorio
se ve muy bien. La versión móvil
no se veía tan bonita. Por lo que para poder editar
la versión móvil, quieres estar en la edición. Así que he hecho clic en la página, edito la página, y edito
la versión móvil. Voy a darle la vuelta
a esto aquí, cualquier cosa que me mueva. Entonces si muevo esto aquí arriba, por ejemplo, vuelvo
a la vista de escritorio. Esto no se ha movido en absoluto. Así que ahí es justo donde
debes saber para llegar a esta configuración móvil. Y aquí puedes mover cualquiera de estas opciones con bastante facilidad y asegurarte de que
estén posicionadas, cómo necesitas
que se
posicionen en móvil versus escritorio. Así que eso es solo un
pequeño video extra rápido que te
muestra ese ajuste. Sí hace las cosas
mucho más fáciles. Así que asegúrate de revisar tus versiones
móviles de tus páginas.
16. Para terminar: De acuerdo, así que ahí
lo tienes. Con estos videos, tienes todo lo
que necesitas para pasar y crear un sitio web de Squarespace completamente
personalizado. Así que tómate tu tiempo, ve
y edita todo el contenido. asegura de que sus menús estén
arreglados. Lanza tu sitio. Y luego cuando puedas
tomar una captura de pantalla y compartirla como
tu proyecto de clase. De acuerdo, muchas gracias.
Kara Ferreira, Websites for Creatives & Coaches
