How to fix “Specify a Vary: Accept-Encoding Header” warning?

While optimizing your website for website performance using tools (ex. GTmetrix), you’ll run into a “specify a vary: accept-encoding header” warning.

What exactly does this mean? How can we fix this? In this tutorial, we’ll learn what’s the error and how we are going to resolve the issue.

What is this warning?

Accept-encoding header is an HTTP header that must be included on every origin server response in order to inform the browsers if the client can handle the compressed (zipped) version of the website or not.

The warning could appear when you don’t use the “Vary: Accept-Encoding” in your header on a server or content delivery network (CDN) settings. If you do not use this setting properly, this will cause many issues like sending the compressed version of your website to the old browser. Though it is not a major issue because the majority of users are only using a modern browser, only a few of us are using old ones.

But not using this setting can actually affect your website’s performance in front of clients, especially when your target audience is every single user in the world.

Where to find this warning?

The warning is not visible on modern browser, but we can find the issue either in old browser or with a CDN when implemented with website for performance.

But we can find this warning by conducting website performance analysis tools like GTmetrix or Pingdom. Once you enter your website’s URL on their tool, you’ll see all sorts or performance issues and warnings highlighted by the tool.

But do not worry, we’ll see how to easily fix this warning.

Fixing “Specify a Vary: Accept-Encoding Header” warning from the web server.

To fix this waning, we need to tell our web server and it’s configuration to add that “vary: accept-encoding” header for the compressed files or file extensions.

Users who use the Apache webserver.

Making changes in Apache is more simple, all you need to find .htaccess file located in the root directory of the website. Using file manager, or FTP client you can modify the file and add the below configuration to fix the warning.

<IfModule mod_headers.c>
    <FilesMatch> ".(css|js|html|gz|xml)$">
        Header append Vary: Accept-Encoding
    </FilesMatch>
</IfModule>

Before modifying, I’ll recommend making a backup of existing .htaccess file.

Users who use the Nginx webserver.

To fix the same warning in Nginx, you’ll need to modify the configuration file in your virtual or dedicated server via SSH. The configuration file that you need to modify is located at /etc/nginx/nginx.conf in rare cases, the location may differ.

Once you’ve located the configuration file, just add the below line in the gzip section or after gzip on; which can be found inside the HTTP block.

gzip_vary on;

Once the directive is added, save the file, and reload the server. You can restart too but that’s not recommended on a live site with many users visiting your website.

systemctl reload nginx

If you want to restart nginx just replace above reload word with restart.

Now, it’s testing time.

Wait, before testing, clear the cache if you are using any caching plugin.

Once you recheck the website in the same tools, you’ll see the warnings are gone and you can focus on other issues and warnings.