Enable GZip Compression on Your Website

Gzip is a software that uses algorithms to compress data files. Compressing a sites files allows for the data to be transferred to the browser much faster. Once the compressed files get to the browser, it is automatically unzipped and the page is loaded.

 Using gzip compression can lead to a 70% reduction in file size. The end result of this is faster load speeds for you website.

Where To Get GZIP Compression

The first spot to look for gzip is from your hosting company. Most of the popular hosting companies like Bluehost and HostGator offer gzip as a feature of their service. I use Hostgator and didn’t have to do anything but sign up for hosting service. It doesn’t get any easier than that. 

If you aren’t sure if your hosting company offers gzip, contact their customer support. They will be able to point you in the right direction. 

If your hosting company doesn’t offer gzip there are a couple of WordPress plugins that work great. The best is WP Rocket. You get gzip compression as well things like lazy loading and caching included. Some other good options are WP Super Cache and W3 Total Cache. They are caching plugins, but also have gzip compression. 

How To See If GZIP Compression Is Enabled

If you aren’t sure if you have GZIP compression activated, here are two ways to check:

1) Gift of Speed

Gift of Speed offers a free test to see if GZIP or Brotli are enabled. We haven’t covered Brotli, but it is a GZIP alternative. If you have Brotli enabled, there is no reason to switch over to GZIP. 

All you need to do is go to the Gift of Speed website and paste or type in the URL. Make sure you include https:// otherwise it wont work. After the address is in click “Check” on the right hand side. 

It will do some thinking for a few seconds, then deliver the results. For this test we looked at the DC Universe home page. In bright green you see “Gzip Is Enabled.”

Below that you can see the original size of the file, what is was shrunk to, and the compression %. DC Universe got over 81% which is some serious savings. 

Check for gzip compression with Gift of speed website

Because we have only talked about GZIP and not Brotli, some may be skeptical when I said you could continue using Brotli if thats what you have. Below, I ran the test for Google. Sure enough, they use Brotli to compress their files.  

Checking gzip compression with gift of speed website

2) Developer Tools

For developer tools I use the Chrome web browser. The first thing you want to do is go to the website you are checking for GZIP. Once there, go to “View” then “Developer” and click on “Developer Tools.”

Where to open developer tool

That will bring up a screen like the one below. The website will be on the left hand side and the developer tools will be on the right hand side. You will start out in the “Elements” tab by default so you will want to click on the “Network” tab.  

switch to network in dev tools

Once in the network tab you will see something like the image below. If it looks different, don’t worry. You probably just need to click on the “Use large requests tab.” Ill show you that in a second.

The other thing that may happen is you will be told to refresh the page. To do that just hit refresh or click on the URL at the top and hit enter. The page will reload and bring everything up.  

dev tools network view

OK, the image below shows you a couple of things. This is the same image as above, I just added some arrows and information. 

The top arrow shows you where that “Use large request rows” box is located. Just make sure you have the blue check there. 

A little farther down the page you will see a bunch of different file types. The one I have in red is the one we are interested in. Under “type” you can see it is a document. If you look at the ones below it, they are fonts, scripts, etc. We are after the main document. 

As you move down the row you’ll see “size” (purple arrow). The top number is the compressed size and the bottom number is the original size.  Next to it is time where you can also see the before and after. 

dev tool network key things to look at

Now we know what file we want to look at. It is usually the file at the very top, but sometimes it may be 1 or 2 down from the top. As long as the “name” is the website and  “type” is a document, you should be good. For this example, it was the first file so we will go ahead and clicked on it. 

When you click on it some information about that fie will show up. Under “content-encoding:” we see “gzip.” This means the site is being compressed with gzip. 

content encoding: gzip in dev tools

If you remember, Google uses Brotli instead of gzip. We went through the same process as above and found Google’s “content-encoding:” is “br.” Br is the abbreviation used for Brotli. 

content encoding: br example in dev tools

If you have never used the developer tools, this may seem complicated, but once you get it the process becomes easy. Both the dev tools and Gift of Speed website work so just use what you’re comfortable with. 

* One last thing I want to mention about the developer tool is if you don’t use it, start playing around with it in your free time. There is a whole lot of interesting stuff you can see and learn about any website.  

There you have it

There is your dime store tour of gzip. The good thing about this tool is you set it and forget it. You don’t need to do any upkeep or monitoring of it. Once you have it and get everything set it starts working in the background, compressing your files and delivering fast load speeds. If only every tool was so easy!