Most image optimization advice for WordPress is either too technical or too vague.
You do not need a 30-step workflow, and you probably do not need to obsess over every compression setting. But you also should not upload huge phone photos, random PNGs, or unnamed files like IMG_4829.jpg and hope WordPress sorts it all out.
This guide keeps it simple.
Here’s how to optimize images for WordPress in 2026, including when to use WebP, when SVG is better than PNG, how large your images should be, what to know about featured images and retina screens for Apple screens, and the small habits that help keep your site fast, clean, and search-friendly.
Simple Image Process for WordPress
Before adding images to the website, follow this process:
1. Use the best file format
Use the right image format before uploading.
| Image type | Best format |
|---|---|
| Regular photos | WebP or JPG |
| Website graphics | WebP or PNG |
| Logos and simple icons | SVG |
| Screenshots | PNG or WebP |
| Images needing transparency | WebP, PNG, or SVG |
Best default: use WebP for most website images whenever possible.
WebP usually gives smaller file sizes than JPG or PNG while keeping good image quality. This helps pages load faster.
For logos and simple icons, SVG is usually better than PNG because it stays sharp at any size, including on retina/high-resolution screens. Use PNG only if an SVG is not available or not suitable.
2. Resize and save as WebP before uploading
One thing many image optimization guides miss: the best time to optimize an image is before it ever gets uploaded to WordPress.
A plugin can help, but it should not be the first line of defence. If you upload a massive 5000 px-wide photo straight from a phone or camera, WordPress still has to process it, store it, create thumbnails, and serve different versions. That adds unnecessary weight to the Media Library and can slow things down.
For most website images, resize the image first, then export it as WebP.
Recommended starting points:
| Image type | Recommended dimensions | WebP quality |
|---|---|---|
| Full-width hero/banner | 1600-1920 px wide | 75-85 |
| Blog/content image | 1200-1600 px wide | 75-85 |
| Featured image | 1200 × 630 px minimum | 75-85 |
| Small in-page image | 800-1200 px wide | 75-85 |
| Logo/icon | SVG preferred | N/A |
A WebP quality setting around 80 is a good default. It usually keeps images looking sharp while reducing file size significantly compared with JPG or PNG.
This is a visual comparison of a photo taken with an iPhone to an optimized WebP image that’s 921% smaller:
(taken on an iPhone 14 Pro and cropped)
(921% smaller file size)
Hard to tell them apart, isn’t it?
For simplicity, we mostly use quality levels of 75-80 at the agency. For very detailed images, photography portfolios, large hero images, or images requiring a lot of detail (i.e. artists and designers), use the higher end of the range, around 85. For simple graphics or smaller supporting images, 75-80 is usually enough.
The goal is not to make every image as tiny as possible. The goal is to keep images light while still looking clean, sharp, and professional.
3. Use larger images for retina displays when needed
Retina and high-resolution screens need more image detail to look crisp.
As a simple rule, upload images around 2× the display size, but do not overdo it.
Example:
- If an image displays at about 600 px wide, upload one around 1200 px wide.
- If a featured image displays large across the page, use at least 1200 × 630 px, and preferably larger if the layout crops or stretches it.
Do not upload original, large original camera files unless they have been resized first.
4. Pay special attention to featured images
Featured images are often used in multiple places, such as:
- blog posts
- archive pages
- social sharing previews
- related post sections
- homepage cards
For featured images, use a clean, high-quality image that still looks good when cropped.
Recommended featured image size: 1200 × 630 px minimum
A slightly larger WebP is fine if the image needs to look sharp on retina screens or large layouts.
5. Rename the file before uploading
Rename the image so it describes what is in the photo.
Good examples:
tofino-sunset-couple.webpteam-meeting-office.webpcustom-software-dashboard-example.webp
Avoid names like:
IMG_9482.jpgScreenshot 2026-09-23 at 10.42.31 AM.pngfinal-final-new-2.webp
Use:
- lowercase letters
- hyphens between words
- short, descriptive names
- no special characters
- no random camera file names
6. Upload the image to WordPress
Upload the image normally through the WordPress Media Library, page editor, or blog editor.
The website image tool will help with:
- image compression
- responsive image sizing
- lazy loading
- faster image delivery
- auto-optimizing to WebP format where supported
Even if the site can generate WebP automatically or with a plugin, it is still best to upload already-optimized images when possible.
7. Add alt text
After uploading, add a short, useful description in the Alt Text field.
Good alt text:
Couple at sunset in TofinoCustom software dashboard showing project status
Avoid using the words image or photo.
If the image is only decorative and does not add useful meaning, it is okay to leave the alt text blank.
8. Choose the right display size in WordPress
When placing the image on a page, choose an appropriate image size.
Use Full Size only for banners, large feature images, or places where the full image quality is needed.
For normal page images, choose a smaller WordPress image size when available, such as Large or Medium Large.
9. Preview before publishing
Before publishing or updating the page, preview it and check:
- the image looks clear
- it is not blurry, stretched, or cropped awkwardly
- it looks good on mobile
- the featured image crops well
- the page still loads smoothly
Simple Workflow for Optimizing Images in WordPress
- Use WebP for most images.
- Use SVG for logos when available.
- Resize before uploading.
- Rename clearly.
- Add alt text.
- Preview the page.
- Publish
Use an Image Optimization Plugin
If you find this overwhelming or too technical, there’s another option: Use an image optimization plugin.
The Best Free Image Optimization Plugin for WordPress
A good image plugin will speed up your workflow and can help with:
- compressing images
- serving WebP versions
- resizing images for different screen sizes
- lazy loading images so they do not all load at once
- improving page speed, especially on mobile
For most small business websites, we recommend Optimole.
Optimole is a good fit because it is simple for clients day to day. Once it is set up, you can keep uploading images normally, and the plugin handles optimization in the background.
Optimole can automatically convert and serve images as WebP, resize images for the visitor’s screen, lazy load images, and deliver them through a CDN. Its free plan supports sites with up to 2,000 visits/month, which makes it a practical option for many small sites.
A comparison with other popular plugins:
| Plugin | Free plan limit | WebP/AVIF support | Best for | Main drawback |
|---|---|---|---|---|
| Optimole | 2,000 visits/month | WebP + AVIF | Easiest day-to-day use for small sites | Visit-based limit, so high-traffic sites may need a paid plan |
| Imagify | 20 MB/month | WebP + AVIF | Simple dashboard-based optimization | Large images and generated thumbnails can use the free quota quickly |
| ShortPixel | 100 credits/month | WebP + AVIF | Good compression and developer control | Credit system can be confusing because thumbnails can also use credits |
| EWWW Image Optimizer | Free local optimization available | WebP support | More control and local/server-side optimization | More technical setup and less beginner-friendly |
Imagify is easy to use and can resize, compress, and convert images to WebP/AVIF from the WordPress dashboard, but its free plan is limited to 20 MB/month, which can run out quickly if you upload large images.
EWWW Image Optimizer gives more control and can optimize images locally on the server, but it has more technical settings, so it is usually better for developers or more advanced WordPress users.
ShortPixel is a strong option if you want more control over compression levels and prefer a credit-based system, but for non-technical clients, it can feel less straightforward than a fully automatic tool like Optimole.
And while plugins help, they should not replace good image habits. You should still resize large photos, use WebP when possible, rename files clearly, and add useful alt text before publishing.
Here’s a practical takeaway: optimize before upload, then let the plugin handle the extra performance layer.
Make Image Optimization Part of Your Publishing Process
Image optimization can feel a bit strange the first few times, especially if you are used to uploading images straight from your phone, camera, or downloads folder. But once it becomes part of your publishing process, it is as routine as renaming a Google Doc before sharing it or checking a page preview before hitting publish.
The biggest wins come from a few simple habits: choose the right format, resize images before uploading, save most images as WebP, use SVG for logos when available, write clear file names and alt text, and use a good plugin to handle the final performance layer. Do that consistently, and your WordPress site will stay faster, cleaner, and easier to maintain.
