ワードプレスが異常に遅い重い！そんな時の高速化対策・2022年版

ここではワードプレスでつくったブログが異常に重い遅い、といったときの表示速度高速化対策についてお伝えしています。

サーバー応答時間・JavaScript・CSS・過大なDOMサイズ・画像・キャッシュ期間の延長・HTMLといったように、2022年時点でよく起こる原因に対してほぼすべての高速化対策を詳しくお伝えしていますので参考にされてみてください。

熊谷ヒカル
自分ブログをモバイルで見たときに異常に重い遅い、といったことが良く起こります。これじゃモバイルユーザーが離脱しますｗ

2021年12月23日更新版

【目次】

高速化に知っておきたい事：そもそも高速化って何なのか？その仕組みを簡単に把握しておこう

ワードプレスで構築したブログが異常に遅い重い場合の高速化対策をお伝えする前に知っておきたい事は、ブログが表示されるための基本的な仕組みです。

インターネットサイトがさまざまなディバイス（モバイルやパソコンなど）で表示されるまでには、①ブラウザ、②サーバー、③データベースの３つを経て表示されています。

WEBが閲覧される時の仕組み

  • ブラウザ
    ↓↑ファイルを指定・提示
  • サーバー
    ↓↑ワードプレスプログラムがデータベースを探す・提示
  • データベース

３つのプロセスの中でサイト表示を遅くさせる原因があるとブログの表示に時間がかかり「ユーザーに相手にされないブログになる」のです。

2022年版・ワードプレスが異常に遅い重い！高速化するための方法

ここでは初心者～中級向けに、失敗しない効果を実感しやすい高速化の方法をお伝えして行きますので参考にしてください。

どういった点が異常に遅い重い表示速度の原因になっているかはワードプレスで構築したブログの人それぞれの運用状況によってかなり異なると思いますが、比較的効果が高い方法から順にお伝えして行きます。

一つの方法を試したらページの表示速度を確認し、どれだけ効果があったかを次でお伝えするページスピードインサイトでスコア確認するようにするのがおすすめです。

ブログの表示速度をチェックして改善の糸口を掴む

まずはブログの表示速度を検索エンジン最大大手グーグルが提供するページスピードインサイトで、モバイルとパソコンの両方のスコアをチェックします。

大方はモバイルのスコアが低く、パソコンのスコアはまあまあといったケースがほとんどなのではないでしょうか。

 

ページスピードインサイトでのブログの表示速度は以下を目指して高速化対策を行っていくのがおすすめです。

  • モバイル：80～85
  • パソコン：90以上

ページスピードインサイトでモバイルのスコアが出たら、そのすぐ下に表示される「改善できる項目」を確認します。あなたのワードプレスブログの場合はどの項目を指摘されていたでしょうか？

「改善できる項目」の中で一番改善すべき点は？

ページスピードインサイトの「改善できる項目」の指摘で、一番表示速度が遅くなっている要因は何か？

【例①：サーバーの応答時間が遅い原因となっている場合】

【例②：次世代フォーマット以外での画像配信が遅い原因になっている場合】

上の２点の他、ワードプレスブログの表示が異常に遅くなっている原因として考えられる以下の場合について一つ一つ対策をお伝えします。

  • レンダリングをブロックしているリソース
  • 画像が遅延読み込みされていない
  • CSS が縮小されていない・使用されていないものが削減されていない
  • JavaScript が縮小されていない・使用されていないものが削減されていない
  • htmlが縮小されていない
  • 第三者コードによる影響
  • 過大なDOMサイズ
  • キャッシュ期間の延長
  • フォント読み込み

ワードプレスブログの高速化対策の実質は表示速度のスコアを一つ一つ参考にして徹底的に遅い重い原因を潰すだけです。

サーバーの応答時間への高速化対策

ページスピードインサイトでサーバーの応答時間について改善できる項目では、「テーマ・プラグイン・サーバーの見直しをおすすめする」といったように詳細が説明されています。

これらは具体的にはどういった高速化対策をすればいいのか？を見ていきましょう。

ワードプレステーマのバージョンアップ

ワードプレスのテーマとは「外観＞テーマ」で確認できます。

無料のワードプレステーマを使っている場合は、最新バージョンになっているかを確認します。

もしそのテーマの開発者が１年以上バージョンアップしていないようであれば残念ながらあまりいいテーマとは言えませんので、この機会に変更されることをおすすめします。

優料のワードプレステーマを使っている場合で購入から２年以上たっている場合は、新しいテーマに変更したり、バージョンアップが提供されているのであれば最新版にしておきましょう。

メモ

ワードプレステーマは、ブログをきれいに的確に表示させるための土台のような役割をしています。動きの激しいインターネット技術に見合うようブログの表示をする必要もあります。この意味で土台がダメだったらほかにいくら高速化対策を行ってもあまり効果は得られませんので、思い切って見直しをしたりバージョンアップを行うようにしてみてください。

また、ワードプレス自体のバージョンも最新版に更新できているかをチェックしておきましょう。

プラグインの見直し

ワードプレスを運用しているとついプラグインを増やしてしまいがちですが、あまりに多く増やし過ぎると干渉してブログの表示速度にかなり影響を与えます。

以下を意識してプラグインの見直しをしてみましょう。

  • 必要最低限のプラグインだけ残す
  • プラグインの機能を他の方法で代用できないかを検討する
  • 複数のプラグイン同士で重複している機能があれば、片方のプラグインに集約して片方を削除する

特にサーバーの応答時間を長くしてしまう原因として見落としがちなポイントを具体的にご紹介しておきます。

プラグインの見直しチェックリスト

複数のプラグインの機能について、以下の機能が重複しているのであれば、ページスピードインサイトで１つ１つスコアを確認・比較しながら見直し・プラグインの取捨選択を検討します。

  • サーバーの応答時間
  • レンダリングをブロックしているリソース
  • JavaScriptの縮小・使用されていないものの削減
  • CSS の縮小・使用されていないものの削減
  • 次世代フォーマットでの画像配信
  • 画像の遅延読み込み
  • htmlの縮小
  • フォント読み込み

また最近のワードプレステーマ自体に上の機能が搭載されているケースも多いので、重複項目をチェック・スコアを確認しながら高速化の方法を集約できないかを検討してみましょう。

↑こちらはアフィンガー６の高速化メニュー

他はJetPackを使っている方もご注意。パフォーマンスの機能で「画像の最適化によるページ読み込み高速化・画像の遅延読み込みの機能」が搭載されており、デフォルトではこの機能がONになっています。他の高速化プラグインで同様の機能はないかをチェックしてプラグインの取捨選択をしましょう。

意外なところに機能の重複が存在している場合がありますので、インストールしているプラグインは全て改めて機能の確認を行うとよいでしょう。

また、おすすめできないプラグインの例も挙げておきますので参考にされてみてください。

このプラグインおすすめできない

  • WP fastest cache：必要な機能が１つのプラグインに集約しているのでお役立ちに思えるが、実は干渉しやすい
  • W3total cache：ダウンロード数が多いが、ワードプレスブログが真っ白になってしまうなどエラー報告率もかなり多い。

サーバーのグレードアップ

レンタルサーバーを契約してワードプレスブログを運営している人がほとんどかと思います。

まずはそのレンタルサーバーのアカウントにログインして、現在どのくらいの容量を使用しているかを確認してみましょう。

空き容量があまりに少ないのであれば、サーバーのグレードアップを検討します。

熊谷ヒカル
サーバーもケチると結局ページ表示で損します。ブログの情報が水だとしたらサーバーは水道管に例えられることが多く、水道管があまりに細いと水も少しづつしか流れません。ブログの表示も全く同じ、容量が小さければのんびり表示されます。

他には「サーバーの空き容量が十分あるにも関わらず、レンタルサーバーが原因で表示速度が遅い」といったケースもあることは知っておいて損はないでしょう。

実はレンタルサーバーはお隣の使用状況でブログの表示速度が遅くなる場合もあって、これはマンションやアパートのお隣さんの迷惑行為と同じように「自分が退去するのが一番手っ取り早い問題解決」になるパターンと似ています。※迷惑行為の主は迷惑だと思っていないから

熊谷ヒカル
私は以前さくらインターネットでレンタルサーバーを契約していた時に、そのような経験があります。エックスサーバーに変更したことによりブログの表示速度が驚くほど改善されました。

ほかレンタルサーバーにおいて、クリック操作で高速化対策ができる方法を３つお伝えしておきますので参考にされてみてください。

①ブラウザキャッシュをONにする

 

jpgやPNGなどの画像ファイル・CSS・Java Scriptなどの静的ファイルについてブラウザキャッシュを有効にすると、ブログに再訪問したユーザーのページの読み込み速度の助けになります。

これはユーザーのブラウザに静的ファイルを保存させることを意味し、再訪問したときの読み込み速度が向上するといった効果が生まれるのです。

②サーバーキャッシュの有効化

サーバーキャッシュの有効化はブログ運営者のサーバーにブログの情報を保存しておくことで、ユーザーの表示速度の向上の助けになります。

Lolipop

サーバーキャッシュを有効化していなければ、ユーザーは閲覧のたびにデータベースサーバーにブログの情報を読み取りに行かなければならなくなり、表示速度の遅延につながります。

③PHPのバージョンを最新にする

 

WEBの仕組みは日々開発やアップデートが行なわれています。その開発でよく登場するPHPについては、上述したデーターベースと関りが高く、ウエブのパフォーマンスや不具合にも対応します。

レンタルサーバーのPHPバージョンを最新版にしておけば、WEBの最新の仕組みに対応することに繋がります。

熊谷ヒカル
レンタルサーバーのPHPバージョンは「推奨」というように表示されたものを選ぶようにしてください。

JavaScriptで高速化対策

JavaScriptが原因となって異常に遅い重いワードプレスブログになるのはかなりの頻度になっています。

ここではレンダリングをブロックしているファイルの削除、ファイルの縮小圧縮・結合・使用されていないものを削減する方法をお伝えします。

レンダリングをブロックしているJavaScriptの削除

モバイルのページ表示速度でよく問題になる「レンダリングをブロックしているリソース」で挙げられるのはJava Sprictファイルです。

ファーストビュー(モバイルの場合はブログを開いて初めに表示される範囲)ではこの部分だけが早く表示されたら満足を得られるので、ブログの最後のパート部分は遅延読み込みをするように改善項目を指摘されていることが多いです。

確かにファーストビューで最後のパートまで読み込みされなくていい
これを改善するのがレンダリングブロックしているリソースの削除

つまり「モバイルでブログを開いたとたんに、ブログの最後の方まで正しくきれいに表示させるためにJava scriptファイルを同期しながら読み込みんで表示が遅れているようだったら、後の方は遅延読み込みで改善してください。」と言った意味の指摘です。

これについてはプラグインを活用するのがおすすめ。その候補としていくつかワードプレスプラグインの例を挙げておきますので参考にされてみてください。

レンダリングをブロックしているリソースへの対策・プラグイン候補

  • lazy load
  • fast velocity minify

注意

「レンダリングをブロックしているJSファイルを遅延読み込みする」といった項目にチェックを付けて対策をさせるタイプのプラグインは実際にあります。このようなプラグインを活用して高速化の効果が得られたらそれで構いません。

しかし、このチェックを入れて対策をするプラグインだけだと高速化の効果実感が得られないのが今どきの遅い表示の特徴とも言えます。

このタイプのプラグインを使っている限り、何度ページスピードインサイトで表示速度スコアを確認しても虚しいほどほとんど変わらない場合も多いのです。

その場合は以下でお伝えするように「JSファイルを指定」するタイプのプラグインを使用してみてください。

ここではワードプレスプラグインfast velocity minifyを例にしてレンダリングをブロックしているリソースへの具体的対策の詳細をお伝えしてみましょう。

ページスピードインサイトで指摘される「レンダリングをブロックしているリソース」で、まずはJavaScriptファイルを探します。指摘されているファイルにマウスを合わせると、以下のようにJSファイル名が出てくるので、「/○○.js」の部分だけをコピーします。

 

これをfast velocity minifyの「設定（setting）/レンダリングをブロックしているJsファイル」の部分にペーストして保存します。

レンダリングをブロックしているファイルを指定できるプラグインは、「表示が遅い原因になっているファイルを指定できる」といった点でとても効果を実感しやすいです。

他の遅延読み込みプラグインを使っている人で、遅延読み込みしたいJSファイルを指定できる設定があれば同じように行ってみてください。

熊谷ヒカル
JSファイル名を指定する高速化対策はぱっと見難しそうに思えますが、そうでもありません。やらないのと比較して得られる効果がずば抜けて高いので、まずはお試しになってみてください。

JavaScriptの縮小圧縮・結合・使用されていないものを削減

さらにJavaScriptファイルについては以下のように対策を行うと効果が得られ、ブログの表示速度が向上します。

  • JavaScriptのファイルを圧縮して縮小すればサーバーに負担がかからない
  • 複数のJavaScriptを結合して一つにまとめるとリクエストが減る

こちらについても、具体的にはワードプレスプラグインを活用して対策するのがおすすめです。

JSファイルの圧縮と結合対策ができるWPプラグイン候補

  • Autoptimize
  • Fast velocity minify

 

以下はワードプレスプラグインfast velocity minifyのJSファイルの圧縮（JS Processing）とJSファイルの結合（Combine JS Processing）の項目にチェックマークを入れて保存を押しただけの対策です。

お好みプラグインでJSファイルの圧縮と結合についての対策を行ってみてください。

CSSで高速化対策

ブログが異常に重い遅いときに使用していないCSSをファーストビューの段階で読み込もうとする点が原因になっていることもかなり多いです。

これについて、ページスピードインサイトのようなブログの表示速度判定では「ブログを表示させた初っ端から、ブログ記事の最後のパートまできれいに表示（これがCSS）させようとしなくてもファーストビューでは問題ないので、後の方は遅延読み込みせよ」といった指摘をされます。

こちらについては、ブログ初心者でも取り組みやすいものから、中級の方に向けて高速化対策を３つお伝えして行きます。

①CSS遅延読み込み系プラグインを使用

簡単にCSSの遅延読み込みで高速化対策できるのはやはりプラグインです。

CSS遅延読み込み系のプラグイン候補

  • Autoptimize
  • fast velocity minify

Autoptimizeでは下のようにチェックマークを入れて保存を押すだけの遅延読み込み系プラグインになっています。（ファーストビューでは主要なCSSだけを読み込んで、そのあとは自動的に遅延読み込みする）

こうしたCSSの遅延読み込み系プラグインにチェックを入れるだけで遅いブログの高速化対策に効果的な場合もありますので、まずは簡単な方法からおためしになってみてはいかがでしょうか。

②ワードプレスカスタムフィールドの活用

プラグインでSimple Custom CSSのようなプラグインをインストールしている場合は利用の見直しをするのをおすすめします。理由は、個々の記事で必要のないCSSまでファーストビューで読み込みが行なわれる仕様のプラグインだからです。

おすすめとしては、ワードプレスの機能にデフォルトで入っている「カスタムフィールドで記事ごとにCSSを指定する」といった方法です。

カスタムフィールドはワードプレスの記事管理画面の右上に表示される「表示オプション」のタブをクリック、そこからカスタムフィールドの項目を探してチェックマークを入れましょう。

ブログ記事の管理画面で最下部あたりに以下のようなカスタムフィールドがあります。名前には「CSS」とでも名付け、「値」にその記事で必要な個別のCSSを指定するだけです。

このような対策を行うことで、「そのCSSを使っていない他の記事」が閲覧されたときに、無関係なCSSコードがファーストビューで無意味に読み込まれることはなくなります。

③使用していないCSSを指定して削減

最後の使用していないCSSの遅延読み込みに対する高速化対策は、CSSファイル名の指定をする名指し対策。まずは使用していないCSSファイルを特定するために、PurifyCSS Onlineというサイトで確認します。

URLの枠にブログの該当URLを入力し、「clean up CSS」のボタンを押してみましょう。

すると、使用していないCSSファイルと、「Unused＝不使用な率」が表示されます。下の例の場合は使われていない率がかなり高いです。

熊谷ヒカル
100％近く使われていない「textstle.css」については、ほぼ不要なファイル。これを個別のブログ記事のファーストビューで読み込みするのはさすがに無意味でした。

使用していないCSSファイルを指定できるWPプラグイン候補

  • Fast velocity minify

使っていないCSSファイルは、CSSを削除する機能が付いたプラグインがあればそこにファイル名をペーストします。

「○○.css」といったようにドットの前の文字列を含めてコピペすればいいでしょう。

④関連記事の表示の見直し

以下は、「プラグインJetPackのトラフィック機能が表示する関連記事（上段）」と「ワードプレステーマが表示している関連記事（下段）」の模様です。※ワードプレステーマとプラグインの２つを使って関連記事の表示をしている

実はこういったパターンもブログの表示を遅らせる原因となり、高速化対策として検討する余地があるのです。

多くの場合関連記事はワードプレスブログ記事の最後に表示されていますが、ブログを開いた初っ端から「最下部の２重表示の関連記事を読み込むのはやりすぎなのではないか？」と思われる場合は、使用中のプラグインの設定自体を見直されてみてください。

以下は多くのワードプレスユーザーが使うJetpackの機能「トラフィック<関連記事」の設定の模様で、これがONになっていると上述の二重の関連記事が表示されるようになってしまいます。

ごく最近のワードプレステーマやプラグインは小回りの利いた機能を搭載しているものが多いですが、機能を使い過ぎるとブログの表示速度に影響を与えるので、知らずに放置していると失客しかねないことになります。

⑤カテゴリを非表示できる部分はないかを検討

ワードプレスブログでは、左右に関連記事や最新記事などを表示している人が多いはずです。この関連記事の表示でカテゴリが表示されている場合、特にモバイルでのブログの表示速度の遅延につながります。

 

モバイルでワードプレスブログを表示するとき、関連記事はせいぜいブログ記事の最後に表示されますが、上述してきたように何も高速化対策を講じなければファーストビューから関連記事のカテゴリを表示させるためにCSSを読み込もうとします。

関連記事や最新記事の表示に、カテゴリ表示が必要か？を検討するとき、表示したときと非表示の場合のページスピードスコアを参考にして、表示の有無を検討するといいのではないでしょうか。

以下は有料ワードプレステーマアフィンガー６のカテゴリ表示設定です。あなたが使っているワードプレステーマにもこうした設定がないかを探して、まずはスコアをチェックして取捨選択をされるのをおすすめします。

 

⑥ほかプラグインのチェックボックスでCSSを削除する高速化対策

ワードプレスプラグインには、以下のように小回りの利いたCSSを削除する高速化対策機能を搭載しているものがあります。

  • Print CSS（ブラウザを印刷するときだけ稼働するCSS）の削除
  • フォントやアイコンの見栄えを向上させるためのCSSの結合

フォントに関してはブログが遅く重くなる原因として指摘されることが多いですが、「特殊なフォントを使ってブログの表示が遅くなるメリットそのもの」について考える方が無難な気もします。

最近のワードプレステーマには、以下のようにフォントについての設定メニューがあるタイプがありますが、おすすめは「余計に特殊なフォントを使わない」です。

↑こちらはAffinger6のフォント設定、特殊なフォントは極限に使っていない設定です。

過大なDOMサイズを見直す

ワードプレスブログが異常に遅い重い状態になっている原因として、ここ数年顕著になりつつあるのが過大なDOMサイズ。

これはページスピードインサイトでチェックして1500件を超える値だったら、かなり負荷がかかっている状態だと思って間違いありません。

過大なDOMサイズの原因となるのは以下のような「外部ファイルの埋め込み」です。

  • 動画の貼り付け
  • SNSのシェアボタン
  • SNSのタイムライン表示

ごく最近のワードプレスサイトでは当たり前すぎるくらいこれらが登場するので、表示速度を重く遅くさせる原因になっているとなると驚く方も少なくないのではないでしょうか。

過大なDOMサイズを回避・ブログの表示速度高速化対策としては以下の方法をおすすめします。

  • 動画の貼り付けは不可欠か？を検討する
  • SNSのシェアボタンは必要か？を検討する

SNSのシェアボタンについては、使用中のワードプレステーマの設定を探してみましょう。使用状況から、SNSシェアボタンが使われている形跡が極限に少ないのであれば、当面は機能をOFFにして様子見するのもいいでしょう。

以下はSNSの共有ボタンの非表示を徹底している設定です。この場合は、表示速度を最優先しているまで。個々SNSの使用状況でこの共有機能を残すかどうかを判断されてみてください。

ちなみに、前述しているJetpackにもSNSの共有機能が付いていますので、お使いの方はご確認されてみてください。

画像で高速化対策

ワードプレスブログが異常に遅く重い原因として、画像について課題となるケースも多々あります。

ここでは「適切な画像サイズにする」「次世代フォーマットでの画像配信」といった２点から高速化対策をお伝えします。

適切な画像サイズにする

ワードプレスで一年もブログを運営していれば、メディアには画像が膨大になっているはずです。

フリー画像サイトなどから画像をダウンロードしてワードプレスにそのままアップロードしていると、割と大きな画像サイズがそのままブログに貼り付けられることになり、特にモバイルの場合閲覧の際に読み込み時間を要してしまいます。

これについては以下のようなワードプレスプラグインで画像の圧縮を行います。

画像サイズの最適化ができるWPプラグイン候補

  • EWWW image optimizer
  • Compress JPEG & PNG images

ここでは便利で小回りな機能も付いたEWWW image optimizerを例にしてみましょう。

このワードプレスプラグインでは、ボタンクリックだけでメディアライブラリにある画像サイズが一括最適化されます。

放置しても最適化を進行してくれるので、メディアライブラリの画像が多い場合はその間に別のタブを開いて別な作業をしていてもＯＫです。

次世代フォーマットでの画像配信

 

 

2022年現在で、最適な画像の配信方法はほぼWebPになりつつあります。WebPは画像の圧縮率が高く、ブログの表示速度を早くするだけでなく、通信データ消費量も抑えることができるのです。

もし、ワードプレスブログでWebPの導入が済んでいない場合はさっそく取り掛かってみましょう。

これにはいくつかの方法がありますが、誰でもできる方法として前述したワードプレスプラグインEWWW image optimizerでの対策をご紹介します。

まずはEWWW image optimizerの「設定<WebP変換」で次世代の形式に変換します、にチェックを入れます。

 

次にそのすぐ下にある「WebP delivery method」の設定を行っていきましょう。

ここには.htaccessに貼り付けるコードが書かれています。

EWWW image Optimizer使用時の注意①

注意していただきたいのは、「リライトルールを挿入する」というボタンをクリックしないことです。

コードは.htaccessの上部に記述したいところなのですが、そのボタンを押してしまえば.htaccessの下部にコードが記述されてしまうからです。

より適切なコードの記述方法は以下の通りです。

まずは契約中のレンタルサーバーで.htaccessを選択し、.httaccessファイルを開いた状態にします。

そしてさきほどのEWWW image optimizerに書かれていたコードをコピー、.httaccessファイルの上部にコードをペーストして保存します。

コードの右下に表示されていた「赤の四角いPNG」の表示が、下のように「緑の四角いWEBP」に変わっていたら正常に反映されている目印となりますので確認されてください。

EWWW image Optimizer使用時の注意②

.httaccessはコードの取り扱い一文字でも誤ると、ブログが正常に表示されなくなるなどのリスクが高いファイルではありますので、この作業を行う前にワードプレスブログのバックアップは念押しで取っておくようにしておいてください。

なお、ご紹介したワードプレスプラグインEWWW image optimizerは、下記のように画像の遅延読み込み機能もあります。これはなかなかパフォーマンスが良かったのでおすすめです。

キャッシュの時間を長くする

ワードプレスブログが異常に遅く重いときに、キャッシュの期間が原因になっている場合も少なくありません。

キャッシュの有効期間を新設したり、今よりも長くすると、ブログに再訪問してきたユーザーの表示速度の高速化対策になります。

契約中のレンタルサーバーで.httaccessを開き、その最上部に以下のような画像（jpg・png・gif）・java Script・CSSといったファイルをキャッシュの期間を長くするためのコードを追加して保存しましょう。

<ifModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access plus 7 days"
ExpiresByType image/bmp "access plus 21 days"
ExpiresByType image/gif "access plus 21 days"
ExpiresByType image/jpg "access plus 14 days"
ExpiresByType image/jpeg "access plus 14 days"
ExpiresByType image/png "access plus 14 days"
ExpiresByType text/js "access plus 10 days"
ExpiresByType text/javascript "access plus 10 days"
ExpiresByType text/x-javascript "access plus 10 days"
ExpiresByType application/javascript "access plus 10 days"
ExpiresByType application/x-javascript "access plus 10 days"
</ifModule>

なお、上のコードは画像（jpg・png・gif）・java Script・CSSといったファイルをキャッシュの期間を長くするためのコードの一例となっており、「期間の変更」については下記を参考に各自自己責任で行ってください。

キャッシュの期間を長くするためのコードの一例

【jpg画像の期間を21日にする場合】
image/jpg "access plus 21 days"

【gif画像の期間を1ヶ月にする場合】
gif "access plus 1 month"

.htaccessファイル使用時の注意

.httaccessはコードは一文字でも誤ると、ブログが正常に表示されなくなるなどのリスクが高いファイルです。この作業を行う前もワードプレスブログのバックアップは念押しで取っておくようにしておいてください。

HTMLへの対策

HTMLが原因でワードプレスブログの表示速度を異常に遅い重い状態になる場合、以下４つが挙げられます。

  • htmlの圧縮
  • htmlコメント削除
  • ヘッダークリーンナップ
  • 絵文字削除

HTMLがワードプレスブログの表示速度を以上に遅く重い原因にしているウエイトはそれほど大きくはないですが、簡単にできるものでプラグインによる高速化対策をご紹介しておきます。

 

HTMLへの高速化対策ができるWPプラグイン候補

  • Autoptimize
  • Fast velocity minify

Autoptimizeでは、以下のように「HTMLコードを最適化」して高速化対策を行えるオプションがあります。

fast velocity minifyでは「HTMLの圧縮・HTMLコメントの除去・ヘッダーのクリーンナップ・絵文字の削除」がボタンクリック操作で高速化対策ができます。

重い遅いブログだったのにモバイルスコアが100に

このワードプレスブログの場合、上のような高速化対策を行ってモバイルのスコアは１００のパフォーマンスになりました。

100になるまで高速化対策をする必要はありませが、85くらいを目指せば合格くらいの気持ちで取り組みされるのがおすすめです。

注意！表示読度を挙げるべく躍起になった結果、モバイルで画像が表示されないケースがある

モバイルの表示速度が上がって喜んでいたのも束の間…ブログをモバイルで見ていたら画像が表示されない、というケースも無きにしもあらずです。

悔しいですが、これも調整すべきです。

表示速度を調整すべくいろいろと高速化対策を行ってモバイルで画像が表示されなくなる原因は以下の通り、可能性の高い順に挙げています。

 

高速化対策を実施してモバイルで画像が表示されなくなった時に考えられる原因

  1. 画像の読み込みに関するプラグイン同士の干渉
  2. PHPのバージョンを「最新の推奨版」にしておく
  3. ワードプレスのバージョン自体を最新版にする

２と３はワンクリックほどのマウス操作で済むので解説は割愛するとして、問題は画像の読み込み系プラグイン同士の干渉です。

それぞれインストールしている画像の読み込み系プラグインが異なると思いますので、「１つ１つのプラグインを無効化し、モバイルで画像が正常に表示されているかを確認する」といった作業を行う必要があります。

私もやむなくEWWW image optimizermを無効化したところ表示速度は下がってしまったのですが、画像が見えないよりはましだと思うようにしました。代わりにJetPackの画像読み込みアクセラレーター機能をＯＮにしたところ、85にはなったのでこのくらいで容赦しようと思いました。ＥＷＷＷ image optimizerの画像読み込み系機能が相当良くなかったようです。

 

高速化対策ではこうした妥協も必要かなと思っています。

 

高速化の効果を感じられなかった方法

高速化の効果を感じられなかった方法もあります。

不要なリビジョンの削除

ワードプレスでサイトを構築していると、自動的にリビジョンが生成されます。

実はこの自動リビジョンがウエブサイトの高速化を妨げる原因になるといわれているのです。

そこでリビジョン削除プラグインとして知られる「WP-Optimize - Clean, Compress, Cache」を試してみたところ、幣サイトの場合結果的にページスピードインサイトでのスコアは変わりませんでした。

 

「自動リビジョンを削除する機能」の設定は以下の通り。

高速化の効果がなかったプラグイン

最後におすすめできないプラグインの例も挙げておきますので参考にされてみてください。

このプラグインおすすめできない

  • WP fastest cache：必要な機能が１つのプラグインに集約しているのでお役立ちに思えるが、実は干渉しやすい
  • W3total cache：ダウンロード数が多いが、ワードプレスブログが真っ白になってしまうなどエラー報告率もかなり多い。

まとめ：ウエブサイトの高速化は、試してみるまで結果はわからない

とどのつまりウエブサイトそれぞれなので、どんな高速化の方法が効果を発揮するかはわかりません。

あるウエブサイトで「この高速化の方法は効果があった」と伝えられていても、ワードプレスブログの使用状況は個々異なるのでその方法が当てはまるかどうかはわかりません。

ワードプレスブログの高速化はレーシングカー同様「速く走りたいなら重たいものを削る」のは鉄則ですが、運用しているうちにいつのまに重い状態になってしまうのはよくあるお話です。

ページスピードインサイトの改善点のアドバイスなどを参考にして定期的に確認・メンテナンスしてみてくださいね(*^-^*)

お問合せ

*は必須項目です *お名前またはニックネーム *メールアドレス (確認用) *お問合せ(文字数制限なし) Powered by FormMailer.

ただし、法令違反・公序良俗に抵触するご質問には一切お応えしません。