wordpress 高速化～誰でも簡単に実施できる3つの方法

サイトの表示速度が遅くてイライラしたことはありませんか？表示速度が少し遅くなるだけで、ユーザーはサイトから離脱してしまいます。
もし、自身のサイトが遅いと感じたら高速化するのをおすすめします。ここではwordpress（ワードプレス）で構築されたサイトの高速化方法について解説していきます。誰でも簡単に実施できる内容ですので、ぜひ一度お試しください。

表示速度の重要性

そもそもサイトの表示速度はどれほど重要なものなのでしょうか。表示速度が重要と言える理由は大きく分けて2つです。

サクサクと快適に必要な情報を入手するため
SEOにおけるサイト評価を下げないため

必要な情報を入手するというのは、つまりはUX（ユーザーエクスペリエンス）の向上になります。UXとは「ユーザー体験」のことで、不満を感じることのない設計を指します。表示速度が遅いことで不満に感じ、せっかく訪れたユーザーも帰ってしまうことでしょう。

Googleは有益な情報を提供しているWEBページを上位に表示します。SEOとはその上位表示を目指すために対策を行うというもので、ユーザーにストレスなど不快感を与えてしまうため、それだけでGoogleからの評価も下がり、検索順位にも影響が出てしまうこともあります。
また、表示速度が遅いことにより直帰率の低下につながり、それもまたサイト評価を落としてしまします。

以上の2つの観点から、やはりサイトの表示速度は重要なのです。

wordpressサイトの表示速度が遅くなる3つの原因と対策

wordpressサイトの表示速度が遅くなってしまう原因は何なのでしょうか。大きな原因として考えられるのは主に3つです。ここからはその3つの原因とどうすれば改善できるか対策方法について解説していきます。

1：画像の容量

まず考えられるのは”画像の容量”です。
ユーザーがサイトにアクセスすると、そのページの情報を取得するためにサーバーにアクセスします。サーバーにある画像の容量が大きいほど、ページの表示に時間がかかってしまいます。なので、画像の容量を下げることが必要になってきます。

画像の容量を下げるには様々な方法がありますが、最も手っ取り早く簡単な方法はプラグインを使用することです。
ここでは「EWWW Image Optimizer」というプラグインをおすすめします。このプラグインは画像のサイズを自動的にリサイズしてくれて、さらに過去にアップロードした画像までリサイズしてくれます。これまでアップロードした画像を1つ1つ圧縮するのは骨の折れる作業です。しかし、このプラグインを使用すれば1発で解決できます。

あとは、アップロードする前にあらかじめ容量を圧縮するように心がけるようにしましょう。「Tiny PNG」というツールは画質は落とさずに画像の中の不要なデータを削除してくれます。これを利用して圧縮した画像をアップロードするなど、普段から気を付けると良いでしょう。
　　

2：ソースの記述方法

表示速度を低下させる原因の2つ目は”ソースの記述方法”です。
webページはテキストやCSS、JavaScriptなどの様々なソースで構成されています。このソースの記述の仕方によって、サーバの読み込み時間に影響がでてきます。
これはソースの記述を最適化することで解決できます。

Webページのソースを構成する要素は以下になります。

これらのうちcssとJavaScriptは読み込みに時間がかかるので表示速度が遅くなる原因になります。
一般的にcssとJavaScriptはまとめて記述することが多いですが、そうしてしまうとページを読み込むときにJavaScriptを先に読み込んでしまい、表示処理が止まってしまいます。
結果、表示速度が遅くなります。

なのでJavaScriptはタグの直前に配置することで処理時間のタイムラグを回避することができ、表示速度の改善につながります。
　　

3：キャッシュの最適化

最後に挙げるのは”キャッシュ”です。webページにアクセスすることで、ブラウザが再度データを取得する手間を省くために簡易的にデータをブラウザ上に保存します。これをキャッシュといいます。ページが表示されるまで時間がかかるのは、サーバへデータ取得を何度も取得しにいってるからなのです。
キャッシュを用いることで、表示速度の改善が可能です。

具体的な方法としては、これもプラグインを用いて最適化するのが一番です。「W3 Total Cache」というプラグインはページ、データベース、オブジェクト、ブラウザなどのキャッシュを残してくれます。

W3 Total Cacheの設定方法

W3 Total Cacheは説明が英語で記載があり、設定項目も多いです。また、プラグインの開発者が推奨している設定をしてもよいのですが、中には余計な項目も含まれているので、手動で以下の設定にすることを推奨します。

まずは、サイドバーから「Performance」を選択して設定画面を開いてください。ここからページ、データベース、オブジェクト、ブラウザのそれぞれのキャッシュの設定を行っていきます。

Page cache ＞ Page cache ＞ Enable →チェックをオン
Page cache ＞ Page cache method ＞ Disk:Enhanced

Minify ＞ Minify ＞ Enable →チェックをオン

Database Cache ＞ Database Cache ＞ Enable →チェックをオン
Database Cache ＞ Database Method ＞ Disk

Object Cache ＞ Object Cache ＞ Enable →チェックをオン
Object Cache ＞ Object Cache Method ＞ Disk

Browser Cache ＞ Browser Cache ＞ Enable →チェックをオン

Miscellaneous ＞ Enable Google Page Speed dashboard widget →チェックをオフ
Miscellaneous ＞ Verify rewrite rules →チェックをオン

他にも様々な項目がありますが、キャッシュを利用した表示速度の向上であれば上記の設定で十分です。

表示速度の計測方法

画像の軽量化、ソースの最適化、キャッシュの利用の3つを行うことで、サイトの表示速度が速くなったのではないでしょうか。最後に表示速度の計測方法についてご紹介します。

PageSpeed Insights

Googleが提供している「PageSpeed Insights」というツールでは、表示速度が最適化できているかの点数を測ることができます。加えて、改善点も提示してくれます。
ページを指定して計測すると、PCとSPにおけるスコアが出てきます。このスコアが高いほど、表示速度のための最適化ができているということです。

あくまで最適化できているかどうかのスコアであり、表示速度そのものではないので注意しましょう。

Test My Site

「Test My Site」もGoogleが提供しているツールです。こちらはPageSpeed Insightと異なり、実際にページが表示されるまでの秒数が計測できます。実際の秒数を計測したいときはこちらのツールを利用してみてください。
PageSpeed Insightと同じように、改善点も提案してくれます。

まとめ

wordpressを高速化するために画像の軽量化、ソースの最適化、キャッシュの利用という3つの方法を解説しました。サイトをカスタマイズしていくと、いつの間にかサイトの表示速度が低下してしまうものです。
UXの向上、SEO評価向上のためにも、ぜひここでご紹介した高速化の設定を行ってみてください。

また「どうすればいいのか分からない」「自分で作成するのは難しい」など、Webサイト制作でお悩みの方はお気軽にご相談ください。