What size should my images be for Squarespace?
We’ve all uploaded an image to Squarespace—only to cringe and delete it immediately!
Maybe it was too blurry, or didn’t fit the dimensions, or slowed down the page speed too much. Whatever the case, it wasn’t the right size.
Image sizes matter a lot when designing your Squarespace website. Too small, and your images will be blurry. Too large, and they will slow down your website speed and hurt your SEO.
While I CAN’T give you magic image dimensions for every image block, I CAN share the general image guidelines that I use when building Squarespace websites for my clients.
Image Dimensions vs File Size
Before we look at the best image sizes for Squarespace, know that there are actually TWO measurements you need to look out for.
Image dimensions - This refers to the actual width and height of your images, measured in pixels (px). The larger the dimensions, the better the image resolution.
File size - Meanwhile, the file size refers to how much memory or data your image takes up, and is measured in kilobytes (kb). The larger your file size, the longer it will take the image to load on your website.
If you have an image saved to your computer, you should be able to see both the dimensions and file size by hovering over the image. If that doesn’t work, simply open the image properties to check. Remember, both sizes are important!
Best Image Sizes for Squarespace
As a general rule of thumb, make your images 2500px wide and under 500 kb. Following this guideline ensures that your images stay high resolution, without taking up too much file space and slowing down your website.
For more specific image guidelines, use this list as a reference:
Banner images & backgrounds
A width of 2500px usually works fine for banner images and backgrounds, but it depends on how detailed the image is. Since it has to span your entire webpage, sometimes you may need to up the image width to 3000px to keep the high resolution.
Image blocks & thumbnails
For image blocks, the ideal size depends on how much space your image is going to take up. For small images, a width of 1500px is usually fine. But if your image block takes up half the screen or more, use a width of at least 2000px.
Icons
I suggest using a width of 500px for icons, which are usually pretty small. For your browser icon you can go even smaller, keeping the image between 100-300px and no more than 100kb.
Prepping Your Images for SEO
Images are searchable in Google, so they impact your SEO as well. Before you publish a new page or blog post on your Squarespace website, follow this checklist to make sure your images are SEO-friendly!
Compress the images. Most image files are much larger than 500 kb, which means you’ll need to compress them before uploading them to your Squarespace website. I use CompressJPEG to compress images for my site, but there are many different tools you can use.
Rename the image file. If your image file name is just a string of numbers, make sure you rename the file using target keywords that you want the image to rank for.
Add alt text. Lastly, make sure you add alt text describing your image. This makes your image more accessible, and helps search engines understand what your image is about.
Bonus tip: I often use Canva, an online graphic design platform (this is an affiliate link), to edit images and create custom graphics. In Canva, you can easily resize images to whatever your preferred dimensions are. However, sometimes an image that looks great on Canva looks blurry once you download it. If that happens, download the image at 2x the size so it stays crisp, then resize it on your computer.
