• Blogging
  • Monetizing
  • Social Media
  • Marketing
  • Plugins
  • Resources

Blog a Living

Tales of a Full-Time Blogger

Speeding up websites with image optimization

(This post may contain affiliate links. Please read our disclosure.)

How fast your websites load has always been crucial. I don’t think many people realize just how quickly a lot of potential readers will back away from a site because it’s not loading fast enough. Every second you can shave off means a few more people sticking around. But Google has said it will be considered as a ranking factor, so now everyone’s in a panic about lowering the time it takes to load their webpages.

Speeding up websites with image optimization

What I’m about to say will be so obvious to some of you that you’ll have trouble believing I’m saying it. But I am, because I see so many people not bothering with it. I don’t know if they’re all newbies or some of them just don’t realize it matters, or what, but here it is: you need to optimize your images.

The importance of small images

How much bandwidth your images take up has nothing to do with how big they look. It has everything to do with how big they are in bytes or kilobytes. Shrinking all your images as much as possible (without losing clarity) can take a few seconds off your load time (and that’s worth doing). This shrinking is what we mean by optimization.

How to optimize images in WordPress

In a WordPress installation, there are two types of images you’ll be dealing with: the images within your theme, and the images you put into posts. You’ll probably want to handle these in two different ways.

Theme images only need to be optimized once, so we’re going to go to a bit more trouble with them than we will with the post images. And yet, this is incredibly simple:

  • Take each image in your theme to Dynamic Drive’s optimizer. Yes, there are other free optimizers, but this one is extremely reliable and full-service, and some I’ve tested don’t do much.
  • There, you can enter either the image’s URL or upload it from your computer.
  • Generally, I ignore the “convert to” drop down window, click the “show all results” box, and hit “Optimize.” If for some reason (I can’t imagine what) it matters that all your images be in a particular format, you can select that format to avoid seeing a lot of options you can’t use.
  • It’ll present you with the image in all major formats, at several levels of reduced size. Look at them and choose the smallest version that looks good.
  • Download that version and upload it to your site.
  • If you selected a new file format, be sure to change your stylesheet where it references the image name.

That’s it! It’s really very simple and doesn’t even take all that long to do.

Post images are another story. If you can be bothered to feed each one of them into Dynamic Drive’s tool to get the best optimization, do so. But if you run 20 blogs or something, who’s got the time? Fortunately, there’s a plugin that will optimize your images decently on the fly: WP-Smushit. This plugin will automatically send images uploaded to your Media Library to Yahoo’s Smushit service for image compression, retrieve the results, and post that instead of the less compressed version you uploaded. It’s like magic!

Note: You can use Smushit for theme images too, rather than Dynamic Drive’s tool. But Smushit won’t give you the option of changing formats (.gif, .jpg. or .png) like Dynamic Drive will. This is just what I was talking about when I said DD’s version is more full-service than most. And for those one-time theme images you want to squeeze every last byte out of, it’s worth using the very best tool.

Tweak your Media Library settings

It’s also important to tweak your Media Library options, which can be found under your sidebar “Settings” at “Media.” From here, you can tell WordPress the various sizes you want it to automatically render images in. Scaling images also slows sites down, so you don’t want to be generating 150×150 thumbnails if your theme is going to make them 66×66 on the front page.

  • Set the thumbnail size to whatever you’re actually using.
  • If you use a different size within your post (I do – usually “Medium”), then also set that size to what looks good in your posts.

These settings are maximums, so it won’t stretch images and make them look strange – it will shrink whichever side needs shrunk to fit within that maximum.

Photoshop and similar tools

Yes, Photoshop and Fireworks and lots of other graphics editing tools will also do the optimization for you, if you have them. Look for that feature in your documentation and follow the instructions.

TwitterFacebookPinterestEmailReddit

Related Posts

  • Plugins to Replace Social Warfare
  • Review: Top 25 Social Icons plugin
  • Easiest way to move a WordPress installation to a new host
  • How to Secure WordPress Blogs

Filed Under: Plugins

Trackbacks

  1. Reducing Load Time Through Image Optimization | Digital Download Stampede.com says:
    April 15, 2012 at 10:14 pm

    […] in GIF format will often compromise the appearance of your image, so make your choice wisely! Reducing Load Time Through Image Optimization Even though more and more Internet use…te, and a very major consideration we have to make for dialup […]

    Reply

Get Email Notifications

If you want to be notified of every new BlogALiving post, subscribe on BlogLovin’!

Cool Stuff

After a buggy update blew up my websites, I decided to replace Social Warfare. Learn which plugins I used - and how they gave me a nice little traffic bump for speeding up my site.

Plugins to Replace Social Warfare

Stylized letter with email symbol sticking out of an envelope

Why I Don’t Have an Email List

At first I loved GetResponse. Then they dropped phone support. Then they flagged my account and froze it for no reason, and they won’t tell me why. Read more about my disappointing experience with this much-loved company.

Why I Decided Against GetResponse

The Theme I Use

I use Genesis on all my sites. I've tried a lot of free themes, ThemeForest themes and DIY (Thesis), and Genesis wins hands down.
StudioPress Sites

My favorite Host & Analytics

  • TigerTech Hosting and Domain Registration
  • Clicky Web Analytics

My anti-virus

If your PC gets infected, your website can become infected, too. Don't let it happen! My PCs run:

  • Emsisoft - great AV and firewall suite
  • Malwarebytes - designed to run along with other AV software
  • CryptoPrevent - a small program that blocks ransomware. Read more here: Cryptowall: how to protect your PC
  • Facebook
  • Twitter
  • Pinterest
  • Bloglovin

© 2005–2019 BlogALiving.com – About – Terms of Use – Contact – Privacy – Disclosure

BlogALiving is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for us to earn fees by linking to Amazon.com and affiliated sites..

  • Facebook
  • Twitter
  • Pinterest
  • Bloglovin
  • Recommended Blogger Resources
  • Blogging
  • Plugins
  • Marketing
  • Monetizing
  • Social Media
  • Email Marketing
  • About
  • Privacy
  • Disclosure
  • Terms of Use
  • Contact
  • Advertise
We use cookies to give you the best experience on our website. OkRead more