WordPress sites that ship JPEGs or full-resolution PNGs load slowly even on fast hosts. The symptom shows up in GTmetrix reports as Largest Contentful Paint over 4 seconds. Mobile users on 4G connections wait through 5-second hero image loads. Page weight averages 1.04 MB per page across the top 1 million sites in 2026. The gap closes only on sites that have switched to modern image formats.
This tutorial covers WordPress image optimization using ShortPixel and the WebP plus AVIF format pair. You install one plugin and run a bulk conversion. Enable AVIF fallback next. Turn on lazy loading after that. Set a max upload dimension to limit future uploads. Verify the result in GTmetrix at the end.
What You’ll Need
- WordPress version: 6.5 or newer (older versions cannot serve AVIF natively).
- Permissions needed: Administrator on the WordPress dashboard.
- Time to complete: 30 minutes for install and configuration. Bulk conversion runs in the background for 1-6 hours depending on media library size.
- Difficulty level: Beginner. Every step happens inside the WordPress dashboard.
- Prerequisites: A ShortPixel or Imagify account (free tier covers 100 images/month). GTmetrix account for testing (also free).
Step 1: Install ShortPixel Image Optimizer
Open the WordPress dashboard. Navigate to Plugins → Add New. Search for “ShortPixel Image Optimizer”. Click Install Now on the listing by ShortPixel. Click Activate. The plugin loads a banner asking for an API key.
[SCREENSHOT: shortpixel-install-banner]
Click the API key link in the banner. Sign up for a free account at shortpixel.com. Copy the key from the welcome email. Paste it into the WordPress dashboard at Settings → ShortPixel. Click Save Changes. The free tier covers 100 image conversions per month, enough for most blogs that publish 1-2 posts per week.
Step 2: Run Bulk WebP Conversion
Navigate to Media → Bulk ShortPixel. Set Compression to “Glossy” for blogs or “Lossless” for portfolio sites. Tick the checkbox for “Also create WebP versions of the images”. Click Start Bulk Optimization.
[SCREENSHOT: shortpixel-bulk-conversion-progress]
Wait for the progress bar to finish. Smaller libraries (under 500 images) finish in 30-60 minutes. Libraries over 5,000 images can take 4-6 hours. The plugin emails you when the bulk run finishes. Each image now has a WebP twin saved alongside the original.
Step 3: Enable AVIF Fallback
Navigate to Settings → ShortPixel → Advanced. ShortPixel converts to WebP by default. AVIF is the newer format with smaller file sizes but slightly less browser support. Tick the box labeled “Use AVIF when supported”.
[SCREENSHOT: shortpixel-avif-toggle]
Click Save Changes. The plugin now serves AVIF to Chrome, Firefox, and Safari 16+ browsers. Older browsers fall back to WebP automatically. AVIF support hit 96% of global browser usage in February 2026, so the fallback rarely triggers in practice. Test AVIF rendering by visiting your homepage in Chrome’s incognito window. Right-click any image and check the file extension in the saved dialog. AVIF means the new format works on your install.
Step 4: Turn On Native Lazy Loading
Navigate to Settings → Media in the WordPress dashboard. Look for the “Lazy loading” section. Tick the box labeled “Enable lazy loading for images”. WordPress 6.5+ uses the native browser loading=”lazy” attribute, which adds zero JavaScript overhead.
[SCREENSHOT: wordpress-media-lazy-loading]
Click Save Changes. Images below the visible area now load only when the visitor scrolls down. This cuts initial page weight by 60-80% on long blog posts. Above-the-fold images still load immediately, so hero images stay instant.
Step 5: Set a Max Image Dimension Limit
Navigate to Settings → ShortPixel → Resizing. Authors uploading 6000-pixel-wide phone photos waste bandwidth even after WebP conversion. Tick “Resize larger images on upload”. Set the maximum width to 1920 pixels. Set the maximum height to 1920 pixels.
[SCREENSHOT: shortpixel-resize-dimensions]
Click Save Changes. New uploads larger than 1920×1920 get scaled down before WordPress saves them. Existing oversized images need a one-time bulk resize action via the same panel. The limit applies only to future uploads unless you trigger the bulk re-process.
Step 6: Test the Result in GTmetrix
Open gtmetrix.com in a new browser tab. Sign up for a free account. Enter your homepage URL into the test field. Click Test your site. The test runs in 30-60 seconds.
[SCREENSHOT: gtmetrix-image-results]
Review the “Properly size images” and “Serve images in next-gen formats” rows. Both should show green checkmarks after the bulk conversion finishes. If WebP shows red, recheck Step 2’s “Also create WebP” checkbox. If “Properly size images” still shows red, run the bulk resize from Step 5.
Troubleshooting
Error: ShortPixel returns a quota error after 100 images.
Fix: The free tier covers 100 conversions per month. Upgrade to the $9.99/month plan for 5,000 conversions. Wait until the next billing cycle if you want to stay free.
Error: Images load broken with a generic placeholder after enabling WebP.
Fix: Your CDN cache is serving old image references. Purge the CDN cache via your CDN dashboard. The first reload after the purge regenerates correct WebP URLs.
Error: The bulk conversion job stops at 80% with no error message.
Fix: The hosting PHP timeout interrupted the job. Restart the bulk run from Media → Bulk ShortPixel. The plugin resumes from the last finished image.
Error: AVIF images are not being served despite the setting being on.
Fix: Some hosting setups strip the AVIF MIME type. Add AddType image/avif .avif to the .htaccess file at the server root.
Quick Recap
- Installed ShortPixel Image Optimizer with a free API key from shortpixel.com.
- Ran the bulk WebP conversion with the “Also create WebP versions” option enabled.
- Turned on AVIF as a secondary format for browsers that support it.
- Enabled native WordPress lazy loading from Settings → Media.
- Set a 1920-pixel max upload dimension to stop oversized future uploads.
- Verified the result in GTmetrix using the next-gen formats and proper sizing checks.
Pair this with the WordPress speed tutorial.