Why should you specify a Vary: accept-encoding header in your WordPress blog?

The Vary: Accept-Encoding header — it’s not on every server response, but it should be. When browsers make a request, they include HTTP headers for the server to decide what to send back (Is this a mobile client browsing? Will the mobile handle compressed version of content?). The fix is for the origin server to send back Vary: Accept-Encoding.

Before we begin, I have already solved several issues regarding page speed of WordPress blog. Here are some articles to increase your blog page speed:

  1. How to: Remove Query String URL From Static Resources in WordPress?
  2. How to: Enable HTTP Keep-Alive in WordPress?
  3. Top 3 Methods to Enable Gzip Compression in WordPress
  4. How to: Add Leverage Browser Caching in WordPress via .htaccess?
  5. How to: Add Expires Headers in WordPress using .htaccess?
  6. How to: Use CSS Sprites in WordPress Blog?
  7. Ultimate Guide to W3 Total Cache
  8. WP Super Cache: A Guide That You Really Need
  9. 10 Easy Steps to Setup CloudFlare CDN in WordPress
  10. Defer parsing of JavaScript in WordPress

Vary: Accept-Encoding

Solution

Add the following line of codes in your .htaccess file out of Begin and End WordPress section in .htaccess file:

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

If you have any kinda problem with it, please comment below. Thanks