Advanced Squarespace Course
Let’s get started - we’re gonna mix between getting really practical and hands on, as well as understanding some of the theories and principles that apply to web design.
-
-
Chrome Extensions
The extensions worth installing and the ones that waste toolbar space. We cover the handful that actually speed up your Squarespace workflow.
The extensions worth installing and the ones that waste toolbar space. We cover the handful that actually speed up your Squarespace workflow.
-
Browser & DevTools Setup
How to configure Chrome DevTools for Squarespace development. Inspect elements, test CSS live, and debug layout issues without guessing.
How to configure Chrome DevTools for Squarespace development. Inspect elements, test CSS live, and debug layout issues without guessing.
-
Colours (Hex vs HSLA) + Tool
How to build a colour system that scales across an entire site. We cover HSLA, CSS variables for colour management, and why “picking nice colours” isn’t the same as a colour strategy.
How to build a colour system that scales across an entire site. We cover HSLA, CSS variables for colour management, and why “picking nice colours” isn’t the same as a colour strategy.
-
Code Editors & Snippet Management
Setting up a code editor and organising your snippets so you’re never hunting for that bit of CSS you wrote three projects ago.
Setting up a code editor and organising your snippets so you’re never hunting for that bit of CSS you wrote three projects ago.
-
How to receive content from clients
A process for collecting client content that doesn’t derail your design. Get this right and you save hours of rework on every project.
A process for collecting client content that doesn’t derail your design. Get this right and you save hours of rework on every project.
-
Designing scalable sites
CSS variables applied to real Squarespace builds. Change a value once, watch it update everywhere. This is how you stop repeating yourself across every project.
CSS variables applied to real Squarespace builds. Change a value once, watch it update everywhere. This is how you stop repeating yourself across every project.
-
Best practices for testing feedback loop
A systematic workflow for testing your builds and collecting feedback. No more “it looks fine on my screen” followed by a client screenshot that says otherwise.
A systematic workflow for testing your builds and collecting feedback. No more “it looks fine on my screen” followed by a client screenshot that says otherwise.
-
Pro Tips
A collection of workflow shortcuts, hidden features, and time-savers that don’t fit neatly into another lesson but are too useful to leave out.
A collection of workflow shortcuts, hidden features, and time-savers that don’t fit neatly into another lesson but are too useful to leave out.
-
-
Looking Past the Style Editor Guide
What the Style Editor is actually doing under the hood, and how to extend it once you understand the CSS it generates.
What the Style Editor is actually doing under the hood, and how to extend it once you understand the CSS it generates.
-
Design Logic: Spacing, Scale & Structure - Interactive
How to establish a spacing system and apply it consistently. This is what makes a site feel intentionally designed rather than assembled.
How to establish a spacing system and apply it consistently. This is what makes a site feel intentionally designed rather than assembled.
-
How to approach Design & Typography Tool
Typography is one of those areas where most designers are working on instinct without knowing why certain decisions feel right and others do not. These tools make the invisible rules visible.
Typography is one of those areas where most designers are working on instinct without knowing why certain decisions feel right and others do not. These tools make the invisible rules visible.
-
-
The one pager site with beautiful animation
Multi-section homepage with an interactive flywheel, knowledge hub, testimonial carousels, and a four-partner organisational structure. Lots of layout complexity and content architecture to unpack.
Multi-section homepage with an interactive flywheel, knowledge hub, testimonial carousels, and a four-partner organisational structure. Lots of layout complexity and content architecture to unpack.
-
Two-tier membership, dynamic navigation, and event automation
Two membership tiers, conditional navigation that changes based on who's logged in, and an events system that practically runs itself. This build had a completely different brief to the other two sites. It's not a brochure site or a consultancy. It's a platform that needs to work for its members every day, which means the decisions behind the structure, the logic, and the integrations all had to be thought through differently.
Two membership tiers, conditional navigation that changes based on who's logged in, and an events system that practically runs itself. This build had a completely different brief to the other two sites. It's not a brochure site or a consultancy. It's a platform that needs to work for its members every day, which means the decisions behind the structure, the logic, and the integrations all had to be thought through differently.
-
The luxury site where design had to match the clientele
A luxury consulting firm helping high-net-worth individuals build meaningful passion projects. Twelve pillar categories, a compendium blog, book promotion, and image-heavy layouts that all needed to feel premium without feeling slow. This is a site where every design decision had to lead with motion and visual weight, because when the clientele operates at this level, the site has to feel like it belongs in the room with them.
A luxury consulting firm helping high-net-worth individuals build meaningful passion projects. Twelve pillar categories, a compendium blog, book promotion, and image-heavy layouts that all needed to feel premium without feeling slow. This is a site where every design decision had to lead with motion and visual weight, because when the clientele operates at this level, the site has to feel like it belongs in the room with them.
-
-
Working & Organising Custom Code Tool
Before you write a single line of CSS, the way you structure your file matters. This tool generates the starter template I use on every project, plus a reference library and comment converter.
Before you write a single line of CSS, the way you structure your file matters. This tool generates the starter template I use on every project, plus a reference library and comment converter.
-
-
Web Designer real time feedback
A complete client build recorded start to finish. Watch the process unfold with full commentary on every decision.
A complete client build recorded start to finish. Watch the process unfold with full commentary on every decision.
-
Personal Brand real time feedback
A different project type, a different brief, a different set of problems. See how the approach adapts when the requirements change.
A different project type, a different brief, a different set of problems. See how the approach adapts when the requirements change.
-
eCommerce real time feedback
The third full build. Different industry, different constraints, same standard of work. Three builds, three different ways of thinking through the same platform.
The third full build. Different industry, different constraints, same standard of work. Three builds, three different ways of thinking through the same platform.
-
-
Prompts in Claude AI
Most prompting advice is generic. This isn't. Work through four interactive stages and build prompts that actually work for Squarespace designers.
Most prompting advice is generic. This isn't. Work through four interactive stages and build prompts that actually work for Squarespace designers.
-
-
Setup and Configure URL Mapping - for existing sites
How to generate 301 redirect rules when migrating a site to Squarespace. Protect the client’s search rankings instead of starting from zero.
How to generate 301 redirect rules when migrating a site to Squarespace. Protect the client’s search rankings instead of starting from zero.
-
Domains Setup using 123 Reg
Step-by-step domain configuration for 123 Reg, including the specific settings and common mistakes their documentation doesn’t cover.
Step-by-step domain configuration for 123 Reg, including the specific settings and common mistakes their documentation doesn’t cover.
-
Domains Setup using GoDaddy
The same for GoDaddy. Specific DNS settings, propagation expectations, and how to avoid the issues that cause the most support tickets.
The same for GoDaddy. Specific DNS settings, propagation expectations, and how to avoid the issues that cause the most support tickets.
-
-
Accessibility Talk
What web accessibility means in practice, who it serves, and the standards that define compliance. The foundation for everything in this module.
What web accessibility means in practice, who it serves, and the standards that define compliance. The foundation for everything in this module.
-
Colour Contrast & Typography Tool
The measurable standards your text needs to meet and how to check them. “It looks readable to me” isn’t good enough.
The measurable standards your text needs to meet and how to check them. “It looks readable to me” isn’t good enough.
-
-
Handover & Client Systems Checklist
A messy handover is where client relationships quietly fall apart. This is the checklist I run through on every project before I consider the job done.
A messy handover is where client relationships quietly fall apart. This is the checklist I run through on every project before I consider the job done.
-
Launch Checklist
Every check that needs to happen before a site goes live. Built through real launches, refined every time something got missed.
Every check that needs to happen before a site goes live. Built through real launches, refined every time something got missed.
-
Live Style Guide
How to create a style reference inside the client’s own site so they can maintain design quality without calling you for every update.
How to create a style reference inside the client’s own site so they can maintain design quality without calling you for every update.
-
-
Typography Systems - Tool
Fine-grained typographic control. Optical adjustments, contextual sizing, and the details that separate styled text from properly typeset text.
Fine-grained typographic control. Optical adjustments, contextual sizing, and the details that separate styled text from properly typeset text.
-
-
Studio-Level Process
Most designers wing it. Not because they are bad at their job, but because no one ever showed them what a proper process looks like. This is mine.
Most designers wing it. Not because they are bad at their job, but because no one ever showed them what a proper process looks like. This is mine.