How to Optimize Images for WordPress (Without Losing Quality)

ByFrank Deardurff

Want to know the fastest way to speed up most small business websites? Fix the images.

When I look at a slow WordPress site, the culprit is almost always the same. Someone uploaded a photo straight off their phone or camera, a 4000-pixel-wide, 6 MB file, and dropped it into a spot that displays it at 800 pixels. The visitor’s browser downloads every one of those extra pixels anyway. Multiply that by a homepage full of photos and you’ve got a page that crawls, especially on a phone.

The good news is this is one of the easiest problems to fix.

Why image size matters

  • Speed. Images are usually the heaviest thing on a page. Smaller images mean faster pages.
  • Rankings. Google measures page speed (it calls it Core Web Vitals), and a slow site can cost you search visibility.
  • Visitors. People don’t wait. If a page takes too long to load on a phone, they hit the back button.
  • Storage and backups. Oversized images bloat your server and make every backup bigger and slower.

The three things to get right

1. The right dimensions

Resize the image to about the size it will actually be displayed. A few rough guidelines:

  • Full-width hero or banner: 1920 pixels wide is plenty
  • Image inside a blog post: 1200 to 1600 pixels wide
  • Thumbnails, team photos, logos: usually under 800 pixels

If you’re not sure, right-click the image on your site and choose “Inspect” to see how big it’s showing, then go a little larger so it stays crisp on high-resolution screens.

2. The right format

  • JPG for photos
  • PNG for graphics that need a transparent background, like logos
  • WebP for almost everything on the web. It’s smaller than JPG and PNG at the same quality, and every modern browser supports it.

3. The right compression

Compression shrinks the file by throwing away detail your eye won’t miss. For photos, a quality setting of around 75 to 85% usually looks identical to the original at a fraction of the size. A good target for most images is under 200 KB, and big hero images under 400 KB.

The free tool I built for this

I got tired of bouncing between apps to resize, convert and compress images, so I built a tool for it: the Image Utility Drawer. It’s free, and it runs completely in your browser. Your images never get uploaded anywhere. That matters when you’re working with client photos or anything private.

With it you can:

  • Convert between JPG, PNG and WebP
  • Resize by pixels, percent, or inches and centimeters
  • Compress under a target file size (say, “make this under 200 KB”)
  • Crop to common sizes like 1:1, 16:9 or 4:5
  • Batch convert a whole folder of images and download them as a ZIP
  • Pull a color palette from an image, add a watermark, and more

Here’s a video where I show how to resize a lot of images fast:

A simple routine before you upload

Make this a habit every time you add an image to your site:

  1. Resize it to the size it will actually display.
  2. Convert it to WebP (or JPG for photos if you prefer).
  3. Compress it to under 200 KB if you can.
  4. Rename the file to describe what’s in it. blue-kitchen-remodel.webp beats IMG_4382.jpg, and it helps with search.
  5. Add alt text in WordPress describing the image. It helps visitors using screen readers, and it helps Google understand the image.

What about optimization plugins?

Image optimization plugins can compress images automatically as you upload them, and many can convert to WebP and lazy-load images further down the page. They’re helpful, especially on sites with lots of authors.

But they work best on images that are already a sensible size. A plugin can squeeze a 6 MB photo down, but it’s still better to start with the right dimensions. And remember, every plugin you add is one more thing to maintain. (More on that in Plugins: How Many Is Too Many?)

Fixing the images already on your site

If your site has been around a while, there are probably some heavy images already in your Media Library.

  • Run your key pages through PageSpeed Insights. It will point out images that are too large or could use a better format.
  • Start with your homepage and your most visited pages. That’s where the biggest wins are.
  • Replace the worst offenders with properly sized versions.

The bottom line

You don’t need to be a designer to have a fast site. Resize, convert, compress, and name your images before they go up, and you’ll fix one of the most common reasons small business websites are slow.

Give the Image Utility Drawer a try on your next batch of images, and if you want a hand speeding up your site, WP Just Fix It can help.

Similar Posts