本文へ移動
喫茶オーグ ひとり商いのWeb導線ガイド

WordPressで作る

WordPress高速化ガイド|効果順にやる7つの対策

  • 公開日:
  • 最終更新日:
  • 編集: 喫茶オーグ編集部
バリスタのリコさん

リコさん(バリスタ)

リコさんです。今日は「待たせない表示にするための順番」を、一つずつ棚に分けて見ていきましょう。

表示が遅いとき、思いつくものから手を付けると効かない対策に時間を使いがちです。効果の大きい順に並べ、一つずつ試して前後を比べる進め方にします。まずは記録を取るところからです。

作業前に速度とバックアップを記録する

改善したかどうかは、前の状態を残していないと分かりません。作業に入る前の準備を先に済ませます。

測定するページと条件をそろえる

トップページと、画像の多い記事を一つ選んで固定します。毎回違うページを測ると、比べても意味がありません。測る端末と回線もそろえます。時間帯によっても結果は動くので、同じ条件で複数回測り、真ん中あたりの値を記録します。

何を見るか

無料で使える計測ツールでは、表示速度の点数のほか、いくつかの指標が出ます。大きな画像や見出しが表示されるまでの時間、サーバーが最初の応答を返すまでの時間などです。前者が遅ければサイト側、後者が遅ければサーバー側に原因があることが多い、という切り分けに使えます。

切り戻せる状態を作る

設定を変えて表示が崩れることは珍しくありません。作業前にバックアップを取り、どこまで戻せるかを確認しておきます。あわせて、どの設定をどう変えたかをメモに残します。原因を戻すときに、この記録が効いてきます。

遅さの原因を切り分ける

対策を選ぶ前に、どこが重いのかを見ます。原因が分かれば、やるべきことは自然に絞られます。

画像とページ容量

多くのサイトで、ページの容量の大半は画像が占めます。撮影したままの写真をそのまま載せていると、表示に必要なサイズの何倍もの大きさになっていることがあります。まずここを疑うのが定石です。

テーマとプラグイン

多機能なテーマや、数の多いプラグインは、読み込むファイルを増やします。使っていない機能のために読み込みが発生していることもあります。一時的に標準のテーマへ切り替えて測ると、テーマ側の影響が見えます。

サーバーの応答

サーバーが最初の応答を返すまでが遅い場合、サイト側をいくら軽くしても限界があります。共用サーバーで混み合っている、プランが小さい、PHPのバージョンが古いといった要因が考えられます。この場合は後半の対策が効きます。

効果順に行う7つの対策

上から順に試します。上ほど効果が出やすく、下ほど手間や影響範囲が大きくなります。すべてやる必要はありません。

1. 画像を軽くする

アップロード前に、実際に表示されるサイズまで縮めます。横幅が2,000ピクセルを超える写真を、記事内で800ピクセル程度でしか表示しないなら、その差はそのまま無駄な読み込みです。あわせて圧縮をかけ、対応していれば軽い画像形式に変換します。手作業が追いつかないほど画像が多い場合に限り、自動化の手段を検討します。

2. 使っていない機能を止める

有効になっているプラグインを一覧で見直し、使っていないものを停止して削除します。使っていないテーマも削除します。「いつか使うかもしれない」で残っているものが、読み込みと更新の手間を増やしています。ここは費用も技術もかからない対策です。

3. キャッシュを整える

キャッシュは、一度作ったページを保存しておいて次から使い回す仕組みです。効果は大きい一方、設定を誤ると更新が反映されない、表示が崩れるといった症状が出ます。まずサーバー側にキャッシュ機能があるかを確認し、あればそちらを使います。サーバー側とプラグイン側を両方有効にすると競合しやすいため、どちらか一方にします。

4. 読み込む外部ファイルを減らす

Webフォント、アクセス解析、SNSの埋め込み、広告などは、それぞれ外部への通信を発生させます。数が増えるほど表示は遅くなります。使っていない埋め込みを外し、フォントは必要な種類と太さだけに絞ります。見た目への影響が出る対策なので、変更前後の見え方を確認します。

5. 画像と動画の遅延読み込みを使う

画面に表示される前の画像を、後から読み込む仕組みです。記事が長く画像が多いサイトほど効きます。WordPressや多くのテーマに標準で備わっているので、まず設定を確認します。ただし、最初に表示される部分の画像まで遅延させると、かえって遅く見えることがあります。

6. 不要なデータを整理する

記事の下書きの履歴、迷惑コメント、使っていない画像などが溜まると、動作が重くなることがあります。定期的に整理します。ただし、この作業はデータを消すため、必ずバックアップを取ってから行います。効果は環境によって差が大きく、長く運営したサイトほど効きやすい対策です。

7. 実行環境を見直す

PHPのバージョンが古いままなら、サーバーの管理画面から新しいものへ切り替えます。新しいバージョンのほうが処理が速い傾向がありますが、古いテーマやプラグインが動かなくなることがあるため、バックアップを取り、切り替え後に表示と管理画面を確認します。それでもサーバーの応答が遅い場合は、プランの見直しやサーバーの変更が選択肢になります。

対策ごとの効果とリスクの目安

どこまでやるかを決めるための整理です。効果の出方は環境によって変わるため、相対的な目安として見てください。

対策効果が出やすい条件手間崩れるリスク
1 画像を軽くする写真が多い、大きい画像を載せている
2 使っていない機能を止めるプラグインが多い
3 キャッシュを整える訪問者が多い、動的な処理が多い
4 外部ファイルを減らす埋め込みやフォントが多い
5 遅延読み込み記事が長く画像が多い
6 不要データの整理長期間運営している
7 実行環境の見直しサーバーの応答が遅い

リスクが「中」の対策は、必ず一つずつ実施して前後を確認します。まとめて変えると、崩れたときに原因が分かりません。

表示が崩れたときの戻し方

崩れること自体は失敗ではありません。戻し方を決めておけば、落ち着いて対処できます。

直前に変えた設定を元に戻すのが最初の手です。キャッシュを有効にした後なら、キャッシュを消してから確認します。プラグインを入れた後なら、そのプラグインを停止します。それで直れば原因は確定です。

複数を同時に変えてしまい、原因が分からない場合は、バックアップから戻します。戻した後、今度は一つずつ変えて確認し直します。管理画面自体に入れなくなった場合は、サーバーの管理画面からファイルを操作するか、バックアップからの復元で対応します。

サーバー側が原因のとき

サイト側をいくら軽くしても、サーバーの応答が遅ければ頭打ちになります。判断の目安を整理します。

標準のテーマに切り替え、プラグインをすべて停止した状態でも応答が遅い場合、原因はサーバー側にある可能性が高くなります。この場合、まずPHPのバージョンとプランを確認します。それでも改善しなければ、サーバーの変更を検討する段階です。ただし移転には手間と一時的な不安定さが伴うため、ほかの対策をやり切ってから判断します。

改善後の再計測

対策を終えたら、作業前と同じ条件で測り直します。ページ、端末、時間帯をそろえるのは最初と同じです。数値が改善していれば、その対策は効いたと判断できます。

数値以上に大切なのは、実際にスマートフォンで開いたときの体感です。点数を上げることではなく、読者を待たせないことが目的です。体感が変わっていなければ、原因の切り分けからやり直します。

まとめ

WordPressの高速化は、記録を取り、原因を切り分け、効果の大きい順に一つずつ試す作業でした。画像を軽くし、使っていない機能を止めるだけで十分な場合も多くあります。崩れたときの戻し方を先に決めておけば、安心して手を入れられます。

よくある質問

高速化のプラグインを入れれば速くなりますか。
効く場合もありますが、最初の一手には向きません。画像が重いことが原因なら、キャッシュのプラグインを入れても本質的には変わらないためです。まず何が遅さの原因かを切り分け、それから対策を選ぶ順番をおすすめします。また、サーバー側にキャッシュ機能がある場合、二重に有効にすると更新が反映されないなどの不具合が起きることがあります。
計測の数値はどこまで気にするべきですか。
点数を満点にすることが目的ではありません。読者が待たされていないかが本来の目的なので、実際にスマートフォンで開いて体感が改善したかを重視します。数値は前後を比べるための物差しとして使い、同じページ・同じ条件で測ることのほうが大切です。