tutos pour squarespace
Le coin créa
Un espace abonné à 39€ - accès à vie 🗝️
(19,50€ pour les membres de la formation → votre code)
Des templates à récupérer, des pages à copier, des codes CSS à essayer et des inspis !
Explorez ci-dessous mes designs préférés.
Florence
Pour pimper son site Squarespace.
Plus d’une vingtaine de tutos à dispo.
Template - Site avec une deuxième police sur le même titre
Le site de démo ↗
Modèle de Squarespace utilisé : Myhra
Explication : souvent vu dans le milieu de la mode ou du design, l’utilisation de deux polices différentes dans un même titre attire l’œil et facilite la compréhension des informations importantes. C’est une bonne technique pour combiner esthétique, lisibilité, et impact émotionnel.
Parfait pour : ajouter une touche design à son site et mettre en avant vos typographies de marque.
Niveau : intermédiaire
Élément - Réduire l’interlignage
Le site de démo ↗
Modèle de Squarespace utilisé : Hart
Explication : cet effet permet de réduire l’espace entre un titre et un paragraphe dans un texte. Un code très simple mais qui manque quand on ne le connaît pas.
Parfait pour : personnaliser plus précisément l’espacement.
Niveau : facile
Élément - Ajouter une bulle d’information
Le site de démo ↗
Modèle de Squarespace utilisé : Pulaski
Explication : cet effet permet d’afficher une bulle d’information au survol dans un texte. Cela apporte une interactivité dynamique à son site, tout en fournissant des explications supplémentaires (indexable par les moteurs de recherche) sans surcharger le contenu.
Parfait pour : améliorer l’ergonomie et l’expérience utilisateur.
Niveau : avancé
Élément - Customiser le curseur de la souris
Le site de démo ↗
Modèle de Squarespace utilisé : Jotterpress
Explication : cet effet permet de customiser la souris affichée sur un site. L’idée derrière est de renforcer son identité de marque avec un curseur en cohérence avec son image, et d’apporter un effet ludique et esthétique. Vous pourrez choisir parmi une bibliothèque de curseurs mise à votre disposition.
Parfait pour : ajouter une touche personnalisée à son site.
Niveau : intermédiaire
Page - Autre image au survol
Le site de démo ↗
Modèle de Squarespace utilisé : Montclaire
Explication : très apprécié des artistes et photographes, cet effet permet de changer l’image affichée lorsqu’un utilisateur passe sa souris dessus. L’idée est de surprendre, de rendre votre site plus dynamique et d’attirer l’attention sur un élément en particulier.
Parfait pour : faire des avant/après, afficher une variante.
Niveau : intermédiaire
Template - Site aux marges larges
Le site de démo ↗
Modèle de Squarespace utilisé : Çimen
Explication : très utilisé dans le milieu de la tech, ce design au contenu central étroit, rappelle la vue mobile des sites sur téléphone. Comme une part toujours plus importante du trafic vient du mobile, c’est une bonne approche à adopter !
Parfait pour : avoir l’air moderne et actuel, mettre en avant son contenu en concentrant le regard du lecteur sur le milieu de l’écran.
Niveau : facile
Orga - Mes inspi de site
Explication : pas de bonne créa sans une bonne orga ! Accédez au recueil des sites que je préfère et qui m'inspire au quotidien, qu'ils soient de Squarespace ou non. De nouveaux ajouts réguliers sont faits au fil de mes trouvailles ! 💎
Parfait pour : vous donner de nouvelles idées, vous débloquer quand vous manquez de créativité.
Niveau : facile
J’espère que mes créa vous plaisent.
N’hésitez pas à me partager si vous voyez des choses que vous voudriez avoir !
