Squarespace es uno de los fantasticos constructores de sitios web. Es ideal si lo está utilizando para su sitio web sin querer preocuparse por la configuración y el mantenimiento.ssles de CMS como WordPress.
Se sorprenderá con la rapidez y facilidad con la que puede armar un magnífico sitio web con nada más que un nombre de dominio y Squarespace suscripción.
En este Squarespace para la guía de principiantes, veremos los pasos exactos que debe seguir para crear y lanza tu primer sitio web.
Cubriremos lo siguiente Squarespace componentes:
- Diseño (personalización de la apariencia general de su sitio)
- Páginas (agregar contenido a su sitio)
- Configuración (ajuste fino de SEO y otras configuraciones comerciales)
Una vez que comprenda estos componentes, podrá crear cualquier tipo de sitio web utilizando la plataforma.
Navegación
- Paso #1: Registrarse para Squarespace
- Paso #2: Comprensión Squarespace (Parte #1): Opciones de diseño
- Paso #3: Comprensión Squarespace (Parte #2): Cómo funcionan las “Páginas”
- Paso #4: Explorando Squarespace
- Envolver
Lista de herramientas
- Plataforma - Squarespace
- Registrador de dominios - Nombre barato
- (¡Eso es todo lo que necesitas, simple!)
¿Cómo Usar? Squarespace… La preparación antes de empezar
Antes de comenzar a usar Squarespace Para construir su sitio web, necesitará algunas cosas:
1. Nombre de dominio
Como uno de los pasos de configuración de nuestro sitio web, vincularemos su nombre de dominio con su Squarespace .
Por lo tanto, necesitará un nombre de dominio. Si aún no ha comprado un nombre de dominio, compre uno ahora.
Puedes comprarlo de Squarespace también, pero no lo recomendaré.
La transferencia de dominio entre proveedores de alojamiento o creadores de sitios web o CMS siempre es más fácil cuando el dominio está registrado con un registrador de dominios de terceros.
NameCheap es un excelente servicio de registro de nombres de dominio que ofrece precios competitivos y un gran servicio. Compruébalo para comprar un nombre de dominio para tu Squarespace Página Web.
Nota: si necesita ayuda en registrar un nombre de dominio para su sitio web, estos generadores de nombres de dominio podría ayudar.
2. Una idea aproximada de la estructura de navegación de su sitio.
Conocer la estructura de navegación de su sitio (o sus elementos del menú principal) antes de comenzar a construirlo hace que el proceso sea más rápido. Así que tome un papel y dibuje cómo se verá el menú de su sitio. Este ejercicio ayudará a finalizar las diferentes páginas que agregará a su sitio.
Por ejemplo, puede agregar algunas de las siguientes páginas a su sitio:
- Acerca de
- Comience Aquí
- Portafolio
- Servicios
- Alquiler
- Tienda
- Características
- Precios
- Equipo
- Contacto
3. Copias y gráficos
Lo último que necesitará antes de comenzar a crear su sitio es contenido. Así que escribe borradores de todas las páginas que vas a agregar.
Además, apila todas las imágenes (o videos) que necesitarás para construir tu Squarespace sitio web. Si necesitas imágenes de stock, arregla esos también. Tener las imágenes correctas puede tener un gran impacto en conversiones.
Tener todo el contenido y los medios a mano será mucho más tarde.
Comencemos ahora con la construcción del sitio.
(Si ya se ha registrado en un Squarespace prueba, vaya a la primera parte de la guía).
Cómo construir tu primera Squarespace página web
Paso #1: Registrarse para Squarespace página web
Todos los planes de Squarespace los planes comienzan con una prueba gratuita. Para registrarse para una prueba gratuita, visite Squarespace y elige la opción 'CREAR UN SITIO ':
A continuación, elija una plantilla.
Para facilitar este paso, Squarespace groups sus temas en las siguientes categorías:
- Las empresas
- Portafolios
- Blogs
- Músicos
- Restaurantes
- Bodas
- Personal
Squarespace Temas Muestras
Aquí hay una serie de diseños que puedes encontrar en Squarespace temas Haga clic en las siguientes miniaturas para tener una vista más clara.
Tutorial Squarespace el registro proceso
Para el propósito de este tutorial, lo configuré usando mi Squarespace .
Me decanto por la categoría empresarial y elijo la plantilla, Montauk.
Una vez que elija una plantilla, Squarespace le mostrará un breve formulario de registro:
Al finalizar el registro, se le dirigirá a un proceso de 4 pasos Squarespace proceso de personalización del contenido del sitio.
1. Elegir para quién es el sitio
2. ¿De qué se trata este sitio web?
3. ¿Cuáles son sus objetivos para este sitio?
4. Nombrar el sitio
Al completar el cuestionario de personalización del contenido del sitio, veo la siguiente pantalla.
Como puede ver en la captura de pantalla, a la izquierda, hay un panel con varias configuraciones y preferencias de diseño. Y a la derecha, hay una vista previa de mi sitio web.
Paso #2: Usando Squarespace (Parte #1): Opciones de diseño
Squarespace tiene 10 elementos en su configuración de diseño:
- Logotipo y título
- Plantilla
- Editor de estilo
- Editor de estilos de página de pago
- Bloquear la pantalla
- Barra de anuncios
- Barra de información móvil
- Squarespace Divisa
- CSS personalizado
- Advanced
Echemos un vistazo detallado a cada uno de estos elementos.
1. Logotipo y título
Ya le hemos dado un nombre a nuestro sitio, por lo que en este paso agregaré un eslogan. Establezcamos el lema en 'Un recurso para Squarespace principiantes.
Una vez que hago clic en el botón, soy dirigido a SquarespaceHerramienta de creación de logotipos.
Esta herramienta de creación de logotipos te permite:
- Elija entre un montón de iconos de logotipos
- Cree solo un logotipo basado en texto
- Elija un logotipo de imagen
- Cambiar la fuente y el color del texto del logo
- Obtenga una vista previa de cómo se verá el logotipo en tarjetas de presentación y otro material de marca
En general, SquarespaceLa herramienta de creación de logotipos de es bastante intuitiva. Tiene sus diversos elementos de diseño o iconos en el panel del lado izquierdo.
Cuando busqué la palabra clave 'sitio web', Tengo muchos iconos geniales. Elegí el que puedes ver a tu derecha e hice un logo de imagen.
Intenté descargar una versión de alta resolución del logotipo, pero el editor me pidió que me suscribiera a una Squarespace cuenta para poder hacerlo.
Pero aún así, también se puede descargar una versión de baja resolución en este punto. Eso servirá por ahora.
Una vez que tu Squarespace finaliza la prueba y actualiza a un plan premium, debería poder descargar la versión de alta resolución sin ningún problema. Cuando obtenga el archivo de alta resolución, puede cargarlo en su Squarespace .
Las siguientes dos opciones bajo este elemento de diseño son establecer el favicon y el logotipo de intercambio social. Si tienes estos, genial. De lo contrario, pase a la siguiente configuración.
Para guardar los cambios que ha realizado hasta ahora, haga clic en 'SALVAR' botón en la parte superior del panel.
Nota: Si desea crear un favicon increíble para su sitio web, aquí tiene una lista de generador de favicon puedes echar un vistazo.
2. Plantilla
Las soluciones 'ModeloLa sección ' muestra todas las plantillas que se descargan dentro de un Squarespace .
En este momento, como puede ver, mi lista de plantillas solo incluye la plantilla Montauk porque esta es la plantilla con la que me registré cuando configuré mi prueba.
Si está satisfecho con la plantilla que ha elegido, vaya al siguiente paso. O puede descargar más plantillas.
Consejo
- No pierda tiempo en descargar y cambiar plantillas en este momento porque no será útil.
- Solo después de diseñar su sitio y cargar contenido en él, podrá comprender cómo las diferentes plantillas muestran su contenido.
- No podrá averiguar mucho con el contenido y las imágenes de demostración.
como saber que Squarespace plantilla que usa un sitio web
Si ve una Squarespace plantilla que te gusta y te preguntas qué tema está usando, así es como puedes averiguarlo,
- Haga clic derecho en la página> Ver fuente / Fuente de página
- Te darás cuenta <!– This is Squarespace. –> cerca de la parte superior del código para indicar que es un Squarespace página web
- Presione Ctrl + F para buscar en la página: id de plantilla y copia el código
La plantilla, Montauk, que estoy usando tiene la identificación de la plantilla: 50521cf884aeb45fa5cfdb80. Pruébalo tu mismo.
Después de encontrar la identificación de la plantilla, puede consultar la Squarespace familia de plantillas para llevarte al oficial Squarespace sitio de demostración
3. Editor de estilos
Las soluciones Editor de estilo se utiliza para personalizar la configuración de una plantilla, como las fuentes, el color del título, la posición del logotipo, el contenido del pie de página, entre otros.
Cada plantilla ofrecerá diferentes opciones de personalización en el Editor de estilo.
Pero debido a que todos los Squarespace las plantillas están diseñadas a la perfección, te recomiendo que te mantengas alejado de esta sección, a menos, por supuesto, que seas un diseñador.
4. Editor de estilos de página de pago
Las soluciones Editor de estilos de página de pago ayuda a personalizar la configuración de la página de pago. Esta configuración es principalmente útil para Squarespace sitios que tienen tiendas o son sitios web de tiendas.
5. Bloquear pantalla
Squarespace le permite bloquear páginas con contraseñas. Todas esas páginas no muestran el contenido, pero muestran una pantalla de bloqueo.
Si no personaliza el Bloquear la pantalla en absoluto, así es como se verá.
5. Barra de anuncios
Las soluciones Barra de anuncios le permite agregar una notificación adhesiva en la parte superior de su sitio. Esta es una característica excelente para llamar la atención de sus lectores sobre algunos de sus contenidos importantes.
Una vez que habilita el Barra de anuncios, puede agregar su mensaje y el enlace en el que los usuarios deben hacer clic.
Como puede ver en la captura de pantalla anterior, puede hacer que el enlace se abra en una nueva ventana.
6. Barra de información móvil
Como su nombre lo indica, el Barra de información móvil se muestra ante los usuarios de dispositivos móviles y se puede utilizar para mostrar su correo electrónico, número de teléfono, ubicación y horario comercial.
Squarespace obtiene esta información de su 'Información de negocios' sección, que veremos más adelante.
7. Squarespace Divisa
Squarespace agrega su marca (insignia) a todos los sitios web creados con él.
Las soluciones Squarespace Divisa La configuración le permite habilitar o deshabilitar la Squarespace distintivo, ajuste su posición y ajuste la configuración de la pantalla.
8. CSS personalizado
Si desea personalizar su plantilla más allá de la fuente, los colores y otras opciones de personalización predeterminadas, tendrá que tomar la ayuda de CSS personalizado.
Recuerda que agregando CSS personalizado puede romper el diseño de una plantilla, no recomendado.
9. Avanzado
Las soluciones Advanced opción le permite agregar más fuentes de Typekit para usted Squarespace sitio web. los Advanced La configuración también tiene configuraciones de plantilla avanzadas.
Eso concluye la parte del diseño de su Squarespace .
A continuación, veremos Squarespace páginas y cómo puede usarlas para cargar contenido en su sitio recién diseñado.
Paso #3: Usando Squarespace (Parte #2): Cómo 'Páginas ' trabajar en Squarespace
Una vez que haya elegido una plantilla, la haya personalizado y haya agregado el título y el logotipo de su sitio, es hora de comenzar a agregar contenido.
Squarespace Las páginas le permiten:
- Agregue páginas (y contenido) a su sitio (por ejemplo: Acerca de, Contacto y más)
- Agrega un blog a tu sitio
- Agrega una tienda a tu sitio
- Crea el menú principal de tu sitio
Empecemos por el menú principal.
Cuando acceda a la configuración de las páginas por primera vez, notará que el 'NAVEGACIÓN SUPERIOR ' muestra los elementos del menú de la demostración.
Por ahora, me gustaría que se olvidara de las páginas de la demostración y comenzara a agregar sus propias páginas.
Para cada página que normalmente necesita un sitio, Squarespace ha proporcionado plantillas prefabricadas.
Por ejemplo, para páginas como Acerca de, Funciones, Tienda, Contacto y más, ya tiene diseños de página listos para usar que puede cargar en su sitio.
1. Cómo agregar una página a una plantilla prediseñada
Veamos cómo puede agregar una página a una plantilla prefabricada.
Como puede ver en la siguiente captura de pantalla, hay dos signos '+' en los que puede hacer clic para agregar una página a su sitio.
Cuando hace clic en la primera opción, no solo agrega una página, sino que también la agrega al menú principal de su sitio web.
Y cuando haces clic en la segunda opción, simplemente agregas una página.
Te sugiero que comiences a agregar una página con la segunda opción. Una vez que haya terminado de crear las páginas, elimine todas las páginas de demostración, arrastre todas las páginas recién generadas y suéltelas debajo del NAVEGACIÓN SUPERIOR.
Agreguemos una página "Acerca de". Una vez que haga clic en el elemento 'Página', verá las siguientes opciones en el panel del lado izquierdo:
Una vez que hago clic en 'INICIAR LA EDICIÓN', el diseño de página seleccionado sobre mí se carga en Squarespaceeditor de la página. Para editar los elementos de la página, hover en la parte superior de la página (que está justo debajo de la navegación), y verá que se abre el siguiente panel de opciones:
Haga clic en 'EDITAR'.
En este punto, puede comenzar a editar el contenido de la página o puede hacer clic en '+'en la parte superior de la página para agregar más elementos de diseño.
Una vez que agrega un elemento a su sitio, es fácil reorganizar su posición con la función simple de arrastrar y soltar.
Nota:
Si personaliza los diseños predeterminados y agrega diferentes elementos, incluido el elemento espaciador, a veces la vista previa de su dispositivo móvil puede verse graciosa; más aún, el espacio entre los diferentes elementos puede verse un poco fuera de lugar.
(Sin embargo, los diseños predeterminados se representan a la perfección).
Agregar otras páginas es similar a agregar la página Acerca de.
Por ahora, es mejor usar los diseños predeterminados si desea que el sitio esté en funcionamiento súper rápido.
Al final de este paso, debería tener todas las páginas de su sitio listas para ser movidas al menú principal.
Pero antes de hacer el movimiento, elimine las páginas de demostración.
A continuación, arrastre y suelte las páginas recién creadas en la carpeta 'NAVEGACIÓN SUPERIOR '.
Una vez que haya limpiado su navegación, es hora de trabajar en las páginas.
2. Cómo agregar contenido a Squarespace páginas:
Para agregar contenido (o personalizar el diseño de una página), simplemente haga clic en el nombre de la página.
Una vez que hagas clic, se cargará el editor de páginas y podrás reemplazar el contenido de la plantilla con el contenido que escribiste en los pasos de preparación.
3. Cómo configurar algunos ajustes de página de alto nivel
La configuración de página de alto nivel puede ayudar con lo siguiente:
- Título de navegación
- Título
- Descripción (de uso frecuente para SEO)
- Slug de URL
- Imagen de cabecera
- Codigo de localización
Para realizar cambios de nivel superior en una página o para eliminarla, haga clic en el icono de configuración junto al nombre de una página.
Además, para establecer una página como página de inicio, debe abrir esta configuración para la página seleccionada y elegir el 'ESTABLECER COMO PÁGINA DE INICIO' .
Un importante Squarespace pagina: el blog
Aunque puede agregar un blog como una página simple en Squarespace, es posible que deba realizar algunos ajustes adicionales.
Para agregar una publicación, haga clic en el signo '+' en las opciones del elemento del menú del blog.
El editor de publicaciones es bastante intuitivo.
En la parte inferior, verá la configuración para agregar una categoría y etiquetas a su publicación.
Las soluciones Opciones la configuración le permite:
- Agregar una imagen destacada a una publicación
- Asignar un autor a la publicación
- Escribe un extracto
- Marcar una publicación como publicación destacada
Con suerte, con la sección anterior, tendrá un sitio web de gran apariencia listo con su contenido e incluso un blog.
Veamos ahora Squarespace configuración.
Paso #4: Usando Squarespace: Exploración de la configuración
Usar SquarespaceLa configuración de es fácil. Se agrupan en 3 categorías:
- General
- El sitio web
- Locales
De estos, el 'General' La categoría le permite agregar información comercial como su nombre comercial, dirección, identificación fiscal y más.
Y el 'Comercio' La configuración es relevante para alguien que quiere administrar una tienda en línea o agregar una tienda a su sitio.
De estas categorías, el 'Sitio web' categoría es de la que me gustaría hablar.
La 'Sitio web' los ajustes incluyen:
- Información básica - Esta configuración le ayuda a agregar un extracto sobre el tema de su sitio. Algunas plantillas muestran esta información, por lo que debe completarla.
- Dominio - Después de haber comprado un dominio, debe volver a esta configuración y apuntar su Squarespace sitio a ese dominio. Integración de dominios de terceros Es una brisa.
- Correos electrónicos - El siguiente elemento es el correo electrónico. La integración del correo electrónico empresarial de Gmail se puede realizar aquí.
- Cuentas conectadas - Puede conectar sus cuentas de redes sociales con su Squarespace sitio web aquí. La próxima vez que agregue íconos de perfil de redes sociales en cualquier lugar de su Squarespace sitio, Squarespace utilizará la información de esta sección y vinculará automáticamente los íconos a sus perfiles.
- Comercialización Dentro de las opciones de configuración de marketing, tiene configuraciones para SEO, redes sociales y Google Adwords.
Configuración de SEO desde aquí lo ayudará a agregar un extracto de SEO para su sitio. Este extracto es visible para un usuario en la página de resultados del motor de búsqueda. También puede establecer los formatos de URL de los diferentes elementos de su sitio. La configuración de las redes sociales lo ayudará a decidir qué botones de compartir desea mostrar en su sitio web. La configuración de marketing de Google Adwords es para sitios que utilizan SquarespacePlanes de Negocios o Comercio. - Bloguear - La configuración de los blogs le ayuda a establecer el formato de la URL de la publicación del blog.
No cambie el formato predeterminado, ya es fácil de leer. Sin embargo, si lo desea, puede eliminar el año, el mes y la fecha. Esta configuración también le permite integrar conectar su blog con Disqus, un servicio de comentarios. De esta manera, sus usuarios podrán comentar su contenido a través de sus cuentas de Disqus. (También hay un sistema de comentarios predeterminado si no desea Disqus).
La configuración de blogs también le ayuda a permitir que los proveedores de AMP muestren la versión AMP de sus publicaciones de blog. (Las páginas optimizadas para AMP son aquellas que muestran páginas web con versiones atenuadas a los visitantes móviles; esto ayuda a ofrecer una experiencia de navegación móvil increíblemente rápida). - SSL – Puede elegir entre una versión segura y una insegura de su sitio en SSL pólipo. Elija la versión segura porque Google prefiere los sitios web seguros a los inseguros.
- Avanzado - La configuración avanzada le permite importar contenido del sitio desde otros creadores de sitios web o CMS. También le permite exportar su sitio a WordPress.
Si crea una página 404 personalizada para su sitio, puede usar la configuración avanzada para mostrar su página 404 personalizada en lugar de la página 404 predeterminada.
También puede agregar su Google Analytics número de cuenta a través de esta configuración. Al hacerlo, se instalará automáticamente el Google Analytics script a su sitio.
Eso es.
Si ha estado siguiendo las instrucciones de esta guía, ahora su primer funcional (si no perfecto) Squarespace el sitio web debe estar listo.
Lo primero que debe hacer después de lanzar su Squarespace página web
Una vez que inicie un nuevo sitio web, su primera tarea es que Google lo indexe.
Para acelerar el proceso de indexación, debe enviar su mapa del sitio a Google Search Console.
A Squarespace El mapa del sitio del sitio web se puede encontrar en:
http://www.yourdomain.com/sitemap.xml
Copie la URL del mapa del sitio de su sitio web y envíelo a través de Búsqueda Consola.
Cómo construir un Squarespace sitio web - Envolviéndolo
Creación de un Squarespace sitio web y ajustarlo y personalizarlo a la perfección no debería llevarle más de una semana. Una vez que haya terminado, no tiene que preocuparse por las actualizaciones, la piratería, el alojamiento o cualquier otra cosa; Squarespace administrará su sitio web por usted.
Espero que esta guía lo equipe para construir una versión aproximada de su primera Squarespace sitio en menos de 10 horas (teniendo en cuenta el tiempo para comprar el dominio y otras cosas).
Nota: Si busca plataformas alternativas, aquí hay una lista de plataformas para construir su propio sitio web.
