Image SEO for WordPress: Alt Text, File Names, WebP and Compression Explained

Images make websites attractive, explain products and build trust — but they are also one of the most common reasons for slow pages and missed search opportunities. Image SEO is the practice of preparing and publishing images so they load quickly, are accessible to everyone and can be understood and found by search engines, including Google Images.

This guide explains image SEO for WordPress and WooCommerce in practical steps: choosing the right images, naming files, writing alt text, sizing and compressing, using modern formats like WebP, lazy loading, structured data and measuring results.

Why Image SEO Matters

Faster pages

Large images slow down pages, especially on mobile. Optimised images improve loading speed and Core Web Vitals.

Better accessibility

Alt text allows screen reader users to understand images. Accessible websites serve more people and often perform better overall.

More search visibility

Well-optimised images can appear in Google Images and image-rich search results, bringing extra traffic — especially for products, designs and visual services.

Higher conversions

Clear, fast-loading product photos and illustrations help visitors understand what you offer and trust your business.

Step 1: Choose the Right Images

Use original images where possible

Original photos of your products, team, workspace and projects build trust and stand out. Generic stock photos are used on thousands of websites.

Use relevant images

Every image should support the content near it — a product photo next to its description, a process diagram next to the explanation.

Custom graphics and illustrations

Branded illustrations, diagrams and infographics explain concepts and make content memorable. They are excellent for service pages and blog articles.

Respect copyright

Only use images you own, have licensed or are permitted to use.

Step 2: Name Image Files Descriptively

File names give search engines a small clue about image content.

Good vs poor file names

Poor	Good
IMG_4821.jpg	brown-leather-laptop-bag.jpg
final-final2.png	dtf-printed-black-t-shirt.png
banner1.webp	woocommerce-website-design-illustration.webp

File naming tips

Use lowercase letters
Separate words with hyphens
Describe the image accurately and concisely
Avoid stuffing keywords

Rename before uploading

WordPress uses the file name to create the image URL, so rename files before uploading them.

Step 3: Write Helpful Alt Text

Alt text (alternative text) describes an image for people who cannot see it and for search engines. Google’s image SEO best practices recommend useful, descriptive alt text.

How to write good alt text

Describe what the image shows and why it matters on the page
Be specific and concise
Include a keyword only where it fits naturally
Do not start with “image of” or “picture of”

Examples

Poor

“bag”

Keyword-stuffed

“leather bag leather bags Bangladesh best leather bag cheap leather bag”

Good

“Brown full-grain leather laptop bag with brass buckles and adjustable shoulder strap”

Decorative images

Purely decorative images, such as background shapes, can have empty alt text so screen readers skip them.

Step 4: Add Captions and Surrounding Text

Captions

Captions are visible text below images. They are read frequently and can add context, especially for diagrams, product details and project examples.

Surrounding content

Search engines use the text around an image to understand it. Place images near relevant headings and paragraphs.

Image titles

The title attribute has limited SEO value, but a clear title in the media library helps you manage files.

Step 5: Resize Images Correctly

Match display size

Upload images at roughly the largest size they will be displayed. A full-width hero might need around 1600–2000 pixels wide; a blog image around 1200 pixels; a thumbnail much less.

WordPress image sizes

WordPress automatically creates several sizes of each uploaded image and uses responsive image markup so browsers download an appropriate size. Your theme and page builder can choose which size to display.

Consistent product image dimensions

For WooCommerce, use the same aspect ratio for all product images — for example square — so grids look neat and pages do not jump.

Avoid scaling in the browser

Displaying a 4000-pixel image in a 400-pixel space wastes bandwidth. Resize first.

Step 6: Compress Images

Lossy vs lossless compression

Lossy

Removes some image data for much smaller files. At sensible settings the difference is barely visible.

Lossless

Reduces file size without any quality loss, but savings are smaller.

How to compress

Use an image optimisation plugin that compresses on upload
Use your caching or performance plugin’s image optimisation features
Compress manually with desktop or online tools before uploading

Check quality

Zoom in on product images after compression to make sure details remain sharp.

Step 7: Use Modern Image Formats

WebP

WebP images are typically much smaller than JPG and PNG at similar quality, and support transparency. WordPress supports WebP uploads, and many plugins convert existing images automatically.

AVIF

AVIF can be even smaller than WebP. Support is growing; plugins can serve AVIF with fallbacks.

SVG

SVG is ideal for logos, icons and simple illustrations because it is a vector format that stays sharp at any size. SVG uploads require care for security; use a trusted plugin that sanitises files.

When to use JPG and PNG

JPG still works well for photos when WebP is not possible; PNG is useful for images requiring lossless quality or transparency.

Step 8: Lazy Loading and Priority Loading

Lazy loading

WordPress adds lazy loading to images by default, so images below the fold load only when visitors scroll near them.

Do not lazy load the hero

The main image at the top of the page should load immediately. Lazy loading it can slow Largest Contentful Paint.

Set width and height

Image dimensions allow the browser to reserve space, preventing layout shifts.

For more speed improvements, read our WordPress speed optimization guide.

Step 9: Image SEO for WooCommerce Products

Main product image

Use a clear, high-quality image on a clean background. This image appears in category grids, search results and social shares.

Gallery images

Show different angles, close-ups, scale and lifestyle use. Each gallery image should have its own descriptive alt text.

Variation images

Assign images to each colour or style variation so customers see the exact product they choose.

Product structured data

SEO plugins and WooCommerce add product schema that includes the product image, price and availability. This can help products appear in rich results.

Alt text formula for products

[Product type] + [key attribute] + [colour/material] + [view or detail]. Example: “Oversized heavyweight cotton T-shirt in black, back print detail”.

Step 10: Optimise Images for Social Sharing

Open Graph images

When pages are shared on Facebook, LinkedIn or messaging apps, an Open Graph image is shown. SEO plugins let you set a default share image and a custom image for each page or post.

Recommended size

Social platforms commonly display share images at around 1200 × 630 pixels. Keep important text and logos away from the edges.

Featured images for blog posts

Branded featured images with the article title make shares recognisable and attractive.

Step 11: Image Sitemaps and Indexing

Include images in sitemaps

Many SEO plugins add images to your XML sitemap, helping search engines discover them.

Do not block images

Make sure your robots.txt file and security settings do not prevent search engines from accessing your image folders.

Attachment pages

WordPress can create a separate page for each image. These thin pages offer little value; most SEO plugins redirect attachment pages to the image file or parent post.

Step 12: Measure Image Performance

Search Console

Filter the Performance report by search type “Image” to see clicks and impressions from Google Images.

PageSpeed Insights

Check for image-related recommendations such as “Properly size images” and “Serve images in next-gen formats”.

Page weight

Monitor the total size of key pages. Images are often the largest contributor.

Image SEO Checklist

Original, relevant images
Descriptive, hyphenated file names
Helpful alt text on meaningful images
Captions where useful
Images resized to display size
Compression applied and quality checked
WebP or AVIF served where possible
Width and height set
Hero image loads immediately; others lazy load
Open Graph images set for key pages
Images included in sitemap

Bulk Optimising Existing Images

If your website already has hundreds of images, you do not need to fix them one by one.

Bulk compression and conversion

Image optimisation plugins can compress and convert your existing media library to WebP in bulk. Run the process during quiet hours and keep backups of originals.

Prioritise important pages

Start with the homepage, service pages, best-selling products and most visited blog posts. These have the biggest impact on users and search.

Add missing alt text

Export a list of images without alt text or review them in the media library. Prioritise images on key pages, and write alt text based on the image content and page context.

Remove unused images

Unused files take up storage and backup space. Clean them up carefully, checking that they are not used anywhere before deleting.

Delegate bulk work

Bulk image optimisation is a perfect task for a trained virtual assistant using a clear checklist.

Common Image SEO Mistakes

Uploading huge camera files

Multi-megabyte images slow down every page they appear on.

Missing alt text

Leaves screen reader users without information and misses search context.

Keyword-stuffed alt text

Repetitive keywords harm accessibility and can look spammy.

Text inside images only

Important text should be real HTML text, not only part of an image. Search engines and screen readers rely on real text.

Inconsistent product images

Different sizes and backgrounds make stores look unprofessional and cause layout shifts.

Lazy loading the hero image

Slows down the most important visual on the page.

Glossary of Image SEO Terms

Alt text

A text description of an image for accessibility and search engines.

WebP

A modern image format offering smaller file sizes.

Compression

Reducing file size by removing unnecessary data.

Lazy loading

Loading images only when they are about to appear on screen.

Open Graph image

The image shown when a page is shared on social platforms.

Responsive images

Markup that lets browsers choose the most suitable image size for each device.

Image SEO for Different Types of Websites

Service businesses

Use real photos of your team, workspace and completed projects. For web designers, screenshots and mock-ups of websites you built, with alt text describing the project, help potential clients understand your work. For printing businesses, close-up photos of finished T-shirts, stickers and signs show quality.

Online stores

Consistent product photography, multiple angles, zoom-friendly resolution and well-written alt text are essential. Category images and banners should also be optimised.

Blogs and content sites

Featured images, diagrams and step-by-step screenshots make articles easier to follow and more shareable. Branded featured images with consistent styling make your blog recognisable.

Portfolios

Portfolio sites rely heavily on images. Balance quality and speed by compressing carefully, using galleries with lazy loading and providing descriptive captions.

Local businesses

Photos of your storefront, interior and team help customers recognise you. Use the same photos on your website and Google Business Profile.

Creating Custom Graphics for SEO

Why custom graphics help

Unique illustrations, diagrams and branded featured images make your content stand out from competitors using the same stock photos. They also explain concepts visually and are more likely to be shared.

Types of useful graphics

Process diagrams showing how your service works
Comparison charts, such as printing methods or package features
Checklists and infographics summarising articles
Branded featured images for blog posts
Illustrations of products, services and concepts

Keep text accessible

If a graphic contains important information, repeat the key points in the page text and describe them in alt text or a caption.

Consistent visual style

Use your brand colours, fonts and illustration style across graphics so your content looks professional and recognisable.

Case Example: Optimising Images on a WooCommerce Store

Consider a clothing store with a few hundred products. Product photos were uploaded straight from a camera, file names were random numbers and almost no images had alt text. Category pages loaded slowly on mobile.

What was done

Created a standard: square product images, consistent background, fixed maximum width.
Bulk-compressed the media library and enabled automatic WebP delivery.
Renamed new uploads with descriptive file names before uploading.
Wrote alt text for main product images, prioritising best sellers.
Set the category page hero image to load immediately and lazy loaded the rest.
Added product images to the sitemap through the SEO plugin.

Outcome

Category and product pages became much lighter and faster on mobile, product grids looked consistent, and product images became eligible to appear more effectively in image search. The store also became more accessible to screen reader users.

Writing Alt Text at Scale

Create alt text templates

For products, use a template such as + [colour/material] + [view]. For blog images, describe the main subject and its relevance to the article.

Prioritise by traffic

Start with images on your most visited pages and best-selling products.

Use a checklist for new uploads

Make alt text, file names and compression part of your upload process so new images are optimised from day one.

Delegate with guidance

A virtual assistant can write alt text using your templates and examples. Review a sample regularly for quality.

Avoid automated nonsense

Automatically generated alt text from file names can be unhelpful. Always review and improve it.

Image SEO and Accessibility Together

Image SEO and accessibility share the same foundation: describing images clearly and making pages easy to use for everyone.

Write for screen reader users

Imagine reading your page aloud to someone who cannot see it. Would the alt text help them understand the content? If yes, it is likely helpful for search engines too.

Do not repeat captions in alt text

If a caption already describes the image fully, keep alt text short to avoid repetition for screen reader users.

Describe charts and infographics

For complex graphics, summarise key points in the surrounding text and use concise alt text that explains the purpose of the graphic.

Use real text for buttons and headings

Text embedded in images cannot be resized or read reliably by assistive technologies. Use real text for important information.

Contrast in images

If images contain text, make sure contrast is strong enough to read on different screens and in bright light.

Quick Image SEO Workflow for Every Upload

Choose or create a relevant, high-quality image.
Resize to the required dimensions.
Compress and export as WebP where possible.
Rename the file descriptively with hyphens.
Upload and add alt text, and a caption if helpful.
Place the image near related content.
Preview the page on mobile and check speed.

Quick-Start Image SEO Checklist

Rename image files descriptively before uploading
Resize images to their display size
Compress and serve WebP
Write helpful alt text for meaningful images
Leave alt text empty for purely decorative images
Set width and height to prevent layout shift
Load the hero image immediately; lazy load the rest
Set Open Graph images for key pages and posts
Include images in your XML sitemap
Check Google Images performance in Search Console

Pro tip

Create a simple upload checklist and pin it in your WordPress dashboard or team notes. When everyone follows the same steps, every new image is optimised automatically.

Frequently Asked Questions

Does alt text help SEO?

Yes. Alt text helps search engines understand images and improves accessibility. Write it for people first.

Should I convert all images to WebP?

For most websites, serving WebP is a quick win. Plugins can do this automatically while keeping originals.

How large should images be?

Large enough to look sharp at their display size, and compressed to keep file sizes small.

Can you optimise my website images?

Yes. We optimise images as part of website builds, speed improvements and our care plan, and we create custom graphics for websites.

Conclusion: Beautiful, Fast and Findable Images

Image SEO combines good images, descriptive file names, helpful alt text, correct sizing, compression and modern formats. Together they make your WordPress or WooCommerce site faster, more accessible and more visible in search.

Want help? Explore our SEO-ready website design service, read our product description guide, or request a website image and speed review.