自分のブログの表示速度が遅い!簡単にできる対策5つ!備忘録

暮らし

最近、「自分のブログの表示速度が遅い」とか「重いな」と感じた事はありませんか?

管理画面から「サイトを開く時も重いし、ブログを開くのも重い」・・・これだとSEO(検索エンジン最適化)的にも良くないようですね。

今までブログの表示速度の事は初期設定以降、スルーしてしまっていたのですが、今回検索順位が落ちた事やアクセス数が減った事に深刻だとやっと気づき、ようやく真面目に取り組む事にしました。

しかし見慣れないプラグインなどを使うリスクを避けるため、まずはできそうな事から始めています。

*(検索順位が落ちた理由は、他にも記事更新してないなど色々ありますが、今回は表示速度を改善します)

  • ブログはWordPress
  • テーマはcocoon
  • サーバーはmix host

(アイキャッチ画像出典: https://www.pexels.com/ja-jp/photo/3987012/

スポンサーリンク
  1. 表示速度が遅いデメリット
    1. 読者が何も読まずに離脱してしまう
    2. SEO(検索エンジン最適化)に影響
  2. 本当に表示速度が遅か確かめる
    1. 【PageSpeed Insights】で確かめる
    2. アクセスして自分のブログのURLを貼りつけるだけ
    3. スコアは何点が理想?
    4. 改善方法も提供してくれる
  3. 表示速度を落とす3大要素
  4. ①PHPの更新
    1. PHPの更新の手順
    2. サーバーのマイページにログインして【cPanel】開く
    3. 【ソフトウェア】→【Multi PHP マネージャー】を開く
    4. バージョンを新しいのに変更する
  5. ②アクセスの少ない記事のアドセンス広告を停止
    1. cocoonは広告を除外するにチェックを入れるだけ
    2. 投稿画面から歯車マークを開き、広告を除外するにチェックを入れる
  6. ③いらない画像を削除する
  7. ④AMP問題を解決する
    1. AMP対応は慎重に
    2. サーチコンソールのエラーメッセージ
    3. 参照にしているAMP URLはAMPではありません
    4. AMPを生成しないにチェックを入れる
    5. AMPのURL変更後は、リダイレクトする
  8. ⑤いらないプラグインを削除する
  9. もう一度速度を測る
  10. 一番は良質な記事を書く事!
  11. 画像圧縮プラグイン【EWWW Image Optimizer】失敗談
    1. すぐプラグインを停止、削除
    2. 元に戻った
  12. 余談:表示速度が遅くなった原因のひとつにサイドバーに人気記事のウィジェットを追加した
  13. 自分のブログの表示速度が遅い!簡単にできる対策5つ!備忘録まとめ

表示速度が遅いデメリット

https://www.pexels.com/ja-jp/photo/262508/

WordPressは非常に便利な反面、使っていくにつれ、どうしても重たくなってしまうと言われています。

そして、webサイトの表示速度が遅くなると様々なデメリットが起きやすくなります。

読者が何も読まずに離脱してしまう

webサイトの表示速度が遅いと、ユーザーの直帰率(サイトを訪れた読者が何も読まずに離脱する)が高くなる事が分かっています。

探したい情報がある時に開いたサイトがなかなか表示されなかったり、重たかったりすると、離脱してつい他のサイトを探しに行ってしまいたくなりますよね。

SEO(検索エンジン最適化)に影響

Googleは明確にサイト速度を高速化する事を求めています。

ページ表示速度の速さは、検索エンジンで評価される重要な指標になっており、その結果SEO(検索エンジン最適化)にも影響があると考えられているのです。

スポンサーリンク

本当に表示速度が遅か確かめる

まずは本当に自分のブログの表示速度が遅いのかを確かめるのに、無料で使えるツール【PageSpeed Insights】を紹介します。

【PageSpeed Insights】で確かめる

PageSpeed Insights

Googleが提供する【PageSpeed Insights】は、webサイトの読み込み速度をチェックして、スコアで表示してくれる無料ツールです。

アクセスして自分のブログのURLを貼りつけるだけ

使い方は簡単です。上のURLにアクセスして、自分のブログのURLを貼りつければ、デスクトップ版とモバイル版のスコアを見る事ができます。

スコアは何点が理想?

スコアが60点以下になると背景が真っ赤になります。デスクトップ版で90、モバイル版は85が理想と言われています。

しかし実現するのは中々難しいので、まずは70前後を目指すようにしましょう。

しかし中にはスコアは海外で測定されるので、日本のwebサイトはスコアが低くなりやすく、まずはモバイル版で40を目指せば良いという意見もあります。

そして、私のブログはモバイル版が32でした。スコアヤバイ・・・。ほぼアウトですね。

改善方法も提供してくれる

スコア点数画面の下にスクロールしていくと、有難い事に表示速度を上げるための様々な改善方法が提案されています。

赤字で提案されているものほど、最優先の改善案です。

しかし速度表示を遅くしている要因は様々あるため、自分で突き止めて改善するしかありません。

スポンサーリンク

表示速度を落とす3大要素

速度表示を落とす3大要素として、

  • 画像の読み込み
  • ソースの記述内容
  • キャッシュ

が挙げられています。

WordPressが重くなる原因に画像が大きい、重いという問題があります。

それを解決するのに便利なプラグイン【EWWW Image Optimizer】は、画像をほぼ劣化させずにアップ時に自動で圧縮してくれたり、過去にアップした画像も一括で圧縮してくれます。

EWWW Image Optimizer
より小さな画像、より速いサイト、より幸せな訪問者。ロケット工学の学位を必要としない、包括的な画像最適化です。

①PHPの更新

まず、WordPressを開設後ずっと放置していたPHPの更新をする事にしました。

WordPressの管理画面を開く度に「PHPが古いバージョンです。」と表示されていて、実はこれも長い間放置していた問題です。

PHPを更新する理由として、脆弱性の影響を受けないようにアップグレードし、スピードも向上させるようにするためです。

PHPの更新の手順

手順については、WordPressが自動で更新してくれるのとは違い、自分でサーバーにアクセスして更新します。

PHPを更新する際に、エラーが出る可能性があるので、あらかじめバックアップを取っていた方が安心です

サーバーのマイページにログインして【cPanel】開く

こちらはmix hostのサーバーにログインして、iPhoneから操作した画像になります。

【ソフトウェア】→【Multi PHP マネージャー】を開く

バージョンを新しいのに変更する

自分で選んだのを確認して【適用】をクリック。

(現時点ではバージョン7.4まで可能でした)

【成功〜選択したドメインに正常に適用されました】と出ればOK。

WordPressの管理画面に戻りPHPの更新のお知らせが消えていれば更新完了です。

②アクセスの少ない記事のアドセンス広告を停止

アクセスの少ない記事のアドセンス広告を停止します。

記事数自体も少ないですが、アクセスの多い記事とそうでない記事は一目瞭然ですよね。

アドセンス広告やアフィリエイトのバナーを減らす事で、結果的にユーザビリティが向上する可能性があります。

cocoonは広告を除外するにチェックを入れるだけ

Cocoon
SEO・高速化・モバイルファースト最適化済みのシンプルな無料Wordpressテーマ。100%GPLテーマです。

アクセスの少ない特定の記事のアドセンス広告だけを外すのに【cocoon】をテーマにしている人なら簡単に広告を外す事ができます。

全ての広告を外したくない時、特定の記事だけの広告を外すのに便利です。

投稿画面から歯車マークを開き、広告を除外するにチェックを入れる

投稿記事から歯車マークをクリック。下にスクロールして【広告】という項目を開きます。

【広告を除外する】にチェックを入れて保存すれば、その記事にはアドセンス広告が表示されません。

③いらない画像を削除する

私の場合、記事の見出しの下に必ずと言っていいほど画像を入れようとしてきました。それがSEO対策になると思っていたのです。

しかし中にはあってもなくても良さそうな画像が存在してます。

最近はTwitterを埋め込む画像を使っていたのですが、必要のない画像は削除する事にして画像を減らしました。

Twitterから引用していたアニメーションは削除しました。アニメーションは特に重たくなるようです。

今後の画像のための3案
  • 画像圧縮ツールを使う 
  • 画像圧縮プラグインを導入する 
  • 自分で手動で圧縮する

④AMP問題を解決する

AMPとは、モバイルユーザーのユーザー体験向上を目的として、GoogleとTwitterが協同しオープンソースプロジェクトとして立ち上がったものです。

ブログ検索する時キーワード表示の隣に出る雷(⚡︎)マークがAMP対応の記事です。速度が上がるのでSEO対策にもなります。

AMP対応は慎重に

私も初期にAMPを導入しましたが様々な問題にぶつかり、最近では投稿時にAMPを外すにチェックを入れてます。

簡潔でシンプルな記事だとSEO対策になりますが、アフィリエイト商品を貼り付けてる記事だと上手く表示されなかったり、Google広告のレイアウトが崩れたり表示されなかったりした為です。

*今ではGoogle広告もAMP対応されていたり、アフィリエイトもAMP対応が増えてきました

サーチコンソールのエラーメッセージ

AMPを導入してから、しばらくしてサーチコンソールの方に【参照にしているAMPのURLはAMPではありません】というメッセージエラーが出るようになりました。

当初はAMP対応を良く分からないまま導入していたので、何度もリライトするうちに謝ってAMPを外した記事を更新していたのかもしれません。

これもリダイレクションを使って解決しようと試みましたが苦戦。後、放置しました。

しかしサーチコンソールのエラーメッセージを放置しているとSEO的(質の低いサイトと評価されてしまう)に良くないと知っていたので、この際それも解決するようにしました。

参照にしているAMP URLはAMPではありません

AMPを良く分からないうちに記事に導入した為、AMPを外した結果このようなエラーメッセージが届くようになったと思われます。

AMP対応だったURLを、AMP非対応のURLに変更した為起きたエラーでしょう。

AMPを変更すると、URLが変更される事になるのでリダイレクトが必要になります。

AMPを生成しないにチェックを入れる

cocoonではAMP対応しています。もしAMPを使いたくない場合は設定から操作もできるようです。

URLをAMPにしたくない時は投稿記事から歯車マークをクリック。

下に行くと【AMP】という項目があります。【AMPページを生成しない】にチェックを入れます。

あとは保存するだけでAMPではない記事が投稿できます。

AMPのURL変更後は、リダイレクトする

AMPをAMP非対応のURLに変更した場合はエラーになるので、URLを変更します。

新しい URLが、クロールされてインデックスされるのに時間がかかる場合もありますがサーチコンソールでメッセージエラーが消えたら問題はありません。

⑤いらないプラグインを削除する

使わないプラグインも、速度表示の遅くなる原因の一つになっていると考えられます。

ブログを開設当初に、良く分からず導入したままになっていたプラグインを削除します。

しかしもし後からやっぱり必要だったけど、何ていうプラグインだったか名前が思い出せない・・・という事がないようにスマホのメモ機能にメモを残しておくと良いでしょう。

もう一度速度を測る

ここまで簡単にできる対策を試したのでもう一度スコアを計測してみます。

ひとまず42まで上がっていました(全然ですが何もしないよりはマシ)。

試したのは以上のものでしたがその他の解決策として、

  • リビジョンを削除する
  • キャッシュ系のプラグインを使用する
  • 高速サーバーに変える
  • 有料テーマに変える

などの対策をする事も考えられます。

一番は良質な記事を書く事!

今回は自分のブログの表示速度が遅いと感じた時にできる簡単な対策を試してみました。

新しく導入するプラグインは便利な反面エラーも出やすいので充分注意しながら使うようにしましょう。

ともあれSEO対策として欠かせないのは【良質な記事をたくさん書く事!】だと思っています。

画像圧縮プラグイン【EWWW Image Optimizer】失敗談

【EWWW Image Optimizer】を導入した時の話です。

一括圧縮をする際に【画像が6,000枚ほどあります、と表示されました。そんなに?と思いましたが、一括圧縮をクリック。

すると、圧縮が終わるまでになんと5時間以上もかかりそうだと判明します。圧縮中は分かるようにタイムを刻んでくれます。

深夜の作業だった事もあり、眠気を堪えながらやっていました。しかしあまりにも時間がかかりすぎるため気になってサイトを確認した所。

「アイキャッチ画像がいくつか消えてる!!

ホームを訪れた際に見える、ブログ記事一覧の顔でもあるアイキャッチ画像がランダムに消えているという事に驚愕。

もしかすると圧縮完了後に圧縮された形で表示されたのかもしれませんが、とにかくこれはヤバイと思いました。

後日談として、設定に、元が消えてしまう項目にチェックを入れてしまった可能性があると思われます

すぐプラグインを停止、削除

すぐにプラグインを無効にし、削除。もしこれでアイキャッチ画像だけでなく記事内の挿入画像なども消えていたらアウトだなと思います。

元に戻った

サイトを表示して、アイキャッチが元に戻った事を確認します。

設定のミスだったのか、私のブログは初期の自撮り写真画像が大きいのでそれらもなんらか影響されているのかは分からないですが、生きた心地はしませんね(汗)。

とにかくこのプラグインに万が一エラーが出ても、最中で無効化し、削除すれば元に戻るようで安心です。

新しいプラグインを入れる時は事前に必ずバックアップを行いましょう

余談:表示速度が遅くなった原因のひとつにサイドバーに人気記事のウィジェットを追加した

ウィジェットも速度表示を遅らせる原因になるようです。

私も最近、サイドバーに人気記事のウィジェットを追加しました。

その後日にブログが重くなったように感じたので、サイドバーには極力必要のないウィジェットを表示させないようにしました。

自分のブログの表示速度が遅い!簡単にできる対策5つ!備忘録まとめ

https://www.pexels.com/ja-jp/photo/iphone-34123/

自分のブログの表示速度が遅くなるとSEO的にも良くない事が分かっています。

便利なツールやプラグインを使って画像を圧縮させたり、あまり効果のない記事の広告を減らしたりまずは手近にできる事から始めてみると良いと思います。

画像圧縮や、キャッシュ系のプラグインは便利ですが何のプラグインもエラーになる可能性があるので必ずバックアップを取ってから導入する事をおすすめします。

確かに表示速度の速さも大切ですが、やはり一番大切なのは良質な記事を書く事ではないでしょうか。

タイトルとURLをコピーしました