Roundup No. 3 // Your photographer sent 40 gorgeous photos at 12 MB apiece. Please do not upload them like that.
The sizes, formats, and free tools I use to keep a website fast without making the photos look worse.
Short answer: Before uploading to Squarespace, resize photos to 1500 to 2500 pixels wide, save them as JPGs, and compress them to under 500 KB. Compress videos with HandBrake before they go anywhere near your site. Smaller files load faster, and faster sites keep visitors and rank better.
Why does file size matter?
A slow site loses people before they see anything. Page speed is also one of the signals Google uses when it ranks pages, and oversized images are the most common reason a small business site drags. It is the first thing I check in an SEO audit.
The good news: this is the easiest speed problem to fix, and the tools are free.
What size should images be for Squarespace?
Full-width banners and backgrounds: 2500 pixels wide.
Everything else (photos in the page, galleries, blog images): 1500 pixels wide is plenty.
File size: under 500 KB each. Most photos can land well under that with no visible difference.
Format: JPG for photographs. PNG only when you need a transparent background, like a logo.
Squarespace creates smaller versions of each image for phones and tablets on its own, but it starts from whatever you upload. Hand it a 12 MB file and every version is heavier than it needs to be.
How I compress images
Resize first. Export or resize the photo to 1500 or 2500 pixels wide. This step does most of the work.
Then compress. Run it through TinyPNG. Drag the files in, download the smaller versions. It handles JPG and PNG.
Name the file like a human. A name like denver-family-law-office.jpg tells Google what the photo shows. IMG_4471.jpg tells it nothing.
Write alt text once it is uploaded. One plain sentence describing the image. It helps people using screen readers, and it helps your images show up in search.
Every photo in my portfolio went through these four steps, including the office shots on the Natalie Teston Family Law site.
How I compress video
Video is where sites get truly heavy. A ten-second background clip straight off a phone can outweigh every photo on the page combined.
I use HandBrake, a free, open source video transcoder. A good starting point for web video:
Format: MP4 (H.264).
Resolution: 1080p. Nobody needs 4K behind a headline.
Length: keep background loops short, around 10 to 20 seconds.
Audio: remove it for background video. It plays silently anyway.
Longer videos, like interviews or tutorials, are better hosted on YouTube or Vimeo and embedded, so your site is not carrying the file.
Frequently asked questions
What is the best image size for Squarespace?
2500 pixels wide for full-width banners and 1500 pixels wide for everything else, saved as a JPG under 500 KB.
Does compressing images reduce quality?
Not visibly, when it is done in this order: resize, then compress. The file gets much smaller, and the photo looks the same on screen.
Do images affect SEO?
Yes, in two ways. Large files slow the page, which hurts rankings. And descriptive file names and alt text help search engines understand what is on the page.
Why is my Squarespace site loading slowly?
Oversized images and uncompressed video are the usual cause. Start with the homepage banner; it is often the heaviest file on the site.
Should I upload video directly to Squarespace or embed it?
Short background clips can be uploaded directly once compressed. Longer videos load better embedded from YouTube or Vimeo.
Rather not resize a single photo? Every website I build launches with compressed images, alt text, and SEO in place, and a Well Kept plan keeps it that way. Still choosing a platform? Here is my take on Squarespace vs. WordPress.
