こんにちは、孔雀です。
この記事では、Googleが提供している「PageSpeed Insights(ページスピードインサイト)」でブログの表示速度を診断した後に出てくる「圧縮を有効にする」の修正方法について書いていきたいと思います。
パソコン初心者レベルの私にも出来ましたので、誰にでも出来るやり方です。
今回いろいろなブログでやり方を調べながらやりました。
その中でも一番わかりやすかった、旅のレシピさんの
「圧縮を有効にする-WordPressを高速化「PageSpeed Insights」」
という記事を参考にさせていただきました。
.htaccessに直接書き込んで設定する方法
この項目は、Wordpress側で設定できるものではないようで、サーバー内にある「.htaccess」に直接書き込んで設定します。
私が使っているエックスサーバーでは、サーバーパネルから直接書き込んでアップロードができます。
# mod_deflateを利用して Gzip圧縮
SetOutputFilter DEFLATE
# Mozilla4系、IE7、8の古いブラウザでは無効にする
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch \bMSIE\s(7|8) !no-gzip !gzip-only-text/html
# GIF、JPEG、PNG、ICOなど圧縮済みの画像は再圧縮しない
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
# プロクシサーバが間違ったコンテンツを配布しないようにする
Header append Vary Accept-Encoding env=!dont-vary
# 各コンテンツを圧縮する設定
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/js
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-font-woff
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
上記の内容をそのままコピペして[.htaccess編集]内に追加してください。
元から記述されたタグをいじらないで、そのタグの下に追加するように記述します。
記述したら、[.htaccessを編集する(確認)]をクリック、[.htaccessを編集する(確定)]をクリックして完了です。
4/7のPC作業時間は8時間30分