How to enable Gzip compression for a WordPress website

Zip it

The internet brings a world of multimedia content to our devices in a way that would have been pure science fiction just a few short years ago. That doesn’t mean site owners can rest on their laurels however — the need for speed is as pressing as it ever was. Gzip compression is one of the most effective ways of making your site screamingly fast, and making sure it’s working is all but essential.

Making your WordPress site as zippy as possible should be high on your to-do list. It keeps the Google overlords happy, makes life easier for mobile users, and is just plain good online manners all ‘round.

In this piece we’ll step through what Gzip compression is and how best to enable it. Let’s start with the basics.

What’s Gzip and why do I need it enabled on my site?

Gzip, as Wikipedia pithily puts it, is “a file format and a software application used for file compression and decompression.” It’s also (conveniently) a format understood by all modern browsers, capable of being generated by all modern servers, and it works particularly well on text content.

The good news for site owners is that the modern mashup of JavaScript, HTML, and CSS making up the bulk of your site’s public face is all just text from the point of view of your hard-working browser — it’s ripe for compression, and Gzip is the perfect tool for the job.

You can expect bandwidth savings of up to 80 percent simply by switching this on.

Gzip Compression Sample Size Reductions
Sample size reductions from Google Developers.

As Google points out, there are two particularly important items to note with Gzip:

  1. All modern browsers support Gzip compression and will automatically request it.
  2. Your server needs to be configured to enable Gzip compression.

What this means for you is that this isn’t a setting you’ll be fiddling with in WordPress; it’s something you need to change at the server level. (The good news for GoDaddy customers is that it’s already enabled on all current hosting packages.)

If you want to check whether your site is already serving Gzip content, simply punch it into the aptly named checkgzipcompression.com. If you see a message such as the following, you can basically stop reading here and get back to cranking out great content for your users:

Gzip Compression Enabled Message
Congratulations! Your site is serving compressed content.

If, on the other hand, you’re looking at a something more like the unhappy screenshot below, then it’s time to roll up our virtual sleeves a little further:

Gzip Compression Not Enabled Message
Oh dear … further work is required.

With that said, let’s take a look at your options!

Option 1: Ask your host to enable Gzip

If the thought of messing about with server settings puts you into a panic, it might be better to simply reach out to your hosting provider and ask if they can enable this for you — alternatively, make the switch to GoDaddy and remove the problem entirely!

Option 2: Enable Gzip via .htaccess

If you’re like most WordPress users, chances are Apache is happily chugging away behind the scenes as your web server. In order to get it delivering compressed content, you’ll need to make some changes to your .htaccess file.

Now is an excellent time to remind you that changing .htaccess files can potentially bork sites, so make sure you have a copy of your existing file before going any further.

 

If you’re scratching your head at this point, thinking what on earth is a .htaccess file?, check out this useful summary.

Show Hidden Files
You may need to force showing hidden files in your FTP client.

Your .htaccess file should be located in the root folder of your website. Bear in mind that it’s a dotfile, which means it might be hidden by default on both the remote server and your own machine if you copy the file to it. Check out the following linked useful overviews of how best to handle these files on Windows and Mac if you’re running into trouble at this point.

Now, working with a copy of your existing .htaccess file, add the following:

AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/opentype

# For Olders Browsers That Can’t Handle Compression
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

Next, replace your existing .htaccess file with your new one (being sure to keep a clean copy of your previous file to hand in case of emergency), and check your site again. All being well, you and your users should now be benefiting from the wonders of compression!

Gzip compression wrap-up

The list of potential speed improvements that can be made to the average WordPress site is a lengthy one, but making sure Gzip compression is enabled is easily one of the most high-impact improvements available — tackling it first makes an awful lot of sense.

Let’s recap the steps we covered to do so:

  1. Start off by checking if Gzip is currently enabled on your site. If it is, you’re good to go!
  2. If Gzip’s not enabled yet, start by asking your hosting provider to switch it on from their side.
  3. If you’re comfortable with tinkering with .htaccess files, carefully enable Gzip compression with the code we covered.

One last thing before we sign off — in case you’re wondering why we didn’t cover a plugin solution above, the reason is simple: surprisingly, there is no current, well regarded plugin solution.

Have you tackled enabling Gzip compression on your own site yet, or do you have alternative techniques to recommend? Get in touch via the comments section below and let us know!

Image by: Kinchan1 via Visual hunt / CC BY

Tom Ewer

Tom Ewer is a freelance writer, online entrepreneur, and the founder of Leaving Work Behind and WordCandy. He has been obsessed with WordPress since he first laid eyes on it, and has been writing educational and informative content for WordPress users since 2011. When he’s not running his businesses, you’re likely to find him outdoors somewhere – as far away from a screen as possible!