Tuto Squarespace : créer un site vitrine pas à pas

Ce tuto Squarespace vous emmène d’un compte vide à un site vitrine en ligne en dix étapes, dans l’ordre que je suis pour mes clients : le contenu et l’identité visuelle d’abord, puis la construction, les bases du SEO, le nom de domaine et la mise en ligne. Les menus cités sont ceux de la version 7.1 à la date de rédaction (octobre 2026). L’interface existe en français (le forfait Core s’y appelle Essentiel) ; pour les menus et les boutons, j’indique entre parenthèses le libellé anglais.

Je fais passer sur Squarespace les clients qui modifient eux-mêmes leur site. Les clients WordPress venus me voir voulaient tous changer, pour les mêmes raisons : la courbe d’apprentissage, les extensions, et une structure qui s’effondre alors qu’ils voulaient seulement changer une lettre. Sur Squarespace, ils changent une photo ou un prix quand ils le veulent. Si vous hésitez encore, mon comparatif Squarespace ou WordPress dit à qui convient chacun.

Aucun développeur n’est nécessaire : je n’interviens en général que pour le code personnalisé, signalé à l’étape 5. Pour la vue d’ensemble, du budget aux pages, commencez par mon guide pour créer un site internet professionnel.

Le tuto Squarespace en 10 étapes

1. Préparez vos textes, vos photos et votre identité visuelle.
2. Lancez l’essai gratuit et choisissez un modèle.
3. Appliquez vos polices, vos couleurs et vos boutons dans les styles du site.
4. Créez les pages et organisez la navigation.
5. Construisez chaque page avec des sections et des blocs.
6. Vérifiez et ajustez la version mobile.
7. Ajoutez un formulaire de contact et testez où arrivent les demandes.
8. Posez les bases du SEO.
9. Reliez votre nom de domaine.
10. Choisissez un forfait et rendez le site public.

Les étapes 2 à 9 se font toutes pendant l’essai gratuit de 14 jours : vous construisez et testez tout le site avant de payer. Squarespace n’a pas d’offre gratuite : vous vous abonnez au moment de la mise en ligne.

Étape 1 : préparer le contenu et l’identité visuelle

Un site construit autour des textes d’exemple d’un modèle finit par ressembler au modèle, pas à votre entreprise. Faites cette étape avant de créer le compte, pour ne pas entamer vos 14 jours d’essai pendant que vous rédigez.

Quand je crée un site, l’identité visuelle passe en premier. Je parcours beaucoup de bibliothèques de design, je crée l’identité, je la montre au client et je l’ajuste. Ensuite seulement je cherche la bonne mise en page, et une fois les deux en main, je passe à la recherche de mots-clés et à la rédaction.

Avant de vous inscrire, rassemblez :

• votre logo, deux polices et trois à cinq couleurs ;
• le texte de chaque page : ce que vous faites, pour qui, où, et comment vous joindre ;
• des photos de vos réalisations, de votre équipe ou de vos locaux (quand un client n’en a pas, j’en achète ou j’en génère) ;
• l’identifiant du compte où est enregistré votre nom de domaine (étape 9).

Étape 2 : lancer l’essai gratuit et choisir un modèle

Sur squarespace.com, créez un compte et lancez l’essai gratuit. Vous pouvez partir d’un modèle de la bibliothèque, ou répondre à quelques questions et laisser Blueprint AI, l’outil de création par IA lancé par Squarespace en septembre 2024, préparer une première version. Dans les deux cas, vous arrivez dans le même éditeur.

Choisissez le modèle pour sa mise en page, pas pour ses photos ni ses couleurs, que vous remplacerez de toute façon. C’est important, car un site en version 7.1 ne peut plus changer de modèle ensuite : tous les modèles 7.1 forment une seule famille, avec les mêmes fonctionnalités et les mêmes options de style. Cherchez une page d’accueil proche de celle que vous avez prévue.

Si Blueprint AI rédige vos premiers textes, relisez chaque phrase : un texte générique ne donne aucune raison de vous choisir plutôt qu’un concurrent.

Étape 3 : appliquer polices, couleurs et boutons dans les styles du site

Dans l’éditeur, cliquez sur l’icône du pinceau pour ouvrir les styles du site (Site styles). Réglez votre identité ici une fois pour toutes, pas bloc par bloc : chaque modification s’applique à tout le site et garde les pages cohérentes.

1. Essayez d’abord les thèmes, des combinaisons de styles toutes prêtes : l’un d’eux est peut-être proche de votre identité.
2. Choisissez la police des titres et celle des paragraphes, ou un pack de polices qui s’en approche.
3. Ajoutez les couleurs de votre marque ; les sections y puisent leurs fonds et la couleur de leurs textes.
4. Définissez un seul style de bouton, pour que tous vos appels à l’action se ressemblent.
5. Vérifiez le style des formulaires, que votre formulaire de contact reprendra.

Si une modification tourne mal, vous pouvez réinitialiser les réglages de style sans perdre votre contenu.

Étape 4 : créer les pages et organiser la navigation

Chaque page doit répondre à une question précise. Voici un ensemble typique pour une entreprise de services :

Donnez à chaque service principal sa propre page au lieu de tout lister sur une seule. L’un des sites que j’ai créés pour Pilotech, un installateur de climatisation d’Île-de-France, n’a pas fonctionné du tout parce qu’il proposait trop de services ; celui qui est bien classé vend des services très précis.

Ensuite, dans le panneau Pages :

1. Cliquez sur l’icône + à côté de la navigation principale et ajoutez une page, à partir d’une mise en page ou d’une page vierge.
2. Faites glisser les pages dans l’ordre voulu pour le menu.
3. Placez les pages qui doivent rester hors du menu, comme une page de remerciement, dans la section des pages non liées (Not linked). Elles restent publiques et peuvent toujours être indexées.
4. Définissez votre page d’accueil depuis les paramètres de la page concernée.
5. Ajoutez les mentions légales et la politique de confidentialité en liens texte dans le pied de page : la version 7.1 n’a pas de menu de pied de page séparé.

Étape 5 : construire chaque page avec des sections et des blocs

L’éditeur de Squarespace, Fluid Engine, est arrivé en juillet 2022. Il fonctionne sur deux niveaux : des sections empilées de haut en bas, et des blocs placés sur une grille à l’intérieur de chaque section.

1. Ouvrez une page et passez en mode édition (Edit).
2. Ajoutez une section (Add section), toute faite ou vierge.
3. Dans la section, ajoutez un bloc (Add block) selon vos besoins : texte, image, bouton, formulaire, carte.
4. Faites glisser le bloc à sa place sur la grille et redimensionnez-le par ses bords.
5. Enregistrez avant de quitter l’éditeur.

Ouvrez chaque page par un titre qui dit ce que vous faites et où, avec un bouton de contact en haut de page. Une fois une page de service réussie, dupliquez-la pour le service suivant : la structure reste cohérente et vous ne réécrivez que le contenu.

Squarespace est fermé : vous n’avez pas accès au code source. Ce que les blocs ne savent pas faire passe par l’injection de code, à partir du forfait Essentiel. J’ajoute en général un peu de code aux sites Squarespace que je crée, et mes clients m’appellent pour cette partie ; je m’en tiens à des ajouts qui ne gênent jamais ce qu’ils modifient eux-mêmes. Mon tutoriel sur l’injection de code Squarespace montre comment le faire sans risque. Si ce code dépose des cookies, prévoyez un bandeau cookies conforme.

Étape 6 : vérifier et ajuster la version mobile

Fluid Engine garde deux mises en page pour chaque section, l’une pour ordinateur, l’autre pour mobile. Cliquez sur l’icône de vue mobile, en haut à droite de l’éditeur, pour travailler sur la seconde. Les règles à connaître :

• Déplacer, redimensionner ou épingler un bloc ne change que la mise en page sur laquelle vous travaillez.
• Modifier un contenu, comme un texte ou le lien d’un bouton, change les deux.
• Un bloc peut être masqué sur mobile seulement, ou sur ordinateur seulement.
• Les articles de blog et les autres éléments de collection utilisent l’éditeur classique, où le mobile suit l’ordinateur.

Vérifiez que le téléphone et le bouton de contact apparaissent tôt, que les textes se lisent, que les photos sont bien cadrées et que les boutons sont faciles à toucher, puis refaites le tour sur un vrai téléphone.

Étape 7 : ajouter un formulaire de contact qui vous parvient vraiment

Chez Pilotech, les demandes arrivent par deux portes : les formulaires et le téléphone. Offrez les deux à vos visiteurs, et assurez-vous que le formulaire vous parvient bien.

1. Sur la page de contact, ajoutez un bloc formulaire (Add block, puis Form).
2. Limitez les champs : nom, email, téléphone, message, et le service recherché.
3. Choisissez où vont les envois : par email, dans une feuille de calcul Google Drive créée par Squarespace, ou dans Mailchimp. Vous pouvez en combiner plusieurs, par sécurité.
4. Vérifiez l’adresse de notification : par défaut, les envois partent vers l’email du compte de la personne qui a ajouté le formulaire. Changez-la si les demandes doivent arriver ailleurs.
5. Rédigez le message affiché après l’envoi, en précisant quand vous répondrez.
6. Ajoutez un lien vers votre politique de confidentialité à côté du formulaire.

Vous pouvez aussi télécharger tous les envois dans un fichier .csv depuis le bloc formulaire (Export Submissions) : une bonne roue de secours.

Étape 8 : poser les bases du SEO avant la mise en ligne

Comme Squarespace est fermé, un site codé sur mesure, sous WordPress ou sous Webflow peut avoir un avantage dans les résultats de recherche. Cela n’empêche pas un site Squarespace de se classer : le premier site que j’ai créé pour Pilotech était sur Squarespace, et il se classe premier ou deuxième sur Google. Faites bien votre SEO, des mots-clés aux métadonnées, et vous mettez toutes les chances de votre côté.

Avant de publier, réglez au minimum :

1. Un titre et une description pour chaque page : ouvrez les paramètres de la page (l’engrenage dans le panneau Pages), allez dans l’onglet SEO, et nommez le service et le lieu, par exemple « Électricien à Lyon | Votre entreprise ».
2. Des URL courtes et lisibles : /electricien-lyon plutôt que /page-2.
3. Un seul titre principal par page, qui dit ce que la page propose.
4. Un texte alternatif sur chaque image : une courte description, qui aide aussi les visiteurs utilisant un lecteur d’écran.
5. Le titre du site et la description de la page d’accueil, dans les réglages SEO généraux.

Une fois le site validé par le client, je rédige les métadonnées et je prépare quelques articles SEO à l’avance, avant de relier le domaine. Mon tutoriel de référencement Squarespace passe en revue chaque réglage, dans l’ordre.

Étape 9 : relier votre nom de domaine

Si vous n’avez pas encore de domaine, vous pouvez en acheter un depuis le panneau des domaines (Domains), ou attendre l’abonnement : un forfait annuel inclut la première année d’un domaine standard comme un .com, qui se renouvelle ensuite au tarif normal. Si vous en avez déjà un, laissez-le où il est et reliez-le avec des enregistrements DNS. J’ai relié des domaines enregistrés chez OVH, Namecheap, Spaceship, Infomaniak et Hostinger, et la méthode est partout la même :

1. Dans le panneau des domaines, choisissez d’utiliser un domaine que vous possédez déjà et saisissez le domaine complet.
2. Sélectionnez votre registrar dans la liste, ou Other (autre) s’il n’y figure pas.
3. Squarespace affiche les enregistrements à ajouter : quatre enregistrements A et deux CNAME.
4. Ajoutez-les dans la zone DNS de votre registrar. Si la zone contient déjà un CNAME www, modifiez-le au lieu d’en ajouter un second.
5. Patientez : comptez en général 24 à 48 heures, parfois jusqu’à 72, avant qu’une étiquette verte Connected (connecté) n’apparaisse dans le panneau des domaines.

Type    Hôte                          Valeur
A       @                             198.185.159.144
A       @                             198.185.159.145
A       @                             198.49.23.144
A       @                             198.49.23.145
CNAME   www                           ext-cust.squarespace.com
CNAME   (code fourni par Squarespace) verify.squarespace.com

Ce sont les valeurs de l’aide de Squarespace sur les domaines tiers (en anglais) à la date de rédaction ; en cas de différence, suivez les réglages DNS de votre site. Gardez le CNAME de vérification : sans lui, Squarespace dissocie le domaine au bout de 15 jours.

Chaque registrar a ses particularités :

• OVH : les cibles des CNAME doivent se terminer par un point, comme ext-cust.squarespace.com., sinon OVH y ajoute votre propre domaine. Ce point final est le seul vrai piège que j’ai rencontré en reliant des domaines OVH à Squarespace, et mon tutoriel sur la zone DNS OVH le traite en détail.
• Namecheap : Squarespace peut proposer de changer les serveurs de noms ; choisissez plutôt l’option des enregistrements DNS. Mon guide pour configurer les DNS Namecheap montre chaque champ.
• Spaceship : les enregistrements se placent sur sa page Advanced DNS, comme le montre mon tutoriel pour acheter un nom de domaine sur Spaceship.

Étape 10 : choisir un forfait et rendre le site public

À la date de rédaction (octobre 2026), les guides tarifaires de 2026 indiquent les prix ci-dessous, par mois en facturation annuelle ; en facturation mensuelle, comptez environ 17 à 79 € par mois selon le forfait. En juillet 2026, Squarespace a augmenté ses prix aux États-Unis, et je n’ai pas trouvé de confirmation que la hausse touche l’euro : vérifiez la grille officielle, puis le total affiché au moment de payer.

Basic suffit pour un site vitrine. Prenez Essentiel si vous voulez du code personnalisé, comme le script de Microsoft Clarity ou d’un module de chat, car l’injection de code n’est pas disponible avec Basic. Plus et Advanced ne méritent la comparaison que si vous comptez vendre en ligne.

Pour mettre en ligne :

1. Choisissez votre forfait et payez.
2. Ouvrez le panneau de disponibilité du site (Site availability) et sélectionnez Public : tout site démarre en privé, et seul un site payant peut être public.
3. Pour un lancement en douceur, choisissez plutôt la protection par mot de passe (Password protected) et donnez ce mot de passe à quelques personnes.

Votre sitemap n’est en ligne qu’une fois le site public.

Après la mise en ligne : la checklist, et quand passer la main

La première semaine :

1. Ouvrez le site avec et sans www, sur un ordinateur et sur un téléphone.
2. Envoyez une demande test par le formulaire et vérifiez que l’email arrive.
3. Touchez le numéro de téléphone et chaque bouton.
4. Validez le site dans Google Search Console et soumettez le sitemap. Retirez d’abord tout mot de passe, et si votre domaine est enregistré ailleurs, attendez 48 heures après l’avoir relié.
5. Programmez un rappel pour revoir vos prix, vos photos et vos horaires chaque trimestre.

Vous n’avez pas besoin de moi pour tout cela : l’intérêt de Squarespace, c’est justement de le gérer vous-même, et à part le code personnalisé, mes clients Squarespace font tout eux-mêmes. Pour les entreprises qui en ont le budget, je crée plutôt un site sur mesure et je fais les modifications chaque mois, ou dès qu’elles en ont besoin ; voici comment je crée des sites internet.