June 21, 2026

Image SEO: How to Compress Media in WordPress

Image SEO workflow result graphic

Most image SEO guides repeat the same ten tips. Compress your images. Write alt text. Use descriptive file names. All true, and none of it specific enough to actually do anything with.

This guide is different. It’s the exact workflow we run at Momentum on every image we publish, for our own site and for client sites: the tool settings, the sizing math, and real before-and-after file sizes from our own compression tests. By the end you’ll be able to run the same process in about five minutes per image.

What Is Image SEO?

Image SEO is the practice of optimizing the images on your website so they load fast and rank in search. It covers file dimensions, file size, format, file names, alt text, and the context around each image. Done well, it improves page speed, Core Web Vitals, and your visibility in Google Images.

That’s the textbook answer. The practical answer is simpler: images are usually the heaviest files on a page, and the easiest ones to fix.

Why Image Optimization Matters More in 2026

Three reasons this stopped being optional.

Speed. On most small business websites, images account for more page weight than everything else combined. A single 3 MB photo uploaded straight from a phone can do more damage to your load time than your entire theme. Page speed feeds directly into Core Web Vitals, which is part of how Google evaluates your site. (If your scores are bad for reasons beyond images, that’s a technical SEO problem, and a different conversation.)

Image search is a real traffic channel. Google Images drives a meaningful share of all search traffic, and images now show up inside regular results, shopping results, and AI-generated answers. Google’s own image SEO documentation spells out exactly what it looks at: file names, alt text, surrounding content, and page quality.

AI search pulls from the same index. AI Overviews and similar features select images from pages Google already understands well. Optimized images give your content more ways to appear, even on searches where nobody clicks through. (We wrote about that shift in our guide to zero-click searches.)

Our 4-Step Image Optimization Workflow

Here’s the whole process up front: size the image to its container in Canva, compress it to WebP in Squoosh, name it and write the alt text with AI assistance, then upload and verify. Four steps. Two free tools. Now the details, because the details are where everyone gets it wrong.

Step 1: Size the Image to Its Container in Canva (at 2x)

Most oversized images happen because nobody checked how big the image actually displays. If your blog content area is 800 pixels wide, a 4,000-pixel photo is wasted weight. The browser downloads all of it and throws most of it away.

So the first step is finding your container width. Right-click the spot where the image will live on your page, hit Inspect, and read the width of the content area. Most WordPress blog layouts land somewhere between 700 and 900 pixels.

Then create the image in Canva at twice that width. Container is 800px? Set a custom canvas of 1600px wide. The 2x matters: most phones and many laptops have high-density screens that pack two or more physical pixels into every display pixel. Export at exactly 800px and your image looks soft on every iPhone. Export at 2x and it stays sharp, and the compression step below cancels out most of the extra weight.

Use Canva’s custom dimensions when you create the design, or Resize if the design already exists, then download as PNG. PNG comes out of Canva cleaner than JPG, and the format won’t matter in a minute anyway.

Canva custom size dialog set to 738 by 524 pixels, matching the container width measured in Chrome DevTools

Step 2: Compress to WebP in Squoosh

Squoosh is a free, browser-based compression tool built by Google. No account, no upload limit, and it shows you a live side-by-side preview while you adjust settings, which is the entire reason we use it over set-and-forget plugins.

Drag your Canva export in. On the right panel, set the format to WebP. Then work the quality slider. We start at 75 and adjust from there by eye, using the slider in the middle of the preview to compare the original against the compressed version.

What to watch while you adjust: text edges and fine lines fall apart first. If your image has overlay text and it starts looking fuzzy, nudge the quality up. A pure photo with no text can usually go lower than a graphic can. There’s no single magic number, which is exactly why a tool with a live preview beats one without.

Squoosh side-by-side view compressing a 3.03 MB image to a 100 KB WebP file at quality 75

The file size readout in the bottom corner tells you what you saved, and it’s also your target. Our house rule: get every image under 100 KB. Most images hit that comfortably at quality 75 or below. If an image can’t get there without visibly degrading in the preview, don’t force it — under 150 KB is still fine for a standard in-content image, and up to 250 KB for a large hero. But 100 KB is the number we aim at first, and most images make it.

Download the WebP and you’re two steps from done.

Step 3: Name the File and Write the Alt Text (AI Drafts, We Verify)

Search engines can’t see your image. They read the file name, the alt text, and the content around it. Which means IMG_4382.png tells Google nothing, and a good descriptive name is free relevance.

We use AI for the first draft of both. A prompt like this does the job:

“I’m attaching an image from a blog post about [topic]. Write a lowercase, hyphen-separated file name (3-6 words) and one alt text sentence under 125 characters describing what the image actually shows. No keyword stuffing.”

Then a human checks it. That order matters. AI is fast at describing images, but it doesn’t know your page context and it will happily over-optimize if you let it. The check takes ten seconds: does the file name describe the image, and does the alt text describe what’s actually in it?

For calibration, Google’s own documentation gives an escalation that’s worth memorizing:

  • Bad: no alt text at all
  • Also bad: “image seo tips best image seo optimize images seo” — keyword stuffing is a named spam violation, not a gray area
  • Okay: “puppy”
  • Best: “Dalmatian puppy playing fetch” — specific, descriptive, natural

File names follow the same logic: lowercase, hyphens between words, descriptive, short. squoosh-webp-compression-settings.webp beats final-image-v3.webp every time.

Step 4: Upload and Verify

Upload the WebP to your WordPress media library, paste the alt text into the alt text field, and place the image. Then verify two things on the live page.

First, eyeball it on a phone. If it looks soft, your container math was off or you skipped the 2x.

Second, run the page through PageSpeed Insights. You’re looking for the image-related audits, “Properly size images” and “Serve images in next-gen formats,” to stop flagging the images you just processed. When those warnings disappear for your images, the workflow did its job.

Should You Use AVIF Instead of WebP? (The Honest WordPress Answer)

If you’ve researched image formats, you’ve seen AVIF called the future. The compression claims are true: AVIF files come out roughly 20–30% smaller than WebP at the same visual quality, and browser support now covers about 95% of users.

So why isn’t it our default? Three practical reasons.

  • WordPress support has an asterisk. WordPress has supported AVIF in core since version 6.5, so uploads and display work on any current install. But WordPress generates its thumbnail sizes using your host’s image library, and plenty of hosting environments still ship libraries that can’t process AVIF. The original displays fine; the resized versions silently fail. Whether that bites you depends entirely on your host.
  • Canva doesn’t export it. AVIF can only enter this workflow at the Squoosh step, and AVIF encoding is noticeably slower than WebP.
  • The gain is marginal once you’ve done the rest. Going from a 1.8 MB PNG to a 140 KB WebP is the win that moves your scores. Going from 140 KB to 105 KB is a rounding error on most pages.

Our verdict: WebP as the default for everything. AVIF selectively for your heaviest hero images if you want the last few percent, and only after testing one on your own hosting to confirm the thumbnails generate. If a guide tells you AVIF is simply “the new standard,” it was written by someone who hasn’t uploaded one to a budget WordPress host.

Image SEO Best Practices Beyond the Workflow

The workflow handles each individual image. These site-level practices round out the job.

  • Use HTML image elements, not CSS backgrounds. Google does not index CSS background images. If your design buries key visuals in CSS, they’re invisible to image search entirely. This catches a surprising number of design-heavy sites.
  • Lazy-load below-the-fold images. Images further down the page shouldn’t load until the reader scrolls toward them. WordPress does this by default now; just don’t lazy-load the first image at the top of the page, since that delays the largest visible element.
  • Submit an image sitemap. It helps Google find images loaded through galleries or JavaScript. Yoast and similar SEO plugins handle this automatically.
  • Set a preferred image. Your og:image tag and ImageObject schema tell Google which image represents the page. Without them, Google picks, and it sometimes picks your logo.
  • Use captions where they help the reader. Captions are among the most-read text on a page. Write them for humans; skip them when they’d just repeat the heading.
  • Link images to relevant pages with descriptive context. A product image should link to the product. A chart should sit next to the text it supports. Placement is a ranking signal; Google says so directly.

Already have a library full of heavy images? The workflow above is for new images you’re about to publish. To find and fix the oversized files already on your site, the walkthrough below shows the full process inside WordPress: sorting the media library by size, replacing files without breaking your layout, and confirming the result. The tool in the video is TinyPNG rather than Squoosh, but the principle is the same. Resize first, compress hard, keep web images small. We aim for under 100 KB; the video uses 200 KB as a safe ceiling.

One more that most guides skip: your Google Business Profile photos are image SEO too, with their own rules and their own payoff in local results. We covered that side separately in our guide to adding and optimizing photos on your Google Business Profile.

Image SEO FAQ

How do I make images SEO friendly?

Size them to roughly twice their display width, compress them to WebP, give them a descriptive hyphenated file name, and write alt text that says what the image shows. That covers about 90% of image SEO for a typical website. The workflow above walks through each step with the exact tools.

What is the best image size for a website?

There’s no universal number, because it depends on your layout. The rule that always works: twice the width of the container the image displays in. For most WordPress blog layouts that means 1400–1800 pixels wide for in-content images, then compressed hard. Our target is under 100 KB per image; if quality won’t allow it, under 150 KB for standard images and under 250 KB for a large hero still keeps you in good shape.

Does alt text help SEO?

Yes. Alt text is the primary way Google understands what an image shows, and it’s how screen readers describe images to visually impaired visitors. Write one natural sentence describing the image. Stuffing keywords into alt text is a spam policy violation and can hurt the page.

Is WebP better than JPEG for SEO?

For web use, almost always. WebP produces files 25–35% smaller than JPEG at comparable quality, supports transparency like PNG, and works in every modern browser. The format itself isn’t a ranking factor; the speed it buys you is what helps.

Fast Images, Better Rankings, No Developer Required

None of this requires a budget or a plugin stack. Two free tools, four steps, about five minutes per image. The payoff is a measurably faster site, eligibility in an image search channel most small businesses ignore, and content Google can actually understand.

And if you ran the numbers on your own site and realized you have 400 unoptimized images and zero desire to fix them one at a time, that’s a fair conclusion. It’s also literally what we do. Request a free SEO audit and we’ll show you exactly how much speed your images are costing you, along with everything else we find.

Rewritten June 2026 with our full workflow and compression test data

Leave a Reply

Your email address will not be published. Required fields are marked *

Step 1 of 4

WANT MORE LEADS & TRAFFIC?

Answer these quick 3 questions to get a customized marketing audit and strategy to improve your website and rank higher on Google.
Author picture

“My name is Mac and I used to work for Google. Now I help small businesses grow online and rank higher on Google”