Website obesity. It’s a real problem, folks, and it’s getting worse.

When it comes to web page weight it goes to reason that size matters. The smaller the file size of a page, the faster it will load, right? Right! Page bloat (aka page weight or page size) refers to the total size of a specific web page. This includes HTML documents, style sheets, imagers, scripts, and more.

Seven years ago, the average webpage only required an 807KB download. In 2012, the average page hit was 1MB. In 2016, the amount of data users were required to download from an average webpage was around 2.4MB. In 2017? The average web page was 3MB.

To be frank, there’s really no such thing as a typical website and It’s best not to use HTTP Archive’s numbers as a benchmark for your own site. The averages we just looked at are taken from the HTTP Archive and are averages of large data sets and there are plenty of outliers. However, the general trend is that pages are getting bigger at a pretty consistent rate of growth: In 2010, the average web page size in 2010 was 467.7KB compared to 1711.4KB in 2018.

Page bloat matters. Data volume matters; it impacts everything from user data and bandwidth limitations to carbon emissions. From a marketing perspective, the slower a page loads, the faster a visitor bounces.

Here’s how to lose that website weight in six steps:

1. Delete unnecessary plugins, fonts, and more.

Website plugins can work against you. Go ahead and deactivate and delete any plugins you no longer need. Yo can always add it back later if you need it.

Along the lines of getting rid of unused plugins, you should remove any themes, webfonts, scripts, or other resources on your site that aren’t currently being used. There’s really no need to be using seven different fonts on your website. Typography is foundational to great web design but each additional resource is something visitors must download when the go to your site so get rid of unnecessary fonts.

2. Reduce image sizes.

Developers are often concerned with the size of images as images make up the bulk of the average web page. You should definitely make sure you’re not serving up huge images to your users. Optimizing your images is an easy win. Start by reviewing your images and removing any you don’t need. Then use an image optimization tool, like Imagify, to compress them and remove unnecessary file information. This will help your image load faster which will improve the mobile user’s experience immensely.

Side note: the use of videos has really taken off in the the past few years. Recent HTTP Archive data indicates video now accounts for 2/3 of the average web page’s size.

3. Get rid of coding inefficiencies.

You know what really drags a website’s load time down? Heavy scripts, errors, bad requests, and redirects. A tool like Google Insights lets you enter your site’s URL and run a scan. The results help you identify problem areas on both mobile and desktop devices and how to fix them.

4. Use website compression

I’m sure you’ve “zipped” a file before. Website compression works in a similar way to save on bandwidth. You can quickly tell whether your website is already using compression or not by visiting Check Gzip Compression. If it’s not, enabling website compression can be as simple as adding a few lines of code to the .htacccess file in your website root. But if you can’t tell a Linux from an Apache server, you might want to stick to the plugin approach. Most of the time compression is built into an all-purpose caching plugin.

5. Minify your resources and combine assets

Want to trim your code down even more? Minify and combine CSS and JavaScripts to streamline your resources even more. This will reduce page weight and the number of HTTP requests needed to load your site. While you’re at it, gather up all the HTML files in your site’s directories and combine them into one library. Having all your HTML, JS, and CSS files combined makes them easier to locate and faster to load.

6. Leverage caching

Every time a website visitor’s browser loads a web page for the first time, the server springs into action. It finds and returns requests for headers, footers, new posts, widgets, and all the other relevant content. Caching collects all of a web page’s files and resources into a temporary package and places it where the server can find it again quickly — making the page load faster for users on subsequent visits. A plugin like WP Rocket will handle caching as well as other features like page compression, automatic cache rebuilding, and minification.

~ ~ ~

There are a number of website metrics that you should be concerned with but page weight is an important factor to consider because it contributes to page speed. And sure, the internet is getting faster. Browser technology, caching, and faster networks all contribute to making the world wide web faster for users. But that doesn’t mean you should let your website put on extra fat!

Remember, less is more. Make sure to be regularly monitoring your website to ensure you’re only using what you absolutely need. Drop us a line if you need help keeping your site lean so it can perform at optimal speeds!

Pin It on Pinterest