How to save your images for the web and why you need to

If you’ve ever built a website with a professional, I’m sure that you’ve at least heard that it is important to save your images for the web. But why? Why does it matter? In 2020, high-speed internet is almost an expectation, so shouldn’t your user’s connection speed be able to handle if you don’t save those photos down? Well.. yes and no. Mostly no… Here’s why!

Why do you need to save images for the web?

The biggest, most obvious reason why you need to save your images for the web is that page speeds matter and that’s enough.

But before we go on, we need to get two things out of the way.

  1. I am legally required to let you know that some of the links below are affiliate links. All this means is that if you click on them and make a purchase, then I will get a small financial kickback for sending you their way. To be honest, I’m pretty lazy when it comes to monetizing my own website, so not all of them are affiliate links. I also want to say that I don’t base my recommendations on affiliations – ever. I base them on my personal experience and see if there’s an affiliate program afterward.
  1. The featured image is of an old man playing the accordion. Why you may ask? Well because he’s SMUSHING the accordion together. Haha! Get it? Smushing it? Like what we’re doing with photos? Man, I’m funny…. okay moving on.

Page load times are important

The time it takes for your customer to press enter in their browser and start reading the content on your website is crucial for today’s online marketing. Not only are we talking about the convenience that your customer is given by not having to wait, but there are tangible reasons why page speed matters.

  • Google Search rankings take into consideration your page load speed. A slower site is heavily penalized.
  • The average user will not stay on a web page longer than 3 seconds waiting for it to load.
  • The majority of users use mobile these days, and mobile often has a slower internet connection.

You are losing money if your customers are leaving the site because it doesn’t load quick enough due to oversized images and it’s completely avoidable.

How do you save images for your website?

Saving photos for the web is pretty straightforward. In fact, you have a lot of options on how you want to do it. My personal favorite is a combination of the following. I both use photoshop to save the photos down to a reasonable size, to save server space, then I use server software to compress them even further.

Desktop software that you could use

There are two big players in the desktop software space that you can use. One is free and one is Photoshop. I personally use Photoshop, but if your industry doesn’t require you to own a copy of the adobe suite like mine does, then I would recommend Gimp.

Photoshop

Photoshop has been around since 1990. It’s a pixel-pushing-powerhouse used by everyone from first year art students to multi-million dollar graphic artists. It’s the digital equilvelant to an entire art-studio of supplies all at your finger tips. It is, by far, so over-qualified to save your images down that it’s kind of laughable. That said, it still does a great job of doing it, so I use it nearly exclusively.

Gimp

Gimp is another tool. Think of it like… store brand Photoshop. It’s free and does pretty much everything old versions of Photoshop does, which includes saving photos for the web. It doesn’t come with many of the bells and whistles that the new Photoshop CC comes with, but it’ll get the job done in a pinch.

Free online tools for saving your photos for the internet

If you’re willing to upload your photos to a third party website, there are tons of solutions that will save the photos down for you. Not all of these are safe though, so bear that in mind when using them. My biggest recommendation here is that if it looks sketch, it probably is.

I have had pretty good luck with the following two options and haven’t, to my knowledge, been infected with any malware from using them. I honestly don’t fully recommend these since I’m not super comfortable having other websites save my photos for me, but they do and have worked for me in the past. Use them at your own risk I suppose.

WordPress plugins that get the job done (that I’ve actually used)

What about the WordPress plugins that I mentioned using earlier in the article? Well, there are many. Below are 3 that I have used myself and have had pretty good luck with. They all have a free and paid model. The general rule is that you get so much compression for free, but beyond that, you will need to have a paid license.

EWWW Image Optimizer (freemium)

So this one is a bit confusing. This is both an API and a plugin. This API can be used with many plugins, but they also have their own plugin. The API is great. You pay very very little per photo.

A few plugins that you can pop this API into are:

I think that EWWW is definitely worth checking out and is worth the money.

WP Smush (freemium)

WP Smush, by wpmudev, is another popular image compressing plugin. I’ve used this one a lot actually and have had pretty good luck! The free version limits how large of photos it will compress for you, but it’s limit was pretty reasonable at 1MB the last time I used it. If you can get your photos below 1MB using any of the previous methods, then this can take care of the rest for you.

reSmush.it (free)

ReSmush.it is another API similar to EWWW. Honestly, I’m only mentioning this one because it’s super popular, not because I like it. I think if you’re using an API like EWWW, you should probably just use EWWW. But yeah, this one exists. Check it out here if you want more information on it. :)

Jetpack

After you get your images to a reasonable size using EWWW or WP Smush, you can take it even further with Jetpack. Jetpack can convert your photos to next-generation file types (like WebP), which will load super quick. This is how we do it here on Zealous Sites, and how I recommend doing it almost everywhere.

Beyond Image Optimization

Image optimization isn’t the entire story. The goal is a faster website load time, and saving your images accordingly will get you close, but for the best results you need to do a few more steps!

Hosting

Make sure you have the correct hosting for your website! We love SiteGround and I think you will too. Check out this article for more information on what hosting is, why it matters, and why you probably just want SiteGround.

Content Delivery Network

And beyond hosting, you have CDNs. We personally use Cloudflare as a CDN. It’s fast, reliable, and easy to set up with SiteGround. Although you will need to make a couple of changes on your own Cloudflare account if you’re using Divi (which you should be). I go over what and why here.

Compression / Minification Plugins

If you’re using Divi, then you already have a way to minify all your files. If you’re on SiteGround, you have another – better way. But if you’re not on either, or if you just really want to take it as far as you possibly can, then you can install some compression plugins. There are a few that have worked wonders for me in the past.

If you want just a single plugin to do it all for you, I would recommend WP Rocket. It gives you the options of compressing images, files, reloading cache, server-side gzip compression, database optimization, CDN integration, and much more. They are definitely worth checking out if you want a single solution for going fast.

Table of Contents

Stay In The Know!

Fill out this form to get blog posts similar to this one sent to your inbox at a frequency you're comfortable with!

Subscribe
We have to pay the bills too. Ads help a little. Thank you for lending us your eyes.