Substack has grown into one of the most popular newsletter platforms, and visuals play a big role in reader engagement. But heavy images can slow down load times, trigger email clipping, and frustrate readers on mobile connections. This guide covers how to compress and optimize images specifically for Substack newsletters.
Why Image Size Matters on Substack
Substack delivers content in two ways: via email and via the web. Images affect both:
- Email delivery: Gmail, Apple Mail, and Outlook all have rendering limits. Emails over 102 KB get clipped in Gmail, hiding your content behind a "View entire message" link. Large images directly contribute to this clipping.
- Web reading: Subscribers who read posts on Substack's website experience slow loading with unoptimized images, especially on mobile networks.
- Substack storage: While Substack doesn't currently impose strict per-image limits, excessively large files slow down the upload process and can cause issues.
Recommended Image Sizes for Substack
Substack's content area is approximately 680 pixels wide on desktop. Optimal image specs:
- Width: 1200–1400 pixels maximum (displays at 680 px, 2× for retina)
- File size: Under 200 KB per image is ideal; under 500 KB is acceptable
- Header/hero images: 1200 × 630 pixels at under 200 KB
- Inline content images: 800–1000 pixels wide at 80–150 KB
- Format: JPG for photos; PNG for graphics with text or transparency
How to Compress Images for Substack
The simplest approach is to use a browser-based compressor that handles everything automatically:
- Go to Picovert's free image compressor.
- Drop your image (JPG, PNG, or WebP) into the compressor.
- Download the compressed version. For most photos, this will be 60–80% smaller with no visible quality difference.
- If the image is too large in dimensions (wider than 1400 px), first resize it to an appropriate width, then compress.
Best Image Format for Substack
Substack supports JPG, PNG, GIF, and WebP. Choose based on your content:
- JPG: Best for photographs. Compresses extremely well — a high-quality photo at 85% JPEG quality is typically 5–10× smaller than the same image as PNG. Use JPG for hero images, behind-the-scenes photos, and any photographic content.
- PNG: Use for screenshots, infographics, and graphics with text overlaid. PNG keeps text sharp — JPEG artifacts can make text look blurry.
- WebP: Smaller than both JPG and PNG for the same quality. Substack's web interface handles WebP well, but some older email clients may not render it. Test before committing to WebP for email-first newsletters.
- GIF: Supported for animated images. Keep animated GIFs under 5 MB to avoid delivery issues.
Compressing Screenshot Images for Substack
Screenshots are common in newsletters — product demos, social proof, data visualizations. Screenshots saved as PNG are often unnecessarily large because they capture at full retina resolution (2×). Tips:
- Resize the screenshot to 1200–1400 px wide before inserting into Substack. A 2880 px wide retina screenshot can be halved with no visible quality loss.
- Use PNG compression to strip metadata and optimize the Deflate compression.
- If the screenshot has no transparent areas, saving as JPG can reduce file size 60–80% compared to PNG.
Avoiding Gmail Email Clipping
Gmail clips emails over 102 KB of total HTML (including inline styles). Images hosted externally (as Substack does) don't count toward this limit — but heavy use of embedded content and large newsletters in general can still trigger clipping. Keeping individual images optimized ensures your overall email stays lean.
Batch Compressing Images Before Publishing
If you use multiple images per newsletter, compress them all at once with Picovert's batch image compressor. Drop all your images at once, download the compressed versions, and upload to Substack. This workflow takes under two minutes and can cut your total image payload by 50–80%.
Tips for Fast-Loading Substack Newsletters
- Limit images per email: One hero image plus 2–3 supporting images is sufficient for most newsletters. Every additional image adds to load time.
- Use descriptive alt text: Substack allows you to add alt text to images. This helps readers who have images disabled in their email client.
- Avoid very wide images: Images wider than 1400 px offer no visual benefit (Substack renders them at 680 px) but increase file size.
- Test on mobile: Most Substack readers open newsletters on their phones. Check how images look at 375–414 px width before publishing.