A single uncompressed hero image can add three full seconds to your Squarespace page load. That delay shows up in Google's Largest Contentful Paint (LCP) metric, which directly affects how your pages rank. Squarespace image SEO covers three things: what you name your files, what you write in the alt text field, and how heavy your images are when they hit the browser. Get all three right and your pages load faster, rank higher, and become accessible to screen readers. Miss any one of them and you are leaving visibility on the surface.
Most of this work happens before you upload a single file. Squarespace does handle some optimization automatically, but the platform cannot read your mind about file names, alt descriptions, or whether that 6,000-pixel-wide PNG actually needs to be that large. This guide walks through every step, clearly marking what the platform handles for you and what you need to do yourself.
What Squarespace Handles Automatically (and What It Does Not)
Squarespace applies a few behind-the-scenes optimizations the moment you upload an image. It generates multiple scaled versions of each file so browsers can request the size that fits the visitor's screen. It also serves images through its own CDN and, on version 7.1 sites, converts many images to WebP format on the fly for browsers that support it. These are real performance gains you get for free.
Here is what Squarespace does not do:
- Rename your file. If you upload
IMG_3847.jpg, that exact string stays attached to the image internally. Google sees it. - Write alt text. The alt text field starts blank on every image block, gallery item, and banner. You fill it in or it stays empty.
- Compress beyond its own resizing. If your original file is 8 MB, Squarespace will serve scaled-down versions, but the initial upload still affects your editor speed, and the platform's automatic sizing is not a substitute for proper compression before upload.
- Change your color profile. Images saved in CMYK (a print color mode) can render with muddy, shifted colors on screen. Squarespace does not convert them to RGB for you.
Understanding this split is the key to Squarespace image SEO. The platform gives you a solid baseline, but the work that actually moves your rankings and page speed is manual. For a deeper look at how Squarespace handles broader SEO concerns, the complete guide to Squarespace SEO covers the full picture beyond images.
Step 1: Name Your Image Files Before You Upload
File names are the first signal search engines read when indexing an image. A file called IMG_4221.jpg tells Google nothing. A file called hand-thrown-ceramic-mug-white-glaze.jpg tells it exactly what the image contains.
Rename every image on your computer before dragging it into Squarespace. Use lowercase letters, separate words with hyphens, and describe the subject plainly. Keep it under five or six words. Skip filler words like "the" or "a."
Before: DSC_0094.jpg
After: outdoor-yoga-class-portland.jpg
If you run a service business, work the service and location into the file name where it fits naturally. A therapist in Austin might name a headshot therapist-headshot-austin-tx.jpg. A nonprofit might use volunteer-event-food-bank-2026.jpg. This is one of the simplest wins in Squarespace image SEO and it costs zero dollars. The tricky part is building the habit of renaming files before they hit your media library, because Squarespace does not let you rename files after upload.
Step 2: Choose the Right File Format
Three formats matter for web images in 2026: JPEG, PNG, and WebP.
- JPEG is the default for photographs and images with smooth gradients. It compresses well and keeps file sizes small. This is the right choice for most photos on your Squarespace site.
- PNG supports transparency, which makes it necessary for logos, icons, and overlays where you need a see-through background. PNGs run larger than JPEGs for photographs, so avoid using them for full-width hero images or blog post photos.
- WebP delivers smaller files than both JPEG and PNG at similar quality. Squarespace 7.1 automatically converts uploaded JPEGs and PNGs to WebP for browsers that support it, which is now nearly all of them. You can also upload WebP files directly.
The practical rule: use JPEG for photos, PNG for graphics with transparency, and WebP if you want to squeeze out extra performance and your workflow supports exporting to that format. If you are exporting from design software, save photographs at quality level 80 out of 100. The difference between 80 and 100 is invisible to most people, but the file size difference can be dramatic.
Step 3: Compress and Resize Images Before Uploading
Even with Squarespace's automatic resizing, uploading a 5,000-pixel-wide image when your content column maxes out at 1,500 pixels is wasteful. The platform will serve a scaled version to visitors, but you are still storing and transferring more data than necessary, and the original file size can slow down Squarespace's own editor interface. It also affects your LCP score during the initial load on slower connections.
Target Dimensions
For full-width banners and hero images, 2,500 pixels wide is a practical ceiling that covers retina displays without going overboard. Blog post images and in-content photos usually look sharp at 1,500 to 2,000 pixels wide. Logos and icons should be sized to their actual display dimensions, often under 400 pixels. There is no benefit to uploading a 3,000-pixel-wide logo that displays at 200 pixels.
Compression
Run every image through a compression tool before uploading. Free options like Squoosh (built by the Google Chrome team) let you drag in a file, adjust quality with a slider, and see a real-time side-by-side comparison. Export at 80% quality for JPEG and you will typically cut file size by half or more with no visible loss. For PNG files, tools that strip unnecessary metadata and optimize color palettes can reduce sizes without touching image quality at all.
If you want to optimize for mobile performance specifically, image compression is probably the single highest-impact change you can make. Mobile connections are slower and mobile screens are smaller, so the gap between an optimized image and an unoptimized one hits harder on phones.
Step 4: Write Alt Text in Squarespace
Alt text serves two audiences: screen readers used by visually impaired visitors, and search engine crawlers that cannot interpret pixels. Both rely on your text description to understand what an image shows. Leaving alt text blank means Google indexes the image with no context, and screen reader users hear nothing or just the file name.
How to Add Alt Text in Squarespace 7.1
For standard image blocks, click the image in the editor, open the pencil icon or image settings panel, and type your description in the field labeled "Image description" (Squarespace uses this label instead of "alt text," but it maps directly to the HTML alt attribute). For gallery blocks, click the gallery in the editor, then click an individual image to open its settings. The description field works the same way.
Gallery images are the most commonly missed. If you have a portfolio or project gallery with 20 images and zero descriptions, that is 20 missed opportunities for both accessibility and image search. Set aside ten minutes, open each gallery image, and write a short description.
How to Write Good Alt Text
Describe what the image shows in plain, specific language. Aim for one sentence, roughly 8 to 15 words. Skip "image of" or "photo of" because screen readers already announce that it is an image.
Weak: "Team photo"
Better: "Five volunteers sorting donated coats at the December food drive"
Include your target keyword in alt text only when it genuinely describes the image. If you are writing a blog post about pottery workshops, an image of a potter at a wheel could naturally include "pottery workshop" in the alt text. An image of your office building should not. Keyword stuffing alt text is a bad practice for accessibility and can look spammy to search engines.
For decorative images that carry no informational value (a color gradient, an abstract divider line), best practice is to leave the alt text field empty. Screen readers will skip these, which is the correct behavior. But any image that communicates something to sighted users needs a description. When designing pages for your services page or homepage above the fold, every hero image and feature photo should carry alt text.