想定読者WordPressで高速化するための施策を詳しく知りたい
本記事では、上記の方を想定しています。
エコおじい執筆者：PageSpeed Insightsで32だったサイトを72までスピードアップさせた実績があります。
WordPress高速化の実績
ちなみに、当サイトは300記事程度＋画像を多用しているサイトなので、72という数値はかなり良いです。
基本的な考え方：サイト記事が多くなればなるほど表示速度は遅くなります。また、画像を使えば使うほど表示速度は遅くなります。
当サイトの歴史
- WordPressテーマJINを使って150記事達成→スピード39~45程度
- WordPress高速化を行う(具体的にはサーバーを変更しました)→スピード60~68程度まで改善
- その後、250記事達成の時に計測→32に落ちていた
- WordPressテーマをJINからSWELLに変更＋画像対応→72になる
WordPress高速化の必要性
WordPress高速化の施策を紹介する前に、なぜWordPressを高速化すべきなのかについて解説していきます。
WordPress高速化すべき理由
- 理由①直帰率・離脱率に影響が出る
- 理由②SEO対策でマイナスの影響が出る
理由①直帰率・離脱率に影響が出る
ページの表示速度が遅すぎて、イライラした経験はないでしょうか。
表示速度の遅いサイトにイライラするのはあなただけでなく、どのユーザーにも当てはまります。
Googleは公式で「表示速度のユーザーに与える影響はかなり大きい」と発言していました。
- 1秒から3秒になると離脱率が32%上昇
- 1秒から5秒になると離脱率が90%上昇
- 1秒から6秒になると離脱率が106%上昇
- 1秒から10秒になると離脱率が123%上昇
このような結果を踏まえて、当サイトが読者に提唱するのは「表示速度3秒未満のサイト作り」です。
3秒未満、もっというと1秒程度で表示されるサイトを作ることができれば、ユーザーにストレスを与えずに記事を読んで貰えます。
本記事では、1秒から3秒の間を目指すための方法を沢山紹介しています。
是非、参考にしてみてください。
理由②SEO対策でマイナスの影響が出る
注意点：ページの表示速度が早ければ早いほど評価されるというわけではないです。Googleは、ページの表示速度が遅いもののみ評価を下げると公表しています。
実際問題、評価が下げられるほど遅いサイトは少ないです。
ただ、もし該当してしまうと大変なので、そうならないように本記事通りWordPress高速化を行いましょう。
現在の表示速度を計測する
実は、WordPress高速化の施策をする必要がないのにも関わらず、WordPress高速化に時間とお金を投入してしまう方がいます。
非常に勿体無いです。
ご自身が、WordPress高速化の必要があるかどうかは『Googleページインサイト』を使用して確認しましょう。
このサイトを活用して、平均50点以上が毎回計測されるサイトに関してはWordPress高速化の必要なしです。
60点から100点にしたい気持ちは分かります。
ただ、ページの表示速度を合格している方が、リスクを取ってまでWordPress高速化をする必要性はかなり低いです。
そこに時間をかけるのであれば、コンテンツ制作をした方が良いです。
実際に、私はスコア30程度のサイトを72にした段階で、WordPressの高速化施策をストップさせました。
もし仮に、平均点50を超えている方がWordPress高速化したい場合は私が紹介している内容通りに施策をしてください。
WordPress高速化に必要な要素
WordPressの高速化に必要な要素は下記の通りです。
- サーバー→若干のリスク有り
- 画像対応→リスクなし
- ソース記述内容→リスク有り
- キャッシュ→リスク有り
ページの表示速度の点数によってやるべき施策をまとめておきましたので、ぜひ参考にしてください。
| ページの表示速度 | 50点未満 | 50~70点未満 | 70点以上 |
|---|---|---|---|
| サーバー | ◎ | ◯ | △ |
| 画像対応 | ◎ | ◎ | ◎ |
| ソース記述内容 | ◯ | × | × |
| キャッシュ | ◯ | × | × |
高速化要素前提：サーバー
WordPress高速化に必要な要素の前提はレンタルサーバーです。
格安レンタルサーバーを使っているのであれば、乗り換えるだけで表示速度はかなり速くなるはずです。
実際に、私はWordPressテーマJIN×エックスサーバーを活用していて表示速度が30ほどでしたが、コノハに乗り換えただけで60まで表示速度を上げられました。
ブログ初心者であれば、エックスサーバー。なぜなら、情報が多いから
中級者以上はコノハでいいと思います。なぜなら、情報がなくてもなんとかできるから。
後は、サーバーのPHPバージョンを最新にすることも重要です。
高速化要素①画像対応
WordPress高速化に必要な要素1つ目は『画像対応』です。
これは、ページ速度が遅い人から早い人でも絶対にやるべき施策です。
エコおじい正直、ここをしっかり対応するだけでかなり表示速度は速くなります。
高速化要素②ソース記述内容
WordPress高速化に必要な要素2つ目は『ソースの記述内容』です。
WordPressテーマはプログラムで作られています。
そのプログラムを圧縮or必要ない部分を削除することでWordPressの高速化ができます。
しかし、HTML、CSS、JavaScriptがある程度分からないとかなり厳しいです。
当サイトの見解
- 有料のWordPressテーマを使っている→必要なし
- 自作のWordPressテーマを使っている→圧縮＆不要部分の削除
最近のWordPressテーマは優秀なので、どのテーマも圧縮＋不要部分の削除がされています。
そのため、有料のワードプレステーマを活用しているのであれば、圧縮は不要です。
高速化要素③キャッシュ
WordPress高速化に必要な要素3つ目はキャッシュです。
そもそもキャッシュとは：一度、サイトを閲覧した読者が二度目スムーズにサイトを閲覧するための技術
もっと深掘りしてみましょう。
- 読者Aが当サイトのページを見る。
- 「読者Aは当サイトのページを見た」と当サイトのWebサーバーが記憶する
- 数日後、読者Aが当サイトのページを見る
- Webサーバーは読者Aを記憶しているので、スムーズにデータを渡してあげる
簡単にいうと、こんな感じです。
キャッシュをうまく使うと、2度目の訪問者のページ速度を上げることができます。
正直、キャッシュを理解するのにはご自身でプログラムを書かないと厳しいです。
そのため、キャッシュをどうにかしたい場合は業者やフリーランスに頼むか、自分で勉強して実装するようにしましょう。
【画像編】WordPress高速化
WordPress高速化施策一つ目は画像最適化です。
Webサイトは基本的にテキスト情報と画像で構成されています。
- テキスト情報→サイトの表示速度に影響ほぼ与えない
- 画像情報→サイトの表示速度にかなり影響を与える
多くのサイトが画像によって、サイトの表示速度が落ちているので、WordPressの高速化＝画像対応と考えましょう。
やるべき施策は下記の通りです。
- 画像プラグインを導入する
- 画像圧縮ツールを活用する
- 画像遅延読み込みを活用する
画像プラグインEWWW Image Optimizer
EWWW Image Optimizerでは画像圧縮＋次世代フォーマット変換の２つを行うことができます。
- 画像圧縮：約30%ほど減少
- 次世代フォーマット変換：約30%ほど減少
これをやるだけで、サイトの表示速度を10~20ほどアップさせることができます。
WordPress高速化：画像圧縮する手順
EWWW Image Optimizerで画像を圧縮する手順は下記の通りです。
- プラグインをインストール
- プラグインの初期設定
- 一括最適化をクリックする
エコおじい詳しい内容は下記の記事を参考にしてください。
画像を次世代フォーマットに変換する方法
画像を次世代フォーマットに変換するのは先ほど紹介したEWWW Image Optimizerを活用する必要があります。
画像圧縮ツールを活用
EWWW Image Optimizerでの画像圧縮では正直足りません。
基本的には、画像を圧縮する専用のツールを使用する→EWWWの手順です。
おすすめの画像圧縮ツールは下記のものです。
当サイト愛用のテール
- COMPRESS PNG
- COMPRESS JPG
画像圧縮ツールの使い方などに関しては、下記の記事を参考にしてください。
画像遅延読み込み
画像遅延読み込みとは：サイト内の画像を一度に読み込まないことでWordPress高速化を実現する技術です。
簡単にいうと、デバイス画面(スマホ、パソコン、タブレット)に画像が表示されるまで、画像を読み込まない技術です。
具体的には、Lazy Load や画像遅延ロードなどと言われています。
画像遅延読み込み技術を使用しないと、画像に表示されていない部分の画像も読み込んでしまうので、かなり表示速度が遅くなってしまいます。
注意点：以前までは、プラグインの導入or画像遅延機能を導入する選択肢しかありませんでした。
しかし、現在ではWordPressの標準機能で画像遅延読み込みが行われるようになりました。
つまり、何もせずともWordPress高速化の施策を行なっているということです。
実装されたのは2020年8月のことなので、それ以前からアップデートしていない方は、WordPressをアップデートするだけで、対応できます。
【ソース記述内容編】WordPress高速化
ソースとはプログラムのことです。
エンジニアによって書かれたプログラムを圧縮することでWordPressの高速化を行なっていきます。
- 自分の力で圧縮する→依頼しましょう。
- プラグインを導入する→簡単だがリスク有り
自分の力で圧縮する方法
自力で圧縮する際には下記のツールを活用します。
今回はcssを圧縮する際の方法をご紹介します。
ソースコードは通常下記のようになっています。
この画像は私が運営するWP専門屋のCSSコードです。その後、ソースコードの圧縮を行い下記のような画面になりました。
このように、ソースコードを圧縮するだけで、ファイルサイズを抑えることが出来るのでWordPressの高速化が実現できます。
CSSファイルを圧縮するだけで20%もカットすることができます。
プラグインを導入する
プラグインはAutoptimizeを活用します。
簡単に導入できますが、多くのWordPressテーマと相性が悪すぎるのであまりおすすめはしません。
どうしても圧縮したい方は下記の記事を参考にしてください。
【キャッシュ編】WordPress高速化
- WP Super Cache
- W3 Total Cache
これらのプラグインを導入することで、キャッシュ対応することができます。
詳しい内容は、現在記事にしていますので、少々お待ちください。
WordPress高速化の実績
当サイトでは、WordPress高速化の案件を請け負っています。
ブログ記事で紹介しているのは公開することを許してくれたクライアント様だけです。
- なねさん
なねろぐ様
なねろぐでは、ライターになりたい方に役立つ情報発信をしています。ライターの方は閲覧してみてください。
ブログにてWebライティングの依頼も請け負っているみたいなので、メディアを運営している方はご依頼してみてください。
なえろぐ様に行った施策
- 不要プラグインを削除
- 画像の圧縮
- 画像を次世代フォーマットへ変換
- Twitterを削除
- フォントの変更
- スライダー一部削除
基本に充実なWordPress高速化の施策ですが、かなり効果を発揮します。
まとめ：WordPress高速化にお悩みの方は当サイトに依頼しよう
ここまでで『【保存版】WordPress高速化のテクニック｜表示速度32から72』の解説は以上です。
エコおじい本記事は以上です。最後までご覧いただきありがとうございました。
WordPressの高速化を深く学びたい方はWordPressを勉強しよう
WordPress高速化をもっと早くしたい方は、ご自身でWordPressスキルを身につけましょう。
WordPressの独学手順を下記の記事で紹介していますので、ぜひ参考にしてみてください。
