もともとインストール時から表示速度が遅かったWordPressですが、投稿記事をたった30記事程書いたところで、さらに遅くなってしまいました。
WordPressは、使いやすい管理画面、豊富な無料テンプレートやプラグインなどで初心者でもとっつきやすく比較的簡単に扱えます。
デザインや機能を拡張するための自由度が高いため、少し勉強すれば、さらに高度なサイトが実現可能です。
しかし、あまり知識なく運用しているとサイトがどんどん遅くなっていく傾向があります。
備忘録としてWordPressの表示速度を高速化する方法を書いておきたいと思います。
目次
自分のサイトの表示速度を知る
サイト表示スピード測定:http://site-speed.podzone.net/
表示速度の改善方法を知る
Googleの提供する「PageSpeed Insights」を参考にして、Webサイトを高速化していきたいと思います。
PageSpeed Insights とは
Google Developersが提供する、Webサイトの速度測定ツールです。速度を100点満点で採点してくれます。また、表示速度を遅くしている要因を提示し、その改善方法も提案してくれます。
100点中最低でも70点以上、高評価なら85点以上は目指したいものです。
WordPressの場合はプラグインを使いすぎていたり、またアナリティクスやアドセンスも表示速度を遅くする要因となるようです。
改善できる点は一つでも多く対応しておきたいものです。
PageSpeed Insights:https://developers.google.com/speed/pagespeed/insights/
画像を最適化する
このブログのように、画像を多く使用していると容量が大きくなってしまいます。
これを毎回画像サイズを圧縮してアップするようにすると、一つひとつの投稿記事の容量を大きく削減することができます。
画像サイズを圧縮するには2つの方法があります。
(1) プラグインを導入する
(2) 画像圧縮ソフトを使う
プラグイン「EWWW Image Optimizer」の導入
WordPressに「EWWW Image Optimizer」プラグインを導入すると画像をアップロードするだけで、自動的に画像を圧縮し画像サイズを軽量化できます。また、すでにアップロードされている画像を圧縮・軽量化することも可能です。
EWWW Image Optimizer:https://ja.wordpress.org/plugins/ewww-image-optimizer/
画像を圧縮して軽量化(サイズダウン)する
画像圧縮ソフト「JPEGmini」
JPEG画像をほぼ劣化なしでファイルサイズを軽量化したいときに便利なオンラインツール
JPEGmini:http://www.jpegmini.com/
画像圧縮ソフト「TinyPNG」
PNG ファイルの最適化を行うオンラインツール 「TinyPNG」
TinyPNG:https://tinypng.com/
画像の使用枚数を減らす
サイトの表示速度を高速化するためには、画像の使用枚数を減らすことが最良の方法と言えます。
この点に関しては私も偉そうに言えないのですが、気づくとついつい画像が増えてしまいます。ビジュアル化すると見やすいばかりではなく、目にも留まりやすく、文章ばかりで説明するよりわかりやすくなります。
適度に画像を使用しながら、不要な画像はできるだけ減らすことを意識していきたいものです。
ブラウザのキャッシュを活用する
.htaccessに以下のコードを貼り付けます。
.htaccessはWordPressインストールフォルダ直下にあります。
ExpiresActive On ExpiresDefault "access plus 2 weeks" ExpiresByType image/gif "access plus 1 weeks" ExpiresByType image/png "access plus 1 weeks" ExpiresByType image/jpg "access plus 1 weeks" ExpiresByType image/jpeg "access plus 1 weeks" ExpiresByType text/html "access plus 1 seconds" ExpiresByType text/css "access plus 2 weeks" ExpiresByType text/javascript "access plus 2 weeks" ExpiresByType application/x-javascript "access plus 2 weeks"
圧縮を有効にする
最近のブラウザは、gzipやdeflateによって圧縮されたデータ(HTML、CSS、JavaScriptファイルなど)をサポートしています。「圧縮を有効にする」とサーバーからの出力をクライアントに送る前に圧縮します。クライアント側では、圧縮されたデータをブラウザで展開し、描画するので通信の負担が激減し、ページの読み込み時間が劇的に速くなるようです。
.htaccessに以下のコードを貼り付けます。
.htaccessはWordPressインストールフォルダ直下にあります。
AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE font/opentype font/ttf font/eot font/otf
プラグインを厳選する
WordPressのプラグインを使いすぎると表示速度が遅くなる原因になります。
不要なプラグインは停止し、完全にいらない場合は削除する等、なるべくプラグインを使わないようにすることが大事です。
P3 (Plugin Performance Profiler)
P3 (Plugin Performance Profiler)は、WordPressを遅くさせているプラグインを調べてくれるプラグインです。