Speed Up Your Squarespace Site in 5 Easy Steps

by Jeremiah Svaren | Last Updated: October 5, 2021 •  7 min read

Tutorials » Squarespace

Tired of a slow page speed with your Squarespace website?

Here are a few things that you can do to speed things up!

But please note that outside of these major items, everything else is in Squarespace’s hands.

If you are a visual learner, check out our video tutorial below to speed up your site, otherwise keep on reading!

Before you start speeding up your site

Make sure you get a solid baseline for your current site’s speed!

Use a combination of testing tools to get a solid grasp of where your site ranks. These tools will also help you identify major areas that need your attention.

Some speed test tools we use

• Google PageSpeed Insights
• GT Metrix
• Web.dev

Make a note of your current scores and maybe even take some screenshots of your initial speed results.

Pro-Tip: Test your most popular pages in addition to your homepage!

Most people that are new to site speed make the mistake of only testing their homepage when in fact a large portion of traffic can come from another page with totally different content!

GT Metrix can give a really great breakdown of what’s happening under the “Waterfall” tab.

Now that you’ve got your current speed

Let’s dive into the handful of speed optimizing options that we have on Squarespace!

We’ll start with the easiest and then move up the chain to more complex opportunities.

1) Make sure you are using the free SSL

This is super simple to do and Squarespace gives all users this for free with their website.

Not only will this speed things up a bit, but Google will also be happy that your website is more secure. I’m sure your users will be happy to be a secures site too!

To enable your free SSL go into your Settings -> Advanced -> SSL
Make sure to select “Secure” AND “HSTS Secure”

Squarespace says this can take up to 72 hours to take effect, but we usually see the SSL generate within a couple of hours.

2) Optimize your images!

This is a big one for page speed on your Squarespace site! We see huge improvements when images are properly sized and optimized.

This can be tricky as you may have to play with images to see where the size gets to be too small and your images get pixilated or grainy.

Watch our video tutorial below for optimizing your images, or continue reading for the written instructions.

We recommend starting with a max-width of 1500px for most images unless the image is going to be set to a background image. In which case, a max-width of 2500px for background images will make sure the background looks great even on 4k displays.

Once you have resized your images to be a max of 1500px or 2500px, be sure to compress those images!

Free image compression software we use: Tiny PNG

Upload your newly resized images to Tiny PNG and let them compress those images to as small as they can go.

Once your images are resized and compressed, the time has come for you to upload and replace your old images.

A note about image types: For high-quality photos (taken with a camera) use the file type JPG or JPEG for best optimization. If you are creating images on the computer (think illustrations like logos or graphics) then use the file type PNG (you’ll also need to use PNG if your photos have a transparent background).

The new file format WEBP is not yet accepted by Squarespace but they are working on adding that feature!

Also while SVG files are not directly supported by Squarespace, you can upload and display them with a little workaround. Check out our video tutorial to upload SVG files to your site.

Pro-Tip: Upload a custom thumbnail image to your video blocks to decrease the load time on videos!

3) Get rid of 3rd party Javascript files

This step is a little tricky at times but can really help your speed out!

Most 3rd party Squarespace plugins help bring some extra style and functionality to your website but they come at a cost to your site speed.

Simplifying your site to what Squarespace gives us to work with is our best option.

When you want to customize things further, reach first for CSS design tweaks instead of Javascript.

Another heavy Javascript file that most of the internet uses is Google Analytics. This is a hard one to let go of and you don’t have to! Instead of deleting your Google Analytics, use the Async tag.

If you are using Google Analytics, make sure that you use this tag instead in your footer code injection. Just replace the UA-XXXXX-Y with your unique ID.

<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->

We would recommend against using any other tracking code unless you absolutely have to for something like advertising tracking.

4) Use web safe fonts

Now this speed optimization isn’t going to be for everyone, and we totally understand that!

What the heck is a web safe font?

Well, these are fonts that are pre-installed in every computer and browser.

Whereas all the other fonts need to be downloaded when a user visits your website. This isn’t great for page speed or user experience because users may see a shift or a flash of fonts on the screen when their computer finally loads the font.

Here is a list of the best web safe fonts that you can use to speed up your site:

• Arial (sans-serif)
• Verdana (sans-serif)
• Helvetica (sans-serif)
• Tahoma (sans-serif)
• Trebuchet MS (sans-serif)
• Times New Roman (serif)
• Georgia (serif)
• Garamond (serif)
• Courier New (monospace)
• Brush Script MT (cursive)

We would recommend limiting the number of fonts you use to 1 or 2. Web design standard is to use a sans-serif font for paragraphs and a serif or sans-serif font for headings.

See examples of the web safe fonts here at W3 Schools

5) Enable AJAX loading

This is an option that may require some testing on a variety of pages (depending upon the 3rd party code you have installed).

If you have a clean install of Squarespace then you should have no problem enabling AJAX loading.

But this option is only for Squarespace 7.0 users

Outgrowing Squarespace?

Take your website to the next level! Take the step today to move your website to a future proof platform that is built for speed & scale.

Lets Graduate!

BONUS SPEED!

Enable AMP blog posts

This is an option if you have a blog on Squarespace, but you will be limited to a simpler set of Squarespace blocks.

Now your Squarespace site should be as fast as possible!

But you may not be seeing amazing scores across the board… :/

Why?

Unfortunately, everything else is in the hands of Squarespace developers behind closed doors.

They have mentioned that they are continuing to make improvements and plan to continue doing so.

So at this point, you have a couple of options.

Either wait for Squarespace to speed up your site the rest of the way.

Or

You take the matter into your own hands and change platforms.

Here at Svaren Web Studio, we opted to Graduate Squarespace and move to WordPress with a lighting fast theme.

This choice isn’t for everyone, but if you are interested, we created a course that walks you through step-by-step from Squarespace to WordPress. Learn more about Graduating Squarespace.

Get Your Free 20-Minute Consult!

Book your free 20 minute consult with Jeremiah to discuss how to get more out of your website!

Book Now!

Jeremiah Svaren wears just about all the hats at Svaren Web Studio. He started getting into web design and development back in 2013. First starting to learn on his own with books and tutorials, then in 2014 he attended The Tech Academy in Portland, Oregon. He learned all about software engineering and decided to start freelancing. Now when he isn't helping clients, he makes helpful content here and on his YouTube channel Svaren.