WordPress Image SEO: Compression, Alt Text, WebP and Lazy Loading for Blogs
WordPress Image SEO: Fix It Before You Upload
Most image problems on a WordPress blog are created at upload time. A 5 MB phone photo, a file called IMG_4821.jpg, and an empty alt field will survive any amount of good writing and still slow the page down and tell search engines nothing.
WordPress image SEO is the habit of preparing, describing and loading images so they are fast, accessible and understood by search engines. This guide covers what to do before you upload, what image plugins actually do for you (and what they cannot), how to write alt text for different kinds of images, the lazy loading mistakes that hurt Largest Contentful Paint (LCP), and a quick audit you can run in five minutes.
Quick answer: Resize images to the width your theme actually displays, save photos as WebP (or AVIF where your setup supports it), compress them, use a descriptive hyphenated file name, write alt text that describes what the image shows (and leave it empty for purely decorative images), lazy load everything below the fold, and never lazy load the top-of-page image.
Why Image SEO Matters for Bloggers
Images are usually the heaviest assets on a blog post, so they have the biggest effect on load speed and on Core Web Vitals. They are also a discovery channel in their own right: descriptive file names, alt text and surrounding text are how Google Images and visual search understand a picture. Alt text also does a second job that matters just as much, because it is what screen reader users hear in place of the image.
You do not need a complicated setup. You need a repeatable routine, applied before the file reaches your media library.
What to Do Before You Upload
1. Resize to the displayed width
Check how wide your post content column really is (often 700 to 900 px) and export in-content images at roughly that width, or at most twice that for sharp display on high-density screens. Full-width hero images rarely need more than 1600 to 2000 px. WordPress scales down originals larger than 2560 px, but that is a safety net, not a plan: a smaller source keeps your media library and backups lean.
2. Pick the right format
| Format | Use it for | Rule-of-thumb size target |
|---|---|---|
| WebP | Photos and graphics; the safe modern default | Hero under about 150 KB, in-content under about 100 KB |
| AVIF | Photos where you want the smallest files; check your plugin or CDN supports it and keep a fallback | Often 20 to 30 percent smaller than WebP at similar quality |
| JPEG | Fallback for photos | Under about 200 KB for a hero |
| PNG | Screenshots or graphics that need transparency; avoid for photos | Keep dimensions small |
| SVG | Logos and simple icons | Usually a few KB |
The size targets are guidelines, not Google requirements. A detailed photograph may need more; a simple graphic needs far less. WordPress has accepted WebP uploads since version 5.8 and AVIF since 6.5, and current versions of all major browsers display both formats.
3. Compress
Run the export through a compressor such as Squoosh before upload, or leave it to a plugin (see below). Lossy compression at a moderate setting is usually invisible on photos. Always look at the result at full size before you bulk-apply a setting.
4. Name the file
Use lowercase words separated by hyphens that describe the image: pruning-tomato-seedlings.webp, not IMG_4821.jpg. Skip keyword stuffing; one or two accurate words are enough. A good file name is a small signal, but it is free and takes ten seconds.
What Image Plugins Do (and What They Cannot)
Plugins such as Imagify, ShortPixel and Smush take care of the repetitive work:
- Compress new uploads automatically, and bulk-compress your existing library.
- Convert JPEG and PNG files to WebP, and in some cases AVIF.
- Serve the modern version to browsers that support it and the original to those that do not.
- Optionally hand delivery to a CDN that resizes and converts on the fly.
What they cannot do is fix a wrong starting point. A plugin will not know your content column is 800 px wide, will not write meaningful alt text, and will not tell you that your hero image is being lazy loaded. Treat plugins as a safety net behind your upload routine, and run one image optimizer at a time: two plugins converting the same files tend to cause duplicate or broken output. If you are comparing tools more broadly, see our guide to the best SEO tools for bloggers in 2026.
Alt Text Patterns: Informative vs Decorative
Alt text is not a keyword field. It is the text equivalent of the image for anyone who cannot see it, and search engines read it for the same reason. The right pattern depends on what the image does on the page.
| Image type | What to do | Example |
|---|---|---|
| Informative photo | Describe what it shows and why it is there | alt="Hands pruning a tomato seedling with small garden shears" |
| Screenshot or diagram | State the point it makes, not "screenshot of" | alt="Media Library list view showing the oversized files sorted by size" |
| Functional image (a linked image or button) | Describe the action or destination | alt="Download the image audit checklist" |
| Decorative image (a divider, a background flourish, a photo that adds nothing the text does not already say) | Use an empty alt attribute so screen readers skip it | alt="" |
A few rules keep this simple. Keep alt text short, usually under about 125 characters. Do not start with "image of" or "picture of", because screen readers already announce an image. Include your target keyword only when it genuinely describes the picture, and only once. And note the difference between a missing alt attribute and an empty one: an empty alt="" is a deliberate signal that the image is decorative, while a missing attribute makes some screen readers read out the file name instead.
In WordPress, the alt text field in the Media Library or the block sidebar sets the attribute. The caption and title fields do not replace it. For a deeper look at how titles and descriptions work on the page itself, see how to write a meta title and meta description that get clicks.
Lazy Loading and LCP Pitfalls
Lazy loading delays images until the reader scrolls near them. WordPress has added loading="lazy" to images by default since version 5.5, so below-the-fold images already benefit without any work. The risk is on the first screen. Your Largest Contentful Paint element is very often the featured image or hero, and lazy loading it delays exactly the thing the browser is trying to measure.
The pitfalls worth checking:
- Lazy loaded hero image. Never lazy load the image at the top of the page. Recent WordPress versions try to skip the first content image, but themes, page builders and optimization plugins can override that, so verify it in your page source.
- Oversized hero. A 600 KB hero will lose time even when it loads eagerly. Resize and compress first.
- Missing width and height. Without dimensions the browser cannot reserve space, and the layout jumps as images arrive. WordPress adds these automatically for images inserted through the editor, but custom HTML and some page builders drop them.
- Double lazy loading. A lazy load plugin plus the native attribute plus a CDN script can conflict. Use one method.
- Background images set in CSS. Some builders turn the hero into a CSS background, which the browser discovers late. If your hero is your LCP element, prefer a real image element.
For the wider performance picture, including INP and hosting, read How to Speed Up a WordPress Blog: Core Web Vitals Fixes That Actually Matter rather than repeating it here. Google's own guidance on optimizing LCP goes deeper on the loading order of the main image.
The 5-Minute WordPress Image SEO Audit
Pick your most visited post and work through this list. It needs nothing beyond your browser.
- Find the heaviest images (1 minute). Open the post, open your browser developer tools, go to the Network tab, filter by Img and sort by size. Anything above roughly 200 KB deserves a look.
- Check the format (30 seconds). Are the large files JPEG or PNG? If your plugin should be serving WebP, confirm it is. The Type column shows what was actually delivered.
- Compare file size with display size (1 minute). Inspect the image. If the file is 3000 px wide and displays at 800 px, replace it with a resized copy.
- Check alt text (1 minute). Open the Media Library or block editor and look at every image in the post. Fill empty fields for informative images, set
alt=""for decorative ones, and trim stuffed keywords. - Check the file names (30 seconds). Rename future uploads; for old ones that earn traffic, replace only if you can also redirect or update links.
- Check the hero (1 minute). View the page source and search for the first image. It should not have
loading="lazy". Lower images should.
Fix the top three offenders and re-test. For the rest of your on-page basics, work through our WordPress SEO checklist for content creators.
Frequently Asked Questions
What is the best image format for WordPress SEO?
WebP is the safest default today: it is smaller than JPEG and PNG at similar quality and is supported by current browsers and by WordPress itself. AVIF can be smaller still, but make sure your plugin or CDN serves a fallback.
Should I add keywords to every alt text?
No. Describe the image accurately. If your target keyword fits naturally, include it once; if it does not, leave it out.
Should decorative images have alt text?
No. Give them an empty alt="" so screen readers skip them.
Does lazy loading help SEO?
It helps page speed for images below the fold. Applied to your hero image, it can hurt LCP, so exclude the top-of-page image.
Do I need an image CDN?
Not on a small blog with a local audience. It becomes useful when your readers are spread across regions or you want automatic resizing and format conversion without managing files.
Conclusion
Image SEO on WordPress comes down to a short routine you repeat on every post. Get the file right before it reaches the media library, describe it properly, and make sure the first image on the page loads as early as possible.
Key takeaways:
- Resize to the displayed width and save as WebP (or AVIF where supported) before upload.
- Use descriptive, hyphenated file names.
- Write alt text that describes the image, and use an empty alt for decorative images.
- Lazy load below-the-fold images, but never the hero or featured image.
- Use one image optimization plugin as a safety net, not a substitute for the routine.
- Audit your most visited post first; small fixes there pay back fastest.