[.htaccess]gzip圧縮を使ってWordPressの表示速度を改善する方法

November 28, 2017Code

WordPressで実装したサイトの速度改善を測る

ページの表示速度がユーザーの離脱率に大きく影響するのは既知の事実としてあげられますが、その中でも最低限対応しておきたいのが、サイトのgzip対応。

対応されていないサイトの場合は以下のような表示がされてしまいます。

gzipでページスピードを改善

Pagespeed Insights

プラグインで対応するのも一つですが、プラグインの場合アップデート云々の問題で後々面倒なことになる可能性があるので今回は直接.htaccessに直接圧縮を指示するタグを記載することで解決してみたいと思います。

gzip化ができているかどうかのチェック

まずは、現在の対応状況を確認してみましょう。

http://www.gidnetwork.com/tools/gzip-test.php

gzipでページスピードを改善

「Web page compressed?」の箇所が「No」になっていますね。
gzip未対応という意味です。
それではここからgzipに対応する.htaccessを記載していきましょう。

.htaccessへ圧縮を指示するコードを記載

index.phpに吐き出されている.htaccessを任意のFTPクライアントを用いて開き、以下のコードを続けて記載しましょう。


AddType image/x-icon .ico
 
<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI _\.utxt$ no-gzip
#DeflateCompressionLevel 4
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
</IfModule>
 
<ifModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType text/html "access plus 1 seconds"
ExpiresByType image/gif "access plus 2592000 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType image/x-icon "access plus 2592000 seconds"
ExpiresByType text/css "access plus 604800 seconds"
ExpiresByType text/javascript "access plus 216000 seconds"
ExpiresByType application/x-javascript "access plus 216000 seconds"
ExpiresByType application/x-shockwave-flash "access plus 216000 seconds"
</ifModule>
 
FileETag none
 
<FilesMatch "^(wp-config\.php|wp-mail\.php|install\.php|\.ht)">
order allow,deny
deny from all
</FilesMatch>

記載を終えたら、保存、アップロードで完了です。

再度gzip化ができているかどうかのチェック

先ほどと同様にチェックを行いましょう。

gzipでページスピードを改善

「Web page compressed?」の箇所が「Yes」になっていたら完了です。
これだけでもそれなりにスコアが向上するので、未対応の場合は是非入れてみましょう。

この実装はこちらの記事を参考にさせていただきました。

.htaccessでかんたんgzip圧縮!プラグインを使わずWordPressの表示速度を上げる方法