If a picture really is worth 1,000 words, then why aren’t you using them to tell your brand’s story?
Flowery, poetic copy is great, but images bring life and emotion to your website.
They are visual descriptions of your brand and products.
And they do more than just give your audience a chance to see what you have to offer. They are critical when it comes to driving sales and shares.
You need them on your page.
But you can’t just add a few high-resolution pictures and be done with it.
Why? Because speed is the name of the game when it comes to web design.
If your site looks pretty but doesn’t load in the first five seconds, you can kiss those precious conversions goodbye.
Speed is a huge factor in driving traffic and conversions and producing general success.
And your site likely isn’t as speedy as it should be. In fact, according to Google, the majority of our sites don’t load fast enough.
This means that you are losing tons of conversions.
And the most likely reason is that 99% of your site design is images.
Here’s what I mean:
Your page size (the size in megabytes or kilobytes of all your page elements) is way too big. It’s causing slow load times and practically begging people to bounce.
Why? Because your images are taking up way too much space.
In fact, your images are probably taking up 99% of your page size.
And you need to fix that if you want increases in speed and subsequent conversions.
Having a slow site is not an option anymore.
Thankfully, this is a fixable problem. You don’t have to perform a full site redesign, either.
Here’s why 99% of your site design is images (and what you should and can do about it).
Most sites are heavily image-focused
So we know that you need images if you want to drive conversions.
But too many images can quickly add up when it comes to page size.
When compared to other page elements like text and buttons, images take up the most page space.
This means that the vast majority of your space is going to be dominated by images.
Let me be clear: Having lots of images isn’t a bad thing. In fact, the more images, the better.
But most people go wrong by forgetting to optimize their graphics for page speed and the size of the page.
For example, take a look at Evernote’s website:
It’s a minimalistic, beautiful site, to say the least.
But immediately, you notice that it’s image-heavy. There’s almost nothing in terms of text and other page elements.
Most of their site design revolves around images.
Or how about Intercom’s website:
It’s the same thing.
It’s dominated by images that convey most of the meaning.
And that’s perfect. Images are much better at communicating value and use than a block of text.
So it makes sense that their website designs’ focus is mostly on images.
But if you don’t put enough focus into getting images right, you might be suffering from page speed problems.
Marketo is another example of a site that’s heavy on the images, but they do it well:
Are you noticing a pattern?
The majority of sites are heavily image-focused.
In the next section, let’s dive into how these images can kill your site speed.
Slow sites kill conversions
In 2017, Google released some critical data from a page speed study that showed the shocking slowness of our websites.
The first piece of data involved exactly what I am talking about right now:
Images taking up the majority of your page and carrying the most weight.
In fact, according to the Google report, the average website page weight in bytes is much larger than the best practices suggest:
When it comes to average page weight, the lower the better.
The smaller your page weight is in bytes, the faster it will load and the more conversions it will drive.
As far as best practices go, you want to shoot for fewer than 500KB.
But most pages are hitting more than 2MB in size!
That’s a far cry from where pages should be.
And what does the higher page weight produce? You guessed it: page speed issues.
The best practice for page speed is three seconds.
If your website doesn’t load in the first few seconds, you are risking valuable traffic and sales.
So, the larger the page, the longer the load time, which leads to negative effects on traffic and sales.
It’s a vicious cycle.
Google’s findings confirmed this. The longer your site takes to load, the higher the likelihood of a customer bouncing:
If you look back at the average page speed graph, the typical range of speed is 8-12 seconds.
This means that people are bouncing from your site, en masse, simply due to the speed.
And that speed issue is developed from heavier page weight, which could be driven by the massive amounts of big image files you likely have on your site.
In fact, according to that same study, the average mobile site takes 22 seconds to load.
Thankfully for us, there is a way to diagnose and fix these issues to save conversions and increase speed.
Here’s how.
Diagnose your problems
Google did the legwork and found that the vast majority of sites are too slow.
This means your site isn’t performing at the rate that it needs to be to take advantage of the traffic it’s getting.
Thankfully, we can actually diagnose this issue fast and find great fixes!
A great tool for this is Google’s Test My Site tool:
This is the best mobile site testing tool that Google offers.
You can also use Google’s Page Speed Insights for desktop testing.
For this example, we will focus on the mobile-site testing, but feel free to use the desktop-testing tool, too, to get the maximum benefits.
Start by entering your URL into the bar, then click the arrow to start the test.
Next, wait about a minute for the tool to scan your entire website and provide you some valuable data and ways to fix the issues.
Once it loads, you can start to download your free report or see initial data from the test:
Notice how the load time on mobile was only four seconds, and still, I am losing 10% of visitors from it?
That’s how important page speed is.
A single second over the best practice is netting me a 10% loss in traffic.
Next, I tested my site with Google’s Page Speed Insights tool and found this:
Therein lies the real problem.
My images are sabotaging my website speed.
And by simply optimizing them, I can decrease their size by 78%.
That could potentially save me 2-3 seconds of speed and bring back my lost conversions.
That’s huge.
Remember that conversions are largely a numbers game. The more people who visit (and stay on) your site, the better your conversion rates get.
You’re exposing your brands to more people. Consequently, you enjoy more conversions.
But when your page speed slows down, visitors bounce. They’re too impatient — and they know that other sites load faster.
Let me give you a quick example of how images can add up fast on your site if you don’t optimize them.
Let’s say that you run your site on WordPress and you are going to add images to your blog post.
You head to the image library section and you upload a photo to add:
You click “Add New” and you start to import some images.
Now, take a look at each image and see what the file size is:
253KB for a single image.
Or how about this image that I uploaded recently:
2MB for one small image.
And remember, according to Google, the best practice for page weight/size is less than 500KB.
So even just a few of those images simply uploaded and left unoptimized can cause your site to run incredibly slow.
Most websites that I work with make this mistake quite often, too.
A user will upload product shots or in-app SaaS images to their features pages and then will make the page live.
Next thing they know, their page speed loading times are through the roof.
So it’s time to fix these issues.
Compress images
Larger files and page elements on your page will take longer to download.
When you download an application or program on your computer, the larger the size, the longer it takes.
Pretty self-explanatory right?
Well, it’s the same thing when it comes to your site.
Big images take up more space. When a visitor comes to your website, the browser takes longer to load because of those high-resolution images.
And according to Kinsta, the vast majority of size comes down to one pesky factor: bulky images.
Kinsta says that format selection, sizing, and compression are the biggest factors in reducing the size of a page and increasing speed.
They even recommend compressing your images down to between 60 and 70 percent of their original size.
Think of it like a laundry hamper full of clean clothes. If they’re all bunched up, they take up lots of space.
After you fold them, however, they’re condensed. You can easily fit them into your dresser drawers.
That’s exactly what you want to do with your images. They’ll look the same on the screen, but they’ll load faster for your visitors.
So, how do you do that?
If you use WordPress, there are tons of plugins.
One of my favorites is Smush Image Compression and Optimization.
This is one of the best plugins you can get for your site to automatically resize, optimize, and compress images for free.
It’s easy to install via your WordPress dashboard. Once it’s installed, you can start using it right away. Every time you upload an image, “smush” it.
You can also compress up to 50 images at a single time with the “Bulk Smush” feature:
And one of my favorite features is the automation.
If you navigate to your plugin settings, you can elect to automatically smush the images upon upload:
You can even automatically resize original images to a specific size:
If you choose to use this plugin, you can also use the feature that allows you to skip the process of smushing each image.
The plugin will actually scan your image library and detect images that need to be compressed:
WP Smush is a free tool that should be one of your best, most-used plugins if you use the WordPress platform.
But if you don’t use WordPress, there are a few other options for you.
A great place to start is with Compressor.io.
This tool is free to use and supports four different file types for compression. It also uses a technology that allows you to preserve quality while reducing file size:
To get started, simply hit “Try It!” and upload your photo for compression.
For example, check out this test photo that I compressed:
This tool was able to provide a 78% reduction in size with almost no noticeable difference in quality.
It reduced the size of the image from 7.57MB to 1.67MB. That kind of reduction can be pivotal when it comes to your website.
Another great compression tool is Compress JPEG:
This tool is great because you can bulk-upload 20 images at a single time in PNG, JPEG, and PDF formats.
You can then download the compressed images into a ZIP file for easy opening and sharing.
To start compressing, upload or drag your image files into the program:
For the sake of A/B testing tools, I uploaded the same image, and it had the exact same results that Compressor.io did:
A 78% reduction in size.
One thing that I love about this tool is that you can actually inspect the image in a side-by-side, close-up view to see if the quality is too low for your liking:
The image on the left shows the original image at 7.3MB in size.
The image on the right shows the compressed version at 1.6MB, a 78% reduction in size.
The quality is virtually indistinguishable.
To compress it further, just drag the sidebar down to lower the quality.
Another one of my favorite tools for compression is TinyJPG, or TinyPNG, depending on your file type:
With this free tool, you can also compress up to 20 images at a single time.
I tested an image on this tool that was 3MB and found a huge reduction in image size:
I was able to compress it by 74% to almost 500KB.
That’s a pretty incredible reduction, and the site even gives you an accurate picture of what your image size will likely be before you compress it.
So you need to try and compress big images as much as possible.
Even compressing small images will help you save tons of space in the long run.
If you have a site with heavily image-based pages, compression should be your go-to strategy for optimizing your website.
If you simply upload photos that are 5MB, you will have a slow site that practically forces customers to bounce.
Compression can fix most of your technical SEO problems when it comes to page speed and won’t reduce the quality of your images.
Conclusion
Images make your site look incredible. If you don’t have any images, you won’t convert visitors.
People love images because they connect with them emotionally. Pictures tell a story.
But if you have too many images, you risk huge impacts on speed.
And honestly, speed is probably the most critical factor when it comes to site traffic.
If your page takes 10+ seconds to load, you can guarantee that the user is clicking back to Google looking for the next website to solve their problem.
People don’t want to wait 10-20 seconds to get the content they need now.
Even if your site is conversion optimized, if you can’t get someone to actually reach your content, they aren’t going to convert.
And according to Google, most of us are suffering from this problem.
The few sites that aren’t are simply cashing in on our mistakes.
So, why is this happening?
Because 99% of your site design and page size is dominated by huge images.
Those beautiful product shots, explainer videos, and features pages are taking up too much space.
They are causing your pages to slow down and drive away conversions.
But, if you follow the steps we discussed, it’s not too hard of a fix!
Start by diagnosing your problems using Google’s free tools.
This can help you see what is causing your site to run slow.
Next, compress your images.
This is the biggest mistake that people make with website design.
Uploading images that are multiple megabytes in size will make your site run slower.
Try using various plugins on WordPress or using free website tools to compress your images in just a few minutes.
Fixing your site and page size can help you drive countless more visits and conversions fast.
How have you tweaked and fixed your site design for speed?
Grow your traffic