As Google becomes increasingly concerned with website user experience, web developers are rushing to become compliant.
After all, a major user experience factor, page speed and loading time have become a major search ranking factor as of July 2018. We are now well beyond that, it's time to stay updated, WordPress friends!
Yes, we're implying there will be implications on search engine results pages (SERPs)!
To that end, we will cover one of the fastest and easiest ways to improve performance by showing you how to enable GZIP compression in WordPress.
WordPress Tutorial Guide: GZIP Compression ✍️
- What is WordPress GZIP Compression?
- Why GZIP Compression Matters
- How Does WordPress GZIP Compression Work?
- How to Verify that GZIP Compression is Enabled for Your WordPress Site
- How to Enable WordPress GZIP Compression
- Wrapping Up: Everything You Need to Know About WordPress GZIP Compression
What is WordPress GZIP Compression? 🗜️
GZIP is a file format and a software application used for file compression and decompression.
GZIP compression was created by Jean-loup Gailly and Mark Adler. It was released as a free software replacement for the compression program used in early Unix systems.
As with the WordPress core software in general, GZIP was intended for use by GNU (open source, free software). The "G" in “GZIP” is from "GNU".
GZIP compression does not work on images, however, and it is a mixed bag when it comes to media files.
For example, some images files, such as MPEG and WAV files, compress well with GZIP, while other file types, such as MP3 files may actually increase in size if you try to compress them.
GZIP compression must be enabled on your web server in order for it to work you to enable file and folder compression (web servers with GZIP enabled will return the content-encoding: GZIP header in its response).
From the client side, all modern web browsers support GZIP compression and automatically ask for it when making HTTP requests -- this means that you can expect all users to reap the benefits of GZIP compression once you’ve enabled it.
Why GZIP Compression Matters 🤷
Besides implications for search, the negative impact of a slow loading website to the user experience can also impede conversions.
According to Neil Patel, 47% of consumers expect a web page to load in 2 seconds or less. If you’re running an e-commerce business, Kissmetrics again reports that up to 79% of customers say they're less likely to buy from the website, due to dissatisfaction with the user experience.
- Google Pagespeed Insights: It’s good to get this information straight from the source!
If you’ve uncovered a page load issue, it’s time to take action.
Compression is commonly encountered in the computer world. Put simply, It is a very handy method of grouping a bunch of files into a smaller file.
For websites, WordPress GZIP compression is the equivalent of file compression. And it can do wonders for your website’s performance—especially when it comes to improving page load time. If you have ever searched "how to gzip a file", this is the article for you.
Free Website Speed eBook
The 12-Step Checklist to
Achieve Loading Times Under 1 Second
How Does WordPress GZIP Compression Work? 🧐
When users go to your website, their browsers download these text files and will begin rendering the website according to the code contained within these files. These codes are then translated to something readable and understandable to the average human.⌨️ Clean, semantic code is the gold standard for human operators looking to modify over time, especially if you want to enable GZIP compression in #WordPress. Click To Tweet
As machines, browsers don’t require all that extra white space and extra formatting used to improve readability. As long as the browser can analyze code content, it can be written in one long block of text.
In general, WordPress GZIP compression takes away the formatting that is mainly used for human understanding. Reducing the length of code also reduces the size of the file containing it.
GZIP Test to Check if Compression is Enabled in WordPress 🧪
Before you proceed further, you can check to see if you already have GZIP compression enabled (for example, your web host might enable it by default during the account setup process).
One of the fastest and easiest ways of doing so is to use an online checker (such as Base64 Guru’s GZIP Test).
The process to check GZIP compression is pretty similar regardless of which GZIP test tool you select. All you have to do is provide the URL to your website, then run the search.
The tool will respond in one of two ways:
- It will tell you that your site is GZIP-enabled and show you how much space was saved via compression
- It will tell you that you do not have GZIP enabled
You can also check to see if your browser receives the content-encoding: GZIP header in the response it receives from the web server.
If you’re using Chrome, go to Developer Tools > Network, then click on the homepage name. Scroll down in the information that appears to find the Response Headers section.
How to Enable WordPress GZIP Compression 🏁
WordPress GZIP compression is actually something that you need to enable on the server side—not WordPress. When you host with companies like GoDaddy or Kinsta, they have this already enabled as part of their standard hosting packages.
For some of the other web hosts, it’s up to you to enable WordPress GZIP compression.
If you’ve determined that WordPress GZIP compression is not yet enabled, there are multiple methods to get started— we will cover several methods on how to enable GZIP compression in WordPress, including options for experienced backend web development and newbie WordPress users, alike.
1. Enable GZIP Compression: The WordPress Definition
Enabling GZIP compression for your WordPress site by editing your .htaccess file This is the most common way to enable WordPress GZIP compression.
This is the most common way to enable WordPress GZIP compression.
However, this particular method involves the possibility that you might break something. After all, .htaccess is a very sensitive server file, and one wrong move can mess up your whole website.
To reduce the likelihood of breaking your WordPress website, be sure to make a copy of the original file before making any changes. And back up your WordPress website!
Once you’ve covered all your bases, it’s time to get rolling.
The .htaccess file should be in the root folder of your website. This file, however, is usually hidden by default on both the remote server and your own machine, if you copy it.
The best way is to access the file is through FTP. Alternatively, you can use another admin interface or cPanel.
To enable WordPress GZIP compression in your FTP client, force hidden files to show.
Once you locate the .htaccess file, start editing it. Or, to be safe, download the file on your computer and first make changes on your own hard drive. The file is likely also hidden by default on your own machine, so force hidden files to show.
Add the following code, sourced from GTmetrix, below the sections marked by the # BEGIN WordPress and # END WordPress tags (beyond this, the specific location where you include the following code snippet doesn’t matter):
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml
# Remove browser bugs (only needed for really old browsers)
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0 no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent
Save the file and use it to replace your original .htaccess file. Then, run your website through a GZIP compression checker tool (or verify the response headers) GZIP compression checker tool to make sure that you were successful.
2. Enable GZIP Compression on NGINX or IIS
While most shared hosting plans come with Apache web servers, you may be using something else, such as NGINX or Microsoft’s IIS.
Enabling GZIP compression for NGINX web servers is slightly different from modifying the .htaccess file available to you if you were running on an Apache web server.
If you’re running on NGINX (like Kinsta), you can enable GZIP compression in WordPress by looking for your nginx.conf file and adding the following code:
If you are running Microsoft’s IIS, please see Microsoft’s documentation on how to enable GZIP compression in WordPress.
3. Contact Your Web Host to Enable GZIP Compression in WordPress
If you’re not comfortable making changes to your website files, it’ll be easier to ask your web host to enable WordPress GZIP compression for you.
Many web hosts, including all GoDaddy, Kinsta, and Siteground enable WordPress GZIP compression by default since it offers such noticeable performance benefits and is so easy to do, while others, such as Siteground, only provide their own instructions for enabling WordPress GZIP compression.
If you do not have GZIP compression enabled by default and you’re not comfortable making the changes yourself, reach out! In general, most web hosts will be willing to assist you with this query when you reach out to their customer support teams.
In general, most web hosts will be willing to assist you with this query when you reach out to their customer support teams.
4. Enable WordPress GZIP Compression with a Plugin
Of course, if you’re using WordPress, there’s always a plugin that can make the job easier. The caveat? More plugins means more potential security vulnerabilities—and space on your server.
Regardless, these plugins can help you to easily enable WordPress GZIP compression.
Enable GZIP Compression
However, Enable GZIP Compression does only one thing, and that is to help you enable and disable GZIP compression for your WordPress site if you are using an Apache web server.
PageSpeed Ninja is a full WordPress performance plugin, which means that one of its features is the ability for you to easily enable GZIP compression in WordPress. To do so, open up the PageSpeed Ninja plugin using the WordPress dashboard. Go to Settings > Advanced. Select GZIP compression under the Enable Compression section.
W3 Total Cache
W3 Total Cache is considered to be one of the best WordPress caching plugins.
A note of warning: WordPress newbies can easily break their website when using W3 Total Cache without proper configuration.
If you know what you’re doing, you can also enable HTTP compression by going to the browser cache, and checking the box for HTTP compression.
WP Super Cache
WP Super Cache is another WordPress cache plugin that offers the option to compress code.
To enable WordPress GZIP compression using WP Super Cache, go to the WordPress dashboard > WP Super Cache > Advanced > check the box for Compress pages so they’re served more quickly to visitors.
Wrapping Up 🍙
While there are plenty of ways to improve your WordPress site’s speed and page load time, GZIP compression is one of the easiest ways to do it.
Don’t wait for slow page load times to affect your businesses bottom line. Check your website to determine if WordPress GZIP compression is enabled. If it isn’t, you have plenty of tools at your disposal to turn the tides in your favor.
Once you’re done with WordPress GZIP compression, there are still several additional tactics you can employ for improving page speed. Educate yourself and take advantage of the available options—like image optimization plugins or using a CDN.
And if you need help with your next enable GZIP compression in WordPress adventures, just reach out to us here at WP Buffs. We have several care plans that can suit the needs of many different website owners, developers, and businesses.
Want to give your feedback or join the conversation? Add your comments 🐦 on Twitter.