【特集】WordPress高速化への挑戦!

deflateを使用してリソースを圧縮する方法!WordPressが劇的に高速化!!

ごめん、待たせちゃった・・・

PageSpeed Insightsのスコアを改善するべく、

1つずつ改善する方法を調べては実行してきました。

今回は、gzipやdeflateを使用してリソースを圧縮するという指摘に対する改善方法です。

 

この改善を実施した後、劇的にサイト読み込み速度が速くなったような気がするんですが・・・。

PageSpeed Insightsの結果を見てみよう

まずは、改善をする前にPageSpeed Insightsの結果を見ておきましょう。

WordPress deflate使用前の結果

deflate適用前のPageSpeed Insights結果

 

上の画像がその結果ですが、deflateを使用して圧縮すると転送サイズが削減できるようです。

転送サイズが削減できるから通信時間が短くて済むようになるということですね。

つまり、WordPressの高速化ができるというわけです。

 

では、早速deflateを使用して改善してしまいましょう!

.htaccessファイルにdeflateのコードを追記する

deflateを使用する方法は、

WordPressブログの.htaccessファイルの末尾に下記のコードを追加するだけです。

<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
# 古い WWW ブラウザでは無効・MSIE は除外
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
# 圧縮する mime タイプを指定
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>

 

これを追加するだけで、先ほどあれだけ出ていた指摘事項がたった1個に激減!!

WordPress deflate使用後の結果

deflate適用後のPageSpeed Insights結果

 

いやあ、何とも簡単に改善ってできるんですね!!

コードを追加するだけで高速化できるんですから、やるしかないでしょう。

PageSpeed Insightsのスコアで言えば、5~10点上がる効果があるようです。

【広告】

リソースを圧縮するとは?

deflateでいうリソースとは、css、html、JavaScriptなどのことを指します。

これらを圧縮しないままだと、サーバーからの転送サイズが大きくなります。

つまり、サイトの読み込みが遅いということになるわけですね。

 

そこで、これらのリソースを圧縮しておいて転送されるサイズを小さくし、

サイトの高速化を図ろうと言うわけです。

 

注意してほしいのは、

ここで説明しているのはエックスサーバーを使っている前提だということです。

すなわち、他のサーバーではdeflateが動作しないかもしれません。

 

余談になりますが、

使い勝手や動作環境や各種対応状況を考えると

エックスサーバーを使うことをオススメしたいです。

icon-external-link http://www.xserver.ne.jp/

【広告】

関連記事

  1. SNSで流れてきた商品をポチろうか悩んでいる女子

    ブログの表示速度を遅くしないための広告の貼り方とは!?

  2. イケメンにフィッシュオン!

    WordPress高速化のための最適なJPEG/PNG/GIF使い分けはこれだ!!

  3. ランタンを見つめる文学美女

    WordPress最適化をした結果PageSpeed Insightsスコアはどう変化したのか!?

  4. 休日を読書で過ごす女性

    ブラウザのキャッシュを活用する-たったの5分で改善する方法!!

  5. 目を閉じるたびに思い出す

    PageSpeed Insightsの点数を90点以上にした5つの改善を紹介!!

コメント

  • トラックバックは利用できません。

  • コメント (0)

  1. この記事へのコメントはありません。

WordPressテーマ「SKIN(TCD046)」

人気記事

  1. 目を閉じるたびに思い出す
  2. はい、正解は私でした
  3. 休日を読書で過ごす女性
  4. ごめん、待たせちゃった・・・
  5. 指をさすビジネスウーマン
  6. イケメンにフィッシュオン!
  7. 「いいね!」するビジネスウーマン
  8. 「問い合わせ先はコチラ!」と告知する地方局のアナウンサー
  9. スマホで健康管理を行う意識の高い女性
  10. すべてを許したくなるエンジェル笑顔

広告




おすすめ記事

  1. メモを取る女性 お名前.comからエックスサーバーへのドメイン移管手続き備忘録
  2. はい、正解は私でした 賢威7サイトタイトルとトップページタイトルの違いを易しく説明します!!
  3. すべてを許したくなるエンジェル笑顔 WordPressで投稿済みの記事を一括置換できるSearch Regexの使い…
  4. ランタンを見つめる文学美女 WordPress最適化をした結果PageSpeed Insightsスコアはど…
  5. SNSで流れてきた商品をポチろうか悩んでいる女子 ブログの表示速度を遅くしないための広告の貼り方とは!?
  6. 「OK、そういうこと!」と締めくくるキラキラ女子 賢威7を使ってココが良かったと思う3つのこと(投稿画面編)
  7. 目を閉じるたびに思い出す PageSpeed Insightsの点数を90点以上にした5つの改善を紹介!!…

特集記事

  1. SNSで流れてきた商品をポチろうか悩んでいる女子 ブログの表示速度を遅くしないための広告の貼り方とは!?
  2. 「いいね!」するビジネスウーマン WordPress高速化!全画像を一括圧縮するEWWW Image Optimi…
  3. 休日を読書で過ごす女性 ブラウザのキャッシュを活用する-たったの5分で改善する方法!!
  4. 指をさすビジネスウーマン HTML・JavaScript・CSSを縮小するAutoptimizeの使い方と…
  5. 目を閉じるたびに思い出す PageSpeed Insightsの点数を90点以上にした5つの改善を紹介!!…
  6. ごめん、待たせちゃった・・・ deflateを使用してリソースを圧縮する方法!WordPressが劇的に高速化…
  7. イケメンにフィッシュオン! WordPress高速化のための最適なJPEG/PNG/GIF使い分けはこれだ!…
PAGE TOP