Images can improve a website, explain ideas quickly and make pages more engaging. They can also make a WordPress site slower, harder to use and more difficult for search engines to understand if they are handled badly.
Good image optimisation is about finding the right balance.
You want images that look sharp enough for visitors, load quickly on different devices, remain accessible and give search engines useful context without stuffing keywords into every available field.
This guide explains how to optimise images in WordPress for both performance and SEO, from choosing the right dimensions and file format to compression, alt text, responsive images and image discovery.
Why Image Optimisation Matters
Images are often among the largest files a browser has to download when loading a webpage.
An oversized image can add hundreds of kilobytes or even several megabytes to a page without looking noticeably better to the visitor.
That matters because heavier pages can:
- Take longer to load
- Use more mobile data
- Feel sluggish on slower connections
- Make pages jump around while images load
- Affect Core Web Vitals
- Frustrate visitors
- Make mobile browsing harder
Images can also contribute to search visibility when they are relevant, accessible and easy for search engines to discover.
The goal is not simply to make every image as small as possible. It is to serve an image that is large enough for its purpose, compressed appropriately and delivered efficiently.
Resize Images to Sensible Dimensions
One of the most common image mistakes is uploading a file that is far larger than the website will ever display.
A photograph straight from a modern phone or camera might be 4,000 or 6,000 pixels wide.
If the largest version displayed on your site is only 1,400 pixels wide, keeping a huge original may provide little practical benefit while using more storage and creating more work during processing.
WordPress usually creates several smaller image sizes when you upload an image, and responsive image markup can help browsers choose an appropriate version.
That does not mean image dimensions no longer matter.
A sensible workflow is to consider the largest size the image genuinely needs to appear at and avoid uploading excessively large files without a reason.
There are exceptions.
For example, a photography portfolio or product gallery with a zoom feature may genuinely need high-resolution originals.
The correct dimensions depend on how the image will be used.
Resizing, Resampling and Compression Are Different
These terms are often used interchangeably, but they describe different things.
Resizing
Resizing changes the dimensions of an image.
For example, you might reduce a photograph from 4,000 × 3,000 pixels to 1,600 × 1,200 pixels.
Making a raster image smaller generally works well.
Making a small image significantly larger is different. The software has to create additional information that was not present in the original, which can make the result look soft or pixelated.
Resampling
Resampling changes the number of pixels within the image.
When an image is reduced, pixels can be removed. When it is enlarged, software has to estimate new pixels.
Modern editing tools can make enlargement look better than older tools could, but they cannot restore genuine detail that was never captured in the original image.
Compression
Compression reduces the amount of data required to store an image.
This is usually where some of the biggest performance savings are available.
A well-compressed image can often look almost identical to the original while using substantially less data.
For website images, you normally want to use resizing and compression together rather than relying on only one technique.
Choose the Right Image Format
Different image formats suit different types of content.
JPEG
JPEG remains useful for photographs and other images containing lots of colours and gradients.
It supports lossy compression, which can reduce file size significantly.
The key is to avoid excessive compression that creates visible artefacts.
PNG
PNG is useful when you need transparency or when an image contains graphics that need particularly crisp edges.
It can also work well for screenshots and certain illustrations.
PNG files can become very large for photographs, so it is rarely the most efficient option for normal photography.
WebP
WebP is widely supported and can often produce smaller files than JPEG or PNG at comparable visual quality.
It supports both lossy and lossless compression as well as transparency.
For many WordPress sites, WebP is a practical modern format for photographs and graphics.
AVIF
AVIF can achieve very efficient compression and is supported by modern browsers and modern WordPress installations where the hosting environment can process it.
It can produce excellent results, particularly for photography.
As with any format, the best option depends on the image, your WordPress setup and browser requirements.
You do not necessarily need to convert every existing image manually. Image optimisation plugins, CDNs and hosting platforms can sometimes generate and deliver modern formats automatically.
Compress Images Before They Become a Performance Problem
Compression should reduce file size without making the image visibly poor.
There are two broad approaches.
Lossless Compression
Lossless compression reduces file size without deliberately removing visual information.
The savings tend to be smaller, but the image data is preserved.
Lossy Compression
Lossy compression removes some image data to reduce the file size further.
Used sensibly, this can provide substantial savings without creating an obvious visual difference.
For normal website photography, moderate lossy compression is often a reasonable balance.
The correct setting is not a particular percentage that works for every image.
Look at the actual output.
If a 200 KB image looks effectively identical to its 900 KB original at the size visitors will see it, the smaller version is normally the better website asset.
Let WordPress Serve Responsive Images
Visitors do not all need the same image file.
Someone viewing your website on a phone may only need a relatively small version of an image, while someone using a large desktop monitor may need a wider version.
WordPress helps handle this automatically.
When suitable image sizes are available, WordPress can add srcset and sizes information to image markup.
These tell the browser about the available image versions so it can choose a suitable file for the visitor’s screen and layout.
This is better than forcing every visitor to download the largest version.
There is usually no need to write srcset markup manually for normal WordPress images.
Problems can arise when themes, page builders, custom code or third-party components bypass normal WordPress image handling.
If you find that your pages are serving very large images to small screens, it is worth checking the actual files being requested rather than assuming responsive images are working correctly.
Set Image Dimensions to Reduce Layout Shift
Images should have width and height information available so the browser can reserve space before the file finishes loading.
Without this, content can move as images appear.
That movement can be frustrating for visitors and can contribute to a poor Cumulative Layout Shift result.
WordPress normally handles image dimensions when images are inserted through standard functions and blocks.
Problems are more likely to appear with custom templates, manually written HTML or third-party embeds.
If a page jumps while loading, images without properly reserved space are one of the things worth checking.
Use Lazy Loading Sensibly
Lazy loading delays certain images until they are closer to entering the visitor’s viewport.
This can reduce the amount of data required during the initial page load.
It is particularly useful for images much further down a long page.
However, not every image should be delayed.
An important hero image or another image that forms part of the Largest Contentful Paint element usually needs to load promptly.
Aggressively lazy-loading the main above-the-fold image can make the page feel slower rather than faster.
WordPress handles native lazy-loading behaviour for many images automatically, but themes and optimisation plugins can alter this behaviour.
The aim is simple:
- Important visible images should load promptly
- Images further down the page can usually wait
- Do not lazy-load something merely because a plugin gives you the option
Give Image Files Descriptive Names
A filename such as:
IMG_4837.jpg
tells you very little about the image.
Something like:
green-leather-office-chair.jpg
is more useful.
Descriptive filenames help with organisation and can give search engines additional context about the image.
Keep filenames concise and relevant.
You do not need to turn filenames into long lists of keywords.
Avoid filenames such as:
best-cheap-office-chair-green-chair-buy-office-chair-sale.jpg
That is not useful optimisation. It is keyword stuffing.
A short filename describing what the image actually shows is normally enough.
Write Useful Alt Text
Alt text is one of the most important pieces of image information to get right.
Its primary purpose is accessibility.
Someone using a screen reader may rely on the alternative text to understand information that would otherwise only be available visually.
Alt text can also help search engines understand an image and its relationship to the surrounding content.
The best alt text usually describes what is important about the image in the context of the page.
For example:
Woman adjusting a WordPress image compression setting
is more useful than:
image
It is also better than:
WordPress SEO image optimisation best image compression WordPress
Alt text is not a place to force keywords.
Not Every Image Needs Descriptive Alt Text
Some images are purely decorative.
If an image contributes no information and exists only for visual styling, an empty alt attribute may be more appropriate so screen readers can ignore it.
The correct alt text depends on why the image is on the page.
Ask:
What would someone miss if they could not see this image?
Use the answer to guide the description.
Do Not Fill Every WordPress Image Field for SEO
The WordPress Media Library includes fields such as:
- Alt text
- Title
- Caption
- Description
They do not all need to contain keyword-focused text.
Alt text has a clear accessibility purpose.
Captions are visible content when your design displays them, so use them when they genuinely add something for the reader.
The title and description fields may be useful for media management or particular templates, but filling them with variations of the same keyword is not an SEO strategy.
Do not copy the same sentence into every field merely because the fields exist.
Use each field when it has a real purpose.
Keep Images Relevant to the Surrounding Content
Search engines do not assess images in isolation.
The surrounding page matters.
An image placed next to relevant headings and text has more context than an unrelated stock photograph dropped into a page for decoration.
Where practical:
- Use images that genuinely support the topic
- Place them near the relevant text
- Give them appropriate alt text
- Avoid inserting unrelated images solely to break up long content
This also improves the experience for visitors.
Images should help explain, demonstrate or support the page rather than merely occupy space.
Consider Image Quality on Different Screens
Compression is useful, but it should not destroy visual quality.
Check important images on both normal and high-density displays.
A photograph that looks acceptable on one laptop may appear noticeably soft on a large or high-resolution screen if the source dimensions are too small.
The answer is not to serve the biggest possible image to everyone.
Responsive images allow you to provide larger versions where needed while smaller devices receive more appropriate files.
This is another reason to test your website across different screen sizes rather than evaluating images in the WordPress editor alone.
Check Your Largest and Most Important Images First
If you are optimising an existing website, you do not necessarily need to start by manually reviewing thousands of files in the Media Library.
Start with the pages that matter most.
Look at:
- Homepage
- Main landing pages
- Popular blog posts
- Service pages
- Product pages
- Large hero sections
- Image-heavy pages
Performance testing tools can help identify pages where images are contributing heavily to transferred data or rendering delays.
Our guide to speeding up WordPress covers the wider performance work that sits around image optimisation.
WordPress Image Optimisation Plugins
WordPress image optimisation plugins can automate much of this work.
Depending on the plugin and configuration, they may be able to:
- Compress new uploads
- Optimise existing Media Library images
- Resize excessively large uploads
- Generate WebP or AVIF versions
- Deliver images through a CDN
- Restore original files
- Optimise thumbnails and additional image sizes
Popular services and plugins change over time, so it is better to choose based on the features you need rather than following an old list of prices or screenshots.
Whichever tool you use, test the results.
Check that:
- Images still look good
- File sizes have actually decreased
- The correct formats are being served
- Responsive image behaviour still works
- Important images are not being lazy-loaded incorrectly
- Original files are backed up if you may need them later
Installing an optimisation plugin does not automatically guarantee that your images are being delivered efficiently.
Do Not Stack Several Optimisation Systems Without a Reason
More optimisation is not always better.
Your hosting platform, CDN, caching plugin and image optimisation plugin may all offer overlapping image features.
For example, two different systems might both attempt to:
- Convert images to WebP
- Lazy-load images
- Resize images
- Rewrite image URLs
- Serve files from a CDN
That can create unnecessary complexity or conflicts.
Understand which part of your setup is responsible for each job.
A simpler configuration is usually easier to troubleshoot.
Image Sitemaps and Search Discovery
Search engines need to be able to discover and crawl your images.
XML sitemaps can help with this.
You do not necessarily need a completely separate image sitemap.
SEO plugins can include image information alongside page URLs, and Google also supports image information within XML sitemaps.
The important points are that:
- The image URLs are crawlable
- Search engines can access the image files
- Important images appear on indexable pages
- The image host is not blocked
- CDN configuration does not accidentally prevent crawling
If you use a CDN, make sure the image files served from it remain publicly accessible to search engines.
Use Structured Data Where It Actually Applies
Structured data can help search engines understand particular types of content.
However, there is no reason to add generic image-related schema to every photograph on a WordPress site.
Structured data should describe the actual page and content accurately.
For example, a product page may use Product structured data. A recipe page may use Recipe structured data.
Images can form part of that structured information where appropriate.
The important rule is not to invent relationships or markup purely in the hope of gaining additional search visibility.
Structured data should accurately represent what visitors can see on the page.
Optimise Existing Images Carefully
If your WordPress site has been running for years, the Media Library may contain many old images.
Bulk optimisation can save a lot of space and bandwidth, but take care before running it across the entire library.
Before making large changes:
- Create a reliable backup
- Check whether original images will be retained
- Test the process on a small group
- Inspect visual quality
- Confirm thumbnails still work
- Check that important pages display correctly
- Avoid deleting original files unless you are certain they are unnecessary
Older themes and plugins may reference particular image sizes in unexpected ways.
A controlled approach is safer than changing thousands of files at once and discovering afterwards that something depends on them.
Check Image Errors Separately
Not every image problem is an optimisation issue.
Broken images, incorrect URLs, missing thumbnails, permission problems and failed image processing require a different kind of troubleshooting.
If images are failing to display rather than simply loading slowly, our guide to fixing common WordPress image errors covers those problems in more detail.
WordPress Image Optimisation Checklist
Before uploading an image, check:
- Does the image genuinely help the page?
- Are the dimensions sensible for how it will be displayed?
- Is the file format appropriate?
- Has the image been compressed?
- Does it still look good at the required size?
- Is the filename descriptive?
- Does it need useful alt text?
- Is a caption actually helpful?
After uploading, check:
- WordPress generated suitable image sizes
- Responsive images are working
- The browser is not downloading an unnecessarily large file
- Width and height information is available
- Above-the-fold images load promptly
- Below-the-fold images can lazy-load where appropriate
- The page still looks good on mobile and desktop
For an existing site, also check:
- Older oversized images
- Duplicate optimisation systems
- CDN configuration
- Image-heavy templates
- XML sitemap discovery
- Core Web Vitals
- Broken or missing image files
Make Image Optimisation Part of Your Publishing Process
Image optimisation is easiest when it happens before oversized files spread across the website.
A simple publishing routine can prevent most problems:
- Choose an appropriate image.
- Resize it to sensible dimensions.
- Use an appropriate file format.
- Compress it.
- Give it a descriptive filename.
- Upload it to WordPress.
- Add useful alt text where needed.
- Check the result on the page.
- Test important pages on mobile and desktop.
Once this becomes part of your normal workflow, you are less likely to need a major cleanup later.
Optimised images will not fix every performance or SEO problem on a website, but they remove a common source of unnecessary page weight while making your content easier to understand and use.
If your WordPress site has accumulated oversized images, slow-loading media or confusing optimisation settings and you would prefer us to investigate it for you, our one-off WordPress support can help identify and fix the underlying issues.
