How to Optimize a Squarespace Website for Site Speed
If you’ve done any research into SEO practices, you’ll know that website speed is pretty important.
Site or page speed is a ranking factor used by Google, giving sites with faster speeds precedent in search results. It’s all part of delivering better results to their users as the fact is, people don’t want to hang around for slow-loading websites.
With Squarespace being a hosted platform, people often wonder how much control they have over site speed. The answer is, not complete control, but you still have options to optimize site speed.
Here’s what you can do:
Get our checklist version here: What to do to speed up your Squarespace site
Site speed: It matters
SEO is important in terms of your website getting found organically in search results, however, that’s not the only reason to prioritize site speed. Think about what you do when you land on a website that takes too long to load. Do you hang around and wait? Or do you give up quickly?
Most people won’t hang around. This study shows they’ll abandon the site if it doesn’t load within three seconds. This seems like a short time, but with improvements in internet speeds over the years, we’ve been conditioned to expect that things should work quickly. If not, there’s bound to be a competing site to check out instead.
So while SEO is a concern, there’s another thing that should be a bigger concern: user experience. Improving site speed delivers a better user experience and means that your website visitors are more likely to stick around a bit longer.
Test your website first
How will you know if your website takes less than three seconds to load, or if any changes you make have made any difference to speed? You can test your website speed first.
There are a few different tools available to help and many will also generate a report highlighting problem areas. This is helpful so you’re not left to guess.
Squarespace recommends that you either use their built-in tools, or a tool like Pingdom to ensure you’re getting accurate results. If you’re using the Google Chrome browser, you can follow these steps:
Open Developer Tools.
Click the Network tab.
Refresh the page to display the Load time.
One tool Squarespace doesn’t recommend is Google’s Pagespeed Insights. They say this is prone to error because it is designed for developers who code their sites from scratch and can return false negatives for Squarespace sites which are built on a custom CMS. That means if you use it and register an error, that doesn’t necessarily mean there’s anything wrong with page speed on your site.
Ways to speed up a Squarespace website
Here are a few areas where you may be able to reduce load speed of your site and of individual pages:
Reduce image sizes
This is a fundamental that we’d expect most designers to be familiar with, yet large image files are still often the culprit behind slow-loading pages. We know - you’re trying to strike the right balance with image quality and retain that sharp look onscreen, but you don’t need print quality images to achieve this.
Some key things to remember are:
Use JPG over PNG most of the time (some vector images don’t look so great in JPG).
Keep the image width low. Squarespace recommends that you don’t go beyond 1500 - 2000 pixels in width, although in some cases, you may be able to make them even smaller.
The Getty stock images or free Unsplash images you can download and add directly via Squarespace are often large. To make them smaller, you could download them from the page you’ve put them on and use an image resizing tool to reduce file size.
There are several free image resizing tools. For example: PicResize, ResizeImage and Tiny PNG.
Turn on SSL
A sort of “quick win” with Squarespace site speed is to make sure you’re using the SSL option. Why? Because your website will be delivered through the faster HTTP/2 protocol.
You could also consider switching on the HSTS option, which has been found to improve security and SEO. Both of these are found under Settings > Advanced > SEO and any changes may take up to 72 hours to become active.
Consider AMP for blog posts
Switching on AMP (Accelerated Mobile Web Pages) can significantly improve page speed for blog posts, particularly on mobile devices. It’s pretty important to remember mobile when you’re looking at page speed because so much browsing activity happens on mobile devices.
When AMP is switched on it will deliver very fast-loading blog pages to mobile users, as long as those have been accessed via a Google search.
AMP works by stripping out “non-essential” coding from a page and using smart caching to load pages quickly. It’s worth reading up on it first as it disables quite a few standard Squarespace blocks, such as form blocks and code blocks. Check out the information on AMP and test it out before choosing to run with it.
Watch third-party scripts
There are all sorts of third-party scripts you might be running on a Squarespace site, including those associated with plugins you choose to add. As a general rule, only add those that are absolutely necessary to achieve the functionality you need on your site - extras can slow you down.
If you’ve had your site going for a while and you’re not sure what impact third-party scripts are having on site speed, it’s worth doing an audit. The site speed tools we mentioned earlier can tell you which are slowing your site down.
The other thing we’d suggest is being quite discerning in the first place about which third-party plugins you allow. A general rule is to go for reputable, well-reviewed tools that have a clear history of regular updates by the owner. Plugins that aren’t kept updated can really drag a website down.
Don’t go too font-crazy!
We know. Some fonts are just so stylish, you have to have them on your website. Web fonts can really make the look of a website, but the problem is they can also drag down load speed.
There are a set of typefaces that are considered “web safe” with minimal impact on site speed, but of course those are your boring ones, like Times New Roman or Arial. Most people do opt to use some form of web fonts to spice up the look of the page.
Here are some things to consider:
There is some evidence to suggest that Google Fonts load more quickly than Typekit fonts. (Both of which are available in Squarespace’s web font library).
Try to stick with just one web font. If you go too “font-crazy,” it’s going to slow your site down.
Use custom video thumbnails
Do you have embedded videos on your Squarespace site? If so, choosing the custom thumbnail option for video embeds can help to improve speed.
There are a couple of reasons for this: firstly, without the custom thumbnail, Squarespace will have to look up content and load it from whichever site the video is uploaded too (e.g. YouTube or Vimeo). This happens even if the visitor doesn’t click on the video and could lead to a lag if large files are being loaded.
Secondly, doing without a custom thumbnail leaves you open to third-party cookies being run on your site - another speed bump.
Enable Ajax loading
If you are running Squarespace 7.0, certain templates allow you to enable Ajax loading (asynchronous Javascript and XML). This means it can tell browsers to load your website one page at a time, speeding the overall load time for visitors.
Ajax is supported in these template families:
Brine
Farro
Skye - Blog landing page only
Tremont
York
It is not available for Squarespace 7.1.
Download here: Checklist for Squarespace site speed
Final thoughts
Squarespace recommends that wherever possible, limiting your pages to below 5mb in size. This should keep you close to optimum performance speed-wise.
The tips listed above should keep your pages below that 5mb threshold. We’d also add that it’s important to avoid too many embeds on one page. These can otherwise invite third-party scripts to run and can inhibit your speed.
Questions? Comments? Drop us a line below and let us know your thoughts...
