Image SEO for CMS Sites: Alt Text, Compression, and Lazy Loading Done Right
Images are half your page weight and a whole search channel most sites ignore. Here is how to handle alt text, file names, compression, and lazy loading so images help your rankings instead of dragging them down.
Image SEO: The Channel and the Speed Tax Hiding in Your Media
Images do double duty in SEO, and most sites get both halves wrong. On one side, images are typically the heaviest thing on a page — the main reason a site fails Core Web Vitals. On the other, image search is a real discovery channel, and alt text is an accessibility requirement Google reads as a ranking signal. Handle images well and you get faster pages and a second stream of traffic. Ignore them and you pay a speed tax for nothing.
Here is how to do image SEO properly on a CMS-driven site, where the same rules have to scale across every post and every editor.
Alt text: write it for a person who cannot see the image
Alt text is the description a screen reader announces and the text Google reads to understand what an image shows. The right mental model is simple: describe the image accurately and specifically to someone who cannot see it.
- Be specific, not generic. 'Webflow SEO settings panel showing the title tag field' beats 'screenshot.'
- Include a relevant keyword only when it fits naturally. Alt text is not a place to stuff terms; forced keywords read badly and help nothing.
- Skip 'image of' and 'picture of.' The screen reader already announces it is an image.
- Leave decorative images with empty alt so assistive tech skips them rather than reading noise.
On a CMS, make the alt-text field part of your media workflow so editors fill it in at upload time. Most sites have thousands of images with no alt text purely because it was never a required step.
File names matter before the upload
webflow-seo-checklist.jpg tells Google something. IMG_4821.jpg tells it nothing. Rename image files descriptively, with hyphens between words, before you upload them. It is a thirty-second habit that adds a small, free signal to every image.
Compression and format: where the speed lives
This is the half that protects your Core Web Vitals. An uncompressed hero image can be several megabytes; the same image done right can be under two hundred kilobytes with no visible quality loss.
- Resize to display dimensions before uploading. Serving a 4000-pixel image into a 1200-pixel slot wastes most of the bytes you send.
- Compress every image. Run photos through a compressor; the quality difference is usually invisible and the size difference is enormous.
- Use next-gen formats. WebP is dramatically smaller than JPEG or PNG at the same quality and is supported everywhere that matters now.
- Serve responsive sizes. A good CMS (Webflow does this automatically for Designer images) generates multiple resolutions and lets the browser pick the right one for each device.
Every kilobyte of image weight is borrowed from your LCP score. Compression is not a nice-to-have — it is the single highest-impact speed fix on most sites.
Lazy loading: helpful, with one exception
Lazy loading defers off-screen images until the user scrolls toward them, so the initial load only fetches what is visible. It is a clear win — with one important exception.
- Lazy-load everything below the fold. Most CMS platforms, Webflow included, do this by default.
- Do not lazy-load your LCP image. The hero or first large image should load eagerly, because lazy-loading the very element Core Web Vitals measures will make your LCP worse, not better.
The image SEO checklist
- Descriptive, hyphenated file names set before upload.
- Accurate, specific alt text on every content image; empty alt on decorative ones.
- Images resized to display size and compressed.
- Next-gen formats (WebP) wherever supported.
- Responsive sizes served automatically by the CMS.
- Lazy loading on below-the-fold images, eager loading on the hero.
None of this is difficult, but all of it has to be habitual, because images accumulate faster than any other content type. Bake these steps into your upload workflow and every image you add makes the site a little faster and a little more discoverable — instead of a little slower for no return.
Quilly is the AI content engine that writes, publishes, and ranks CMS content on autopilot — pulling real keyword demand, drafting on-brand articles, and pushing them straight to Webflow, WordPress, or a headless CMS. If you would rather rank than spend your week wrestling with SEO settings, start free.