Gzip is the easiest way of compressing your site’s content and that too automatically, no work to be done on your part. It can compress files up to one-third of their size. Today almost all the webmasters use Gzip compression on their website, and if you are not one them then you are losing a lot of visitors.
Benefits of Gzip Compression
- Webpages loading speed is one of the factor that Google takes into account while stacking up search results. If your website loads faster, then it will be placed higher on search results page.
- There will be less load on the server since the compressed files are sent over the servers and hence results in less bandwidth use.
- People will stay for more time on your website since it takes less time for loading and gives users more time for consuming the content.
Gzip Compression on WordPress – Live Example
This website is on WordPress and is using Gzip compression. The CSS file for this website is 75.1 KB in size but the file you receive takes only 12.9 KB of your bandwidth. Gzipping the file leaves it with less than one-fifth of its file size.
For Those Who Don’t Believe the Figures Above
This is my CSS file which is currently used on my website.
Download the CSS file from the link above and note its size.
Now go to GTmetrix, a website that measures performance of websites and gives us detailed results for each and every element of the website. Type this site’s address in the input box and press the “Go!” button. After you have the results, go to the “Timeline” tab and search the CSS file. Now note the size and see the difference yourself.
If you want to see the page compression result then you can see it at WhatsMyIP
How to Enable Gzip Compression on WordPress Websites
There are two ways of doing this. Either you can enter the codes manually to your .htaccess file or you can install plugins that will automatically enable Gzipping on your website. End result is the same so you can go any way you want.
Enabling Gzip Compression by Editing the .htaccess File
.htaccess is a very powerful file and can do many tasks, one of which is forcing the server to Gzip the files. You have to add some codes to your .htaccess file to enable the Gzip compression. If you know how to edit the .htaccess file then you can add the codes given below at the end of it, if you don’t then you can read our tutorial on editing the .htaccess file from the WordPress dashboard or doing it through cPanel.
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddType x-font/otf .otf
AddType x-font/ttf .ttf
AddType x-font/eot .eot
AddType x-font/woff .woff
AddType image/x-icon .ico
AddType image/png .png
AddType text/css .css
Use WP HTTP Compression to Enable Gzip Compression on WordPress
WP HTTP Compression is a plugin designed only for this purpose, but provides Gzip compression only for HTML documents. It does not performs compression on other files. But for newbies and for people who are not good at handling codes and editing crucial files, this is the easiest option. It needs no configuration and hence has no settings page. Just install it and it works silently in the background.
LINK: WP HTTP Compression
Using WP Super Cache
WP Super Cache is a WordPress plugin that creates static HTML files from the PHP code present in your WordPress core files and the WordPress theme files. These HTML files no longer need to make PHP calls to the server, because these are now super cached static HTML files without the PHP code. This plugin also Gzips the HTML pages if you enable it in its options. Just tick the “Compress pages so they’re served more quickly to visitors” option in the advanced tab of WP Super Cache and it will start Gzipping your HTML pages in WordPress.
LINK: WP Super Cache
Gzip was a problem for earlier browsers but all the modern browsers are good at handling Gzipped content. Just add the above lines of code or use any of the above mentioned plugin and you will see a lot of improvement in your site’s performance.