Page speed is a confirmed Google ranking factor, and Squarespace sites can be frustratingly slow if you are not careful. The platform does a lot of heavy lifting behind the scenes, but it also loads a significant amount of JavaScript and CSS by default. Combined with common mistakes like unoptimized images and excessive third-party scripts, a Squarespace site can easily take five or more seconds to load.
These ten optimizations target the biggest performance bottlenecks. Each one is actionable and measurable. Run Google PageSpeed Insights before and after to track your progress.
1. Optimize Your Images Before Uploading
This is the single biggest impact change you can make. Squarespace automatically serves responsive images at appropriate sizes, but it does not compress your original uploads. A five-megabyte DSLR photo will be served at a smaller resolution but not at optimal compression.
Before uploading, run images through a compression tool like Squoosh or TinyPNG. Target file sizes under 500KB for full-width hero images and under 200KB for in-content images. Use WebP format when possible, as it provides better compression than JPEG at equivalent quality.
2. Limit Third-Party Scripts
Every external script you add via Code Injection is a performance liability. Chat widgets, analytics suites, retargeting pixels, social media embeds, and pop-up builders can collectively add megabytes of JavaScript to every page load.
Audit your Code Injection and remove anything you are not actively using. For scripts you do need, use per-page Code Injection instead of global injection when the script only applies to specific pages.
3. Reduce Section Count Per Page
Each section on a Squarespace page generates additional HTML, CSS, and JavaScript. Pages with twenty or more sections load noticeably slower than pages with eight to twelve sections. Consolidate sections where possible. You can often combine two sections into one by using the multi-column layout within a single section.
4. Use System Fonts When Possible
Custom fonts look great but they come at a cost. Each font weight is a separate file that has to download before text renders. If you load two font families with three weights each, that is six additional HTTP requests and roughly 100 to 300KB of data.
Consider using system fonts like -apple-system, BlinkMacSystemFont, and Segoe UI. These are already on your visitors' devices, so they render instantly with zero download. If you must use custom fonts, load only the weights you actually use and always include display=swap.
5. Lazy Load Non-Critical Content
Content below the fold does not need to load immediately. Squarespace lazy loads images by default in most templates, but embedded videos, maps, and custom iframes may not benefit from this.
For embedded content like YouTube videos, consider using a facade pattern: show a static thumbnail image and only load the actual video player when the user clicks. This can save one to two megabytes per embedded video.
6. Minimize Custom CSS
The Custom CSS panel is convenient but it loads on every page. If you have hundreds of lines of CSS, much of it may not apply to the page being viewed. This wastes bandwidth and can delay rendering.
Keep your Custom CSS lean. Move page-specific styles into Code Blocks on those pages instead of the global Custom CSS panel. Use our Code Snippet Library for tested, minimal CSS that does not include unnecessary properties.
7. Disable Unused Squarespace Features
Squarespace loads JavaScript for features whether you use them or not. The ecommerce module, for example, adds significant JavaScript even if you have no products. Check your site settings and disable any features you are not using.
8. Optimize Your Site Navigation
A navigation menu with twenty links and three dropdown levels is not just bad UX, it is bad for performance. Each link generates HTML, and complex dropdown structures require additional JavaScript and CSS. Simplify your navigation to seven or fewer top-level items.
9. Use Squarespace's Built-In Video Hosting Carefully
Background videos on sections look impressive but destroy page speed. A background video can add three to ten megabytes to your page load. If you must use background video, keep it short (under ten seconds), heavily compressed, and use it on one section maximum.
For most sites, a high-quality static image with a subtle CSS animation will look nearly as good as a background video while loading ten times faster.
10. Monitor Core Web Vitals Regularly
Google's Core Web Vitals measure three things: Largest Contentful Paint (how fast the main content loads), First Input Delay (how quickly the page responds to interaction), and Cumulative Layout Shift (how much the layout jumps around while loading).
Run PageSpeed Insights monthly and after any significant site changes. Pay special attention to LCP, which is the metric Squarespace sites struggle with most. The improvements in this article directly target LCP by reducing the amount of data that needs to load before the main content is visible.
Measuring Your Progress
After implementing these changes, test your site with Google PageSpeed Insights, GTmetrix, and WebPageTest. Aim for a PageSpeed score above 80 on mobile and above 90 on desktop. Perfect scores are difficult on Squarespace due to platform-level assets you cannot control, but scores in the 80 to 90 range are achievable.
For more ways to improve your Squarespace site, explore our free tools collection and our SEO guide.