Tuesday, June 23, 2026
HomeWordPress NewsHow to Optimize Your WordPress Images for Maximum Speed (Compression + WebP/AVIF)

How to Optimize Your WordPress Images for Maximum Speed (Compression + WebP/AVIF)


Run Google’s PageSpeed Insights on almost any WordPress site and you’ll see the same two complaints somewhere on the list:

  • Efficiently encode images
  • Serve images in next-gen formats

They show up so consistently that most site owners start to treat them as background noise.

If you’re one of them, you should think again. These two flags represent some of the most impactful, lowest-effort performance wins available in WordPress, and they share a fix.

By the end of this tutorial, you’ll have compressed your entire media library, enabled WebP and AVIF delivery, and know exactly how to confirm the improvements in your performance scores.

Setting Up ShortPixel Image Optimizer

To get started, you’ll need the ShortPixel Image Optimizer plugin installed and activated, with an API key added to the plugin’s settings. Getting the API key is free and takes about 30 seconds.

Before running any bulk operation on your media library, I’d also recommend taking a backup first. ShortPixel isn’t destructive (it keeps your original media files intact), but it’s always good practice before any library-wide change.

Set aside 10 to 15 minutes for the setup itself. The processing time depends on how many images are in your library, but you can always walk away once the bulk job is running in the background.

Step 1: Understand What You’re Actually Fixing

It helps to know what those two flags I mentioned earlier on actually mean before touching any settings.

The first flag, “Efficiently encode images,” is related to image compression. Every image you upload to WordPress is stored at its original file size and quality. That includes every thumbnail and intermediate size WordPress generates automatically, which can be five or six additional files per upload. If you’ve never run an optimizer on your site, every single one of those variants is sitting at full, uncompressed quality. ShortPixel processes all of them itself.

The
Source: Google Lighthouse Docs

The second flag, “Serve images in next-gen formats,” is about the file format. JPEG and PNG are legacy formats that most browsers have supported for decades. WebP delivers roughly 25–34% smaller file sizes compared to JPEG at the equivalent visual quality.

AVIF goes even further in browsers that support it, and support for this format has grown significantly across Chrome, Edge, Firefox, and Safari. Most likely, the majority of your visitors are already using browsers that handle both formats.

The
Source: Google Lighthouse Docs

Neither fix requires touching your server configuration in any way. ShortPixel is going to handle both as part of the same workflow.

Step 2: Choose Your Compression Mode

ShortPixel offers three compression modes. Picking the right one now saves you a re-run later, so it’s worth spending some time understanding the decision you’re about to make.

Let’s look at the options.

ShortPixel's image optimization settings.
Go to Settings > ShortPixel > Image Optimization to set the image compression level.

Lossy is the recommended default for most sites. Blogs, marketing sites, news publications, and general portfolios will benefit most from i since the file size reduction is significant and the quality loss at typical web display sizes is genuinely imperceptible. If you’re not sure where to start, use Lossy.

Glossy is ShortPixel’s middle option. It applies a milder lossy algorithm that preserves more visual detail than the standard lossy setting. It’s worth considering if you run a photography portfolio or a WooCommerce store where product image quality directly affects purchase decisions.

Lossless produces no quality change. Files are still reduced in size, but the savings are more modest than lossy or glossy. This mode is the right call for logos, diagrams, icons, and any image with hard edges or flat colours where pixel accuracy matters.

ShortPixel keeps backups of your original images, so if you start with Lossy and decide Glossy produces better results for your content, you can switch modes and re-optimize without any permanent loss.

Step 3: Enable WebP and AVIF Conversion

With your compression mode chosen, head to the “Advanced” tab in ShortPixel’s settings to enable format conversion. Here, you’ll find separate toggles for WebP and AVIF.

ShortPixel's next-gen image format settings.
Go to Settings > ShortPixel > WebP/AVIF & CDN to enable WebP and/or AVIF image formats.

Enable both, then enable the “Serve WebP/AVIF images from locally hosted files” option. Here, you’ll be presented with two options for the delivery method:

  • Picture tag delivery wraps your images in a element. The browser reads the available formats and picks the best one it supports. This is the more compatible option and works reliably across virtually all WordPress setups, including those using page builders.
  • .htaccess rewrite rules handle delivery at the server level without modifying your HTML. It’s slightly more efficient, but requires Apache with PHP exec() available on your server. If you’re on managed hosting or just not sure what that means, use the picture tag method.
Choosing where to serve WebP/AVIF images from locally hosted files in ShortPixel.
Enable “Serve WebP/AVIF images from locally hosted files” to set delivery method.

When it comes to AVIF support, the fallback is handled automatically. That means that browsers that don’t support AVIF will receive WebP instead. Browsers that don’t support WebP receive the original format. Enabling AVIF adds no risk to visitors on older browsers, and the file size benefit for visitors on modern ones is meaningful enough to be worthwhile.

Step 4: Run the Bulk Optimizer

To bulk optimize your media files and save soe time, go to Media > Bulk ShortPixel Optimization in your WordPress dashboard. This is where the actual processing happens.

  1. First, review the queue. ShortPixel shows you how many images are unprocessed and estimates credit usage before you start. Check this against your available credits so you’re not surprised mid-run.
  2. Start the bulk job. Once running, you can leave the page. ShortPixel processes images in the background and doesn’t require the browser tab to stay open.
  3. If the job pauses or stops, it’s usually one of two things. You’ve either reached your credit limit for the month, or the connection timed out. Return to the Bulk Optimizer page and resume the process. ShortPixel picks up from where it left off rather than starting over.
  4. Read the results summary once complete. You’ll see total savings by percentage, credits consumed, and before/after file sizes across your library. These numbers are worth noting down as a performance baseline for the future.
ShortPixel's bulk image optimization process.

Keep in mind that WordPress generates multiple size variants for every image you upload, and each variant counts as one credit in ShortPixel. In practice, expect around four to five credits per original upload, so a library of 500 images might use 2,000–2,500 credits. ShortPixel’s pricing page has a calculator to help you estimate usage before committing to a bulk job.

Step 5: Verify the Results

The bulk job finishing is not the same as the problem being solved. It’s important to run a few checks to confirm the improvements are actually showing up for visitors.

Firstly, clear your cache before testing. If you’re running WP Rocket, LiteSpeed Cache, W3 Total Cache, or any other caching plugin, purge it first. PageSpeed Insights and Google’s crawlers need to see fresh responses, not cached versions of your old un-optimized images.

Once that’s done, go through these three checks:

  • Re-run PageSpeed Insights on your most important pages. The “next-gen formats” and “efficiently encode images” flags should be gone or substantially reduced. If either persists, check whether a CDN in front of your site is serving the original files instead of the optimized versions.
  • Confirm WebP delivery in Chrome DevTools. Open the Network tab, filter by image type, and check the Content-Type header on a few images. You’re looking for image/webp or image/avif in the response headers rather than image/jpeg or image/png.
  • Review ShortPixel’s optimization report for a library-wide savings summary. It breaks down savings by file type and shows you the aggregate impact across your entire media library.
Chrome's DevTools showing the image format as WebP.
Chrome’s DevTools showing the image format as WebP.

Go Further with WordPress Image Performance

If you followed the steps above, you’ve taken care of two of the most persistent PageSpeed complaints in one sitting. Your media library is now compressed across every size variant, your images are being served in modern WebP and AVIF to browsers that support them, and you have a process for verifying that it’s all working.

The setup is a one-time task with ongoing benefits. Every new image you upload will be automatically compressed and converted by ShortPixel going forward, so the flags shouldn’t return.

If you want to go further, the WordPress Image SEO Checklist covers the discoverability layer, specifically image sitemaps, alt text generation, fetchpriority for your LCP image, and how to use Search Console to catch image issues at scale. Our responsive images guide is also worth reading if you’re not certain whether WordPress is serving the right image dimensions to the right devices.

If you’ve been putting this off, it’s a good one to get done in a few minutes. The difference in your PageSpeed scores is usually immediate and will have a lasting impact on your site’s performance.



Source link

RELATED ARTICLES
Continue to the category

LEAVE A REPLY

Please enter your comment!
Please enter your name here


Most Popular

Recent Comments