How to prepare images for a Wix or Squarespace website

Both platforms run uploaded images through a CDN that generates multiple sizes for different devices, screen densities, and layout placements. When your site loads on a phone, the CDN serves a smaller image than when the same page loads on a 27-inch desktop monitor. Both platforms also convert to WebP automatically for browsers that support it, which has been the default for several years.

This means the format you upload is less important than you might think. Upload a JPG and the platform serves WebP to most visitors. Upload a PNG and the platform serves WebP to most visitors. The platform handles format conversion automatically, so optimizing format yourself is mostly redundant.

What does matter is dimensions and quality. Both platforms scale down from your original — they do not invent additional pixels. If you upload a 600-pixel-wide image to a position that needs 1,200 pixels on a retina display, it displays soft. The platform can downsample but it cannot upsample cleanly. The right rule is to upload at the largest size you think you might ever need, then let the platform handle the smaller sizes automatically.

• Both platforms auto-convert uploaded images to WebP for compatible browsers.
• Both generate multiple sizes from your upload via their CDN.
• Format choice on upload matters less than dimensions and source quality.
• Upload at the largest size you might need; the platform handles smaller sizes automatically.

Wix accepts uploads up to 25 MB per image for most plans (15 MB on the Free plan), with supported formats including JPG, JPEG, PNG, BMP, TIF, and WebP. The platform recommends, but does not enforce, that hero images be at least 2,000 pixels wide for full-bleed layouts.

For a typical Wix site, these dimensions work well as upload targets across most use cases. Hero or full-width banner: 2,560 by 1,440 pixels — large enough for 4K displays, generates clean smaller sizes for everything else. Section background or large content image: 1,920 by 1,080 pixels. Product or portfolio image: 1,600 pixels on the long edge. Thumbnail or icon-style image: 800 pixels on the long edge. Profile photo or small avatar: 600 by 600 pixels.

Wix supports image galleries with dozens or hundreds of photos, and the upload interface accepts batch uploads of multiple files at once. For galleries with many images, batch-prepare the entire set to the same target dimensions before uploading. The Image Resizer handles batch resize in one operation, which avoids the slow process of uploading then re-uploading wrong-sized images.

• Wix accepts up to 25 MB per image on paid plans, 15 MB on Free.
• 2,560 by 1,440 is the safe target for hero images; smaller for content placements.
• Wix CDN generates smaller sizes automatically from the upload.
• Batch-prepare gallery images to consistent dimensions before uploading.

Squarespace accepts uploads up to 20 MB per image with similar format support. The platform applies an automatic image processing pipeline that aggressively re-encodes large uploads to keep storage and bandwidth costs manageable. This means uploading a 20 MB photo wastes upload bandwidth but does not produce a higher-quality final result than a well-prepared 1 MB version of the same image.

Squarespace recommends, and most templates expect, these target dimensions. Banner or hero image: 2,500 pixels on the long edge. Index or gallery image: 1,500 pixels on the long edge. Block image (inside a content section): 1,500 pixels on the long edge. Thumbnail image: 1,000 pixels on the long edge.

Squarespace serves images through its Fluid Engine layout system in version 7.1, which adapts image cropping to the layout. For images that need to display in specific aspect ratios across different breakpoints, upload at the largest aspect ratio you intend to show and let the platform crop dynamically. For images where exact composition matters (a person face needs to stay centered), upload pre-cropped to the displayed aspect ratio.

• Squarespace accepts up to 20 MB per image.
• 2,500 pixels on the long edge is the safe banner target.
• Fluid Engine crops dynamically across breakpoints in version 7.1.
• Pre-crop to displayed aspect ratio when exact composition matters.

The same workflow works for both platforms. Start with the largest source image you have, prepare it once to your platform target dimensions, compress it, and upload.

First, resize. Use the Image Resizer to bring images down to the dimensions your platform targets (2,500 pixels for hero images, 1,500 to 2,000 pixels for content images, smaller for thumbnails). Resize is the biggest single contributor to file-size reduction — a 6,000-pixel phone photo resized to 2,000 pixels is roughly nine times smaller in pixel area before any compression has been applied.

Second, compress. Use the Image Compressor at JPG quality 82 to 88 for photographic content. This produces files of 200 to 600 KB for typical content-area images, and 400 KB to 1 MB for hero-size images. The compressed files retain visible quality through the platform processing pipeline and produce noticeably faster page loads than uncompressed uploads.

Third, name files descriptively before uploading. Both Wix and Squarespace use the file name as the basis for the image alt text, and meaningful file names support both SEO and accessibility. blue-leather-handbag-front.jpg is much more useful than IMG_2847.jpg in both contexts.

• Resize first, compress second — resize produces the biggest savings.
• JPG quality 82 to 88 is the right balance for content images on both platforms.
• Descriptive file names become the default alt text basis for SEO and accessibility.
• Run a full batch through resize and compress once, then upload everything at once.

Both platforms expose alt text fields for every uploaded image, but neither prompts users to fill them in. Empty alt text harms SEO (Google uses image alt text as part of page understanding) and harms accessibility (screen readers cannot describe an image with no alt text to vision-impaired users).

Write alt text that describes the content, not the role. Hero banner is not useful alt text. A craftsperson sanding a wooden chair in a workshop is genuinely descriptive and serves both crawlers and screen-reader users. For purely decorative images that add no informational value (background patterns, dividers, decorative shapes), set alt text to empty — both platforms accept this and screen readers will skip the image.

For ecommerce or portfolio sites, the alt text should describe the product or work, not generic concepts. Red ceramic mug with white interior, side view beats ceramic mug for both search ranking and screen-reader experience.

• Both platforms have alt text fields; both let you leave them empty (do not).
• Write alt text that describes content, not the role on the page.
• Decorative images should have empty alt text, not absent alt text.
• Product alt text should be specific (color, material, view), not generic.

A few mistakes are particularly common when site owners upload images for the first time.

Uploading directly from a phone via the mobile editor often pulls images at their highest resolution from the camera roll. This is fine if you have prepared the images beforehand, but if you are pulling raw camera-roll photos straight into a site, the platform processing pipeline has to handle the full resolution upload. The phone upload also tends to be slower and more failure-prone than desktop upload over wifi.

Using PNG for photographic content is another common mistake. Even though both platforms auto-convert to WebP for delivery, the upload itself is the original PNG, which can be five to ten times larger than the equivalent JPG. The result is slow uploads, more storage burn, and identical end-user experience. Use JPG for photos and reserve PNG for screenshots, logos, and graphics with transparency.

Replacing existing images by uploading new versions with the same file name often does not work as expected. Both platforms treat each upload as a separate asset with its own unique URL. To replace an image, delete the old one and upload the new one, then re-place it in the layout — do not assume same-filename overwrite will update existing placements.

Finally, ignoring the platform image gallery management tools and uploading the same image to multiple pages produces multiple copies in the asset library. For an image used across many pages (a logo, a footer photo, a recurring product shot), upload once and reference from the asset library rather than re-uploading.

• Prepare images on desktop before uploading; mobile direct-upload is slow and unprocessed.
• Use JPG for photos even on platforms that convert to WebP automatically.
• Same-filename uploads do not overwrite existing platform assets.
• Reuse images from the asset library rather than uploading the same file multiple times.