• Skip to primary navigation
  • Skip to main content
  • Skip to footer
A Fearless Venture

A Fearless Venture

Avoid tech hassles. Save time. Boost performance. WordPress help, tech support & complete Site Care featuring Safe Updates & incremental Smart Backups.

  • Home
  • Services
    • Website Care & Maintenance
    • Website Speed
      • WordPress Website Speed Optimization
      • DIY WordPress Speed Improvement
    • WordPress Help Time
    • WordPress Tech Support / Quick Fixes
    • WordPress Website Design
  • Resources
  • The Blog
    • Speed Up A Slow Website
    • Running Your WordPress Website
    • For Entrepreneurial Creators

Website optimization: Why images slow your site & what to do about it

Images make a bigger impact on site performance than most people realize.

That’s not great news, for a number of reasons – chief among them that visitors are way more impatient than you think.

Oh ya, and our friends at Google. They might downrank your slow page or site.

The good news: Image optimization is easy

In fact, optimizing images is pretty much the easiest non-nerd website optimization tactic ever.

There are only a couple of things you have to understand about images to get your head around why they’re kind of a big deal if you care about website optimization.

First, the more images a page or post has, the longer it’ll take to load.

Next, larger images take longer to load up in a browser than smaller ones.

That’s it.

Let’s touch on why, and then jump to how to get your images – and your website – loading more quickly.

Related: We made a printable image optimization tip sheet to help you cover your image optimization bases; get it here.

More images = slower website

When you load up a page or post with many images, your visitor’s web browser acts like a skinny guy in a hot dog eating contest.

Trying. But choking.

By Michael CC BY 2.0, via Wikimedia Commons

If you need the image to illustrate a point, by all means use it. But don’t throw in extra images just for the sake of decoration.

Larger images = slower website

Larger images take longer to load than smaller images. So if you can get away with using something smaller, do it.

Figure out the width of the area the image will go into, and don’t use a larger image. Check out the Antelope Canyon image below.

The largest this image could possibly appear is 800 pixels wide, because it’s constrained by the 800-pixel-wide content area it’s in.

The average camera phone image includes many times the pixels actually needed. Same with stock images. It’s really easy to inadvertently load up your site with crazy-big images unless you set up your workflow to avoid it.

7 ways to do image optimization like a boss

1: Keep those pixels in check

One too-large image might not be a huge deal.

Usually, though, the same factors in play for one oversized image wind up adding hundreds of thousands of extra pixels and MB to the average WordPress Media Library.

Unless you’re a professional photographer or you need to clearly show tiny details, a 1,000-pixel wide image is probably gracious plenty for most posts and pages.

If you’re using an image full-width, like for a site or page header, you might want double that.

Figure out what you need and set your camera or your image optimization plugin to limit the size so you’ll never have to think about it.

2: Background image?

Using the image as a background? Try a size that’s smaller than the actual width of the area.

Even if you want the image to cover the full width, skimping on pixels can work to your advantage since the last thing you want in a background is crisp detail.

3: Is that image actually smaller?

When it comes to right-sizing images, know this:

Using the click-and-drag ‘handles’ in the WordPress post/page editor does NOTHING to the actual size of your images.

It only adjusts the size at which they appear.

Scale down your images with a method that actually discards some pixels; otherwise you’re loading the whole damn thing, however large it may be.

(Don’t worry – we’ll share a tool that’ll make this pretty much painless.)

4: Set things up so you don’t have to even think about image size

What’s the easiest way to resize? Don’t!

Grab whatever you use to shoot images. Cameraphone. Camera camera. Whatever.

Set that thing to be the max width you will ever need. BOOM – your workflow just lost a big step. No need to resize.

5: Use text instead of a text image

Text is super speedy to load because it’s almost always already included in the page instead of a separate thing the browser has to go out and get.

Sometimes you will need an image with text – a pinnable image for Pinterest, for example. Often, though, you can either overlay text on an image or style the text and get the effect you want.

6: Make images easier to fetch

A CDN (or Content Delivery Network) stores your stuff in multiple locations. When a visitor’s browser arrives at your CDN-enabled site, the closest location delivers the files.

You’d think going out to yet another place on the web would add time. Nope! It’s crazy how much of an effect moving stuff closer to visitors has on your site’s loading speed.

Jetpack Image CDN

If you have the Jetpack plugin installed, one of its dozens of modules (too many, BTW – turn off those you don’t need) is an image CDN.

The next option we’ll tell you about is magnitudes better, but if you decide not to do it, use the Jetpack CDN. It’s free, and easy to set up. Pretty much just clicking a button.

Get instructions here: https://jetpack.com/support/photon/

BUT: Do NOT turn on Photon if you haven’t optimized your images! It’ll store those unoptimized speed killers indefinitely. Even if you later optimize all your images, it won’t show visitors the optimized ones.

Cloudflare

Cloudflare is a CDN for your entire website – not just your images.

If you’re willing to go through a few more steps than it takes to activate the Jetpack CDN, you’ll be rewarded with a much zippier website or blog.

There are other benefits to using Cloudflare (e.g., protecting against attacks and outages), but speed alone is motivation enough to use it.

Cloudflare replaces Jetpack’s Image CDN, so deactivate that module before setting up Cloudflare.

You’ll have to sign up for an account, but the free level is just fine for the average WordPress user. You’ll also need to change your nameservers to Cloudflare’s to let them handle your website traffic. This means logging in wherever you manage your DNS (usually where you registered your domain name) and pasting in the nameserver information you’ll get when you sign up.

Get full instructions and sign up here: https://support.cloudflare.com/hc/en-us/categories/200275218-Getting-Started

7: The “short” answer to many image optimization questions

Image compression is a great way to reduce the size of image files and increase page load speed.

The best image compression tools work without noticeably affecting quality. They’ll also help you easily optimize your entire Media Library, and keep it optimized by automatically resizing and compressing anything you upload.

There’s 100% upside in the right image compression solution; there’s no one who shouldn’t use it.

The bad news: There’s no such thing as a free lunch

Image optimization isn’t something you should have to think about or work hard at. When it is, it doesn’t get done.

Free plugins have limits that force you to spend extra time on optimization. That isn’t the only reason I don’t recommend them. But it’s the biggest.

As of now, none of the free plugins I’ve looked at are good for automatically optimizing an entire Media Library.

If your library isn’t optimized and free is more important to you than the one-time $10-20 you’d spend to save hours of tedious clicking, use WP Smush.

If that’s you, no need to waste time reading the next section. Thanks for hanging with me this far. Now go get WP Smush and get busy clicking.

Good news: How about a cheap, fast, easy and actually good image optimization plugin?

ShortPixel is hands down the best image optimization plugin there is.

For people who appreciate quality and find repetitive clicking mind numbing, there’s ShortPixel.

ShortPixel is a ‘freemium’ plugin. It costs nothing to download. With it you can optimize 100 images per month for free. For myself as well as 9/10 of the sites I optimize, that’s plenty for maintenance once I’ve optimized existing Media Library images.

When you do need to pay ShortPixel, it won’t be much. $10 for 10,000 images? Pfffft – chump change.

The more you need, the cheaper it gets. Of the paid image optimization plugins I’ve personally used, ShortPixel is the least expensive. That’s not why I use and recommend it, though.

  • ShortPixel performs the best. Period. I use its maximum level of compression and my images still look great. On average my images are compressed by nearly half, saving over 52MB of space (and counting) in my web hosting account.
  • I set up maximum image sizes. Now, everything I upload is automatically optimized. I don’t have to think about it or do anything extra.
  • I tick “Remove EXIF” in ShortPixel’s General settings, and it deletes that data from the image file, reducing its size by an average of 8.5% more.
  • If I upload a PNG, ShortPixel converts it to a JPEG automatically if it’ll save on file size.
  • ShortPixel connects with Cloudflare so my visitors always get my optimized images.

WP Beginner tested five popular image compression plugins, and ShortPixel came out on top. I didn’t see their test until after I began writing this post, but it confirms my experience.

I always wondered why Media Libraries supposedly already optimized by WP Smush were drastically smaller after I replaced Smush with ShortPixel. Now I know.

That’s a wrap

Did we cover all the bases? Or do you still have questions? Leave a comment below and let us know.

Or maybe you’d like a 100% optimized Media Library and a faster-loading website, without DIYing it? Our WordPress Website Speed Optimization service is just the ticket.

Up for DIY image optimization if only someone would tell you exactly what to do so you don’t waste time or money or mess up your site?

Our 7 Days to a Speedier WordPress Website program guides you through the best ways to optimize images and speed up your site yourself – for 1/4 the price of pro optimization.

Ready to quit messing around and improve your site’s speed? Here ya go:

GIVE ME SPEED

Disclosure: We’re a ShortPixel affiliate. If you spend money with ShortPixel we receive a commission. As you know if you’ve read much of our stuff, we only recommend things that kick ass and that we personally use.

You might want to read these, too

  • Blog image optimization tips
    WordPress Image Optimization: Is your plugin broken?
  • 3 easy ways to lie to yourself about a slow website
  • Does website speed really matter?

By Teresa · Updated 23 September 2019

8
Leave a Reply

avatar
3 Comment threads
5 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
4 Comment authors
Kristen HubertKristenJadeTeresa Rosche OttJulie Recent comment authors
avatar
  Subscribe  
newest oldest most voted
Notify of
Julie
Guest
Julie

Terrific article! I definitely need to get on this!

You Must Be Logged In To Vote0You Must Be Logged In To Vote  Reply
1 year ago
Teresa Rosche Ott
Admin
Teresa Rosche Ott

Do it, girl!

You don’t have to do it all at once to start benefiting, but I suggest image optimization as a first step. A CDN will improve your site wherever you are speed-wise, but it’s better to magnify that effect with zippy images.

Also: If you’re thinking of using the Jetpack Image CDN, take a look at the “Take a hard look at Jetpack” post I published on Saturday. Couple of tips there to make sure you don’t do it in a way that hurts you. 5-minute read.

Thanks for reading & commenting, Julie 🙂

You Must Be Logged In To Vote0You Must Be Logged In To Vote  Reply
1 year ago
Jade
Guest
Jade

Hi there. Have you tried Imagify (made by the company behind WP Rocket)? How does it compared with the others?

You Must Be Logged In To Vote0You Must Be Logged In To Vote  Reply
4 months ago
Teresa Rosche Ott
Admin
Teresa Rosche Ott

WP Rocket is a great caching/optimization plugin we like a lot. So when its developers came out with Imagify I was curious about whether it could beat ShortPixel. By the time Imagify rolled out we’d already put at least half a dozen image optimization solutions to the test. We found ShortPixel by far the best in terms of performance as well as ease of use. That it’s cheap is a total bonus. I thought about trying out Imagify but it’s not always a great idea to jump between optimization plugins. So I did some digging around first. Short answer: It’s… Read more »

You Must Be Logged In To Vote0You Must Be Logged In To Vote  Reply
4 months ago
Kristen
Guest
Kristen

Hi, thanks for pointing me to this Teresa. One question though – how do you find out the size of the image content holder – I presume it is different for different themes in WordPress? I’m just not sure where to look!

Thanks!

You Must Be Logged In To Vote0You Must Be Logged In To Vote  Reply
1 month ago
Teresa Rosche Ott
Admin
Teresa Rosche Ott

Hey, Kristen – thanks for reading and commenting! It’s easier to show you this than explain with a comment, so I made a video using your blog as an example.

How to find the best max image size for your blog

Watch Video (02:47)

You Must Be Logged In To Vote0You Must Be Logged In To Vote  Reply
1 month ago
Kristen Hubert
Guest
Kristen Hubert

Thanks very much!

You Must Be Logged In To Vote0You Must Be Logged In To Vote  Reply
1 month ago
Teresa Rosche Ott
Admin
Teresa Rosche Ott

YW, Kristen 🙂

You Must Be Logged In To Vote0You Must Be Logged In To Vote  Reply
1 month ago

Footer

Kick ass with WordPress (we’ll help!)

A Fearless Venture Image Optimization Workflow Cheatsheet thumbnail

Every week we deliver short, actionable e-mails to a fearless tribe of online entrepreneurs & others who hate wasting time on technical BS.

Join us & we’ll start you off with a bang – a time-saving image tip sheet that’ll also help you speed up your website.

Fill in your info, click the button & check your e-mail for the download link. Unsubscribe at any time.

Copyright © 2009–2019 A Fearless Venture · Privacy Policy

  • Home
  • The Blog
  • About
  • Services
  • Contact
wpDiscuz