CSS、JSファイルの圧縮によるサイトの速度改善！！

今日は、WordPressで組んだあるブログの速度改善を少し行っていました。

速度改善の際には、

私はまず状況を把握する為に

[ GTmetrix ]のサイトでいつもサイトの評価をを判定します。

結果はこんな感じです↓

Google（左側）が「C」、Yahoo（右側）が「B」

WPを使用しているので、まずは高速化を行ってくれるプラグインをいくつか試してみたのですが、

評価はほぼ変わらず。。。。

そこで、CSSやJavascriptの圧縮を行うことにしました。

方法は、

まず、CSSやJavascriptのコードを圧縮します。
http://refresh-sf.com/yui/#output
のサイトで簡単に圧縮できます。
※圧縮前のファイルのバックアップも忘れずに！！

で、圧縮が完了すれば、

次は各ファイルをgzip形式（拡張子は「.gz」）で圧縮します。
※例えば、「style.css」「common.js」というファイルであれば、
　圧縮後には「style.css.gz」「common.js.gz」というファイルが完成していると思います。

圧縮後のファイルをサーバー上にアップして、

「.htaccess」に以下の記述を追記してやります。

RewriteEngine on
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}\.gz -s
RewriteRule .+ %{REQUEST_URI}.gz
<FilesMatch "\.css\.gz$">
ForceType text/css
AddEncoding x-gzip .gz
</FilesMatch>
<FilesMatch "\.js\.gz$">
ForceType application/x-javascript
AddEncoding x-gzip .gz
</FilesMatch>

これで、設定は完了です！！

で、

もう一度

[ GTmetrix ]のサイトで評価判定をしてみました。

結果は、

Google（左側）は「C」から「B」へ改善、

Yahoo（右側）は「B」のままですが「73%」から「78%」へと

微妙な改善結果でした。。。

が、少しでも改善されれば、それで良しとします。

あとは、

画像の圧縮とキャッシュの設定を行って、

もう少しいろいろ粘ってみる事にします。

因みに、

サイトの改善点の把握には、

[ PageSpeed Insights ]のサイトも参考になると思います。