【期間限定オファー厳選】今月のおすすめクレカ

ブログの表示速度が遅い!?初心者でも簡単に改善できた2つの方法

ブログの表示速度がめっちゃ遅いんだけど!

難しいことせずに簡単に改善できる方法ってないのかな?

7月にブログデビューしたじーこです。

記事を投稿した後、スマホでどんな風に表示されてるかな~と見てみたらびっくり。

カク、カク、カク・・・

表示が遅すぎる・・・!

ブログの表示速度を調べてみたらこれまた、びっくり。

パソコンの表示速度
モバイルの表示速度

数値が低すぎる・・・!!

僕自身、ページが重いとすぐ閉じて別のページを探す癖があるので、早急に改善せねば!!

じーこ
じーこ

でも難しいことはチョット勘弁。

ということで、初心者でも簡単にできる方法で実際に効果があったものをご紹介します!

本当に簡単な方法で、ブログの表示速度は改善しました!!

改善後のパスコンの表示速度
改善後のモバイルの表示速度
この記事で分かること

表示速度が遅いとなぜダメなのか

自分のブログやサイトの表示速度の調べ方

初心者でも簡単!表示速度を改善する2つの方法

表示速度の遅さで読者が別のサイトに流れてしまっているサイトは多いと思います。皆さんの記事をしっかり読んでもらうためにも、簡単に改善できますので真似してみてください!

ブログの表示速度が遅いことのデメリット

調べ物をしていて、ページがなかなか読み込まれず・・・もういいや、別のページを見よう!というのは誰しも経験したことがあるのではないでしょうか?

僕は常習犯です。せっかちなのか、よくしてしまいます。(悪気はないんです…)

表示速度を改善すべき理由は2つあります。

  • ユーザビリティが下がる
  • SEOにも影響を与える

1つずつ、解説していきます!

ブログの表示速度が遅いとユーザビリティが下がる

ユーザビリティとは、ユーザー側にとっての「使いやすさ」です。

表示速度が遅いとユーザーにとっては「使いにくさ」が下がる。つまり、使いにくいサイトと認定されてしまうというわけです。調べ物をしていて・・・というケースはまさにこれに当てはまります。

僕たちって何かと忙しいんですよね。

通勤時間帯だろうが、休憩中だろうが、仕事中だろうが、調べたいものはストレスなく調べられるに越したことありません。

Googleの“Find out how you stack up to new industry benchmarks for mobile page speed”という調査結果にはこんなことが書かれています。

出典:think with google

ぺージの表示速度が1秒から3秒になるだけで直帰率が32%増加。

5秒になると、なんと直帰率は90%も上がると。つまり、2倍近くもユーザーが直帰してしまうという事態になるということです。

たかが1秒、されど1秒を痛感しますね。

ブログの表示速度はSEOにも影響する

ブロガーにとっては重要なSEOにも表示速度が影響するとGoogle側が公式ブログで明言しています。

読み込み速度はこれまでもランキング シグナルとして使用されていましたが、それはデスクトップ検索を対象としていました。 そこで 2018 年 7 月よりページの読み込み速度をモバイル検索のランキング要素として使用することを本日みなさんにお伝えしたいと思います。

出典:Google フレンドリーなサイト制作・運営に関するウェブマスター向け公式情報

パソコンでの検索だけでなく、モバイルの検索の評価軸として表示速度を使いますよ、ということですね。

自分で何かを検索するときも、デバイスはスマホを使うことが圧倒的に多いです。実際に僕のこのブログを見に来て下さる方も半数以上がスマホからとなっています。(いつも、ありがとうございます!)

今やモバイルがメインのデバイスになっているので、モバイルの表示速度を意識しておくということが重要だということですね。

一方で、こんな記述も。

検索意図は依然として非常に強いシグナルですので、魅力的で検索クエリと関連性の高いコンテンツは、ページの読み込み速度が遅くても高い順位に掲載される場合もあります。

出典:Google フレンドリーなサイト制作・運営に関するウェブマスター向け公式情報

表示速度は評価のポイントではあるけど、検索意図を満たす記事は上位に掲載されることがあるよ!ということですね。それだけ、Googleが記事のクオリティ、ユーザー目線を重視しているってことだと思います。

ブログの表示速度を調べる方法 2選

表示速度の重要性は分かったけど自分のブログの表示速度がどうなっているのか知りたい!という方のために、2つの方法をご紹介します!

  • Page Speed Insightを使う
  • Googleアナリティクスを使う

いずれも難しい知識は不要で今すぐ実践できます!それぞれの特徴はこんな感じ。

Page Speed Insight
  • 無料で簡単に使える
  • 数値で示されるので分かりやすい
  • 表示速度が遅い原因を示してくれる
Googleアナリティクス
  • 無料で簡単に使える
  • 平均の読み込み速度が分かる
  • ページごとに表示速度が遅いかどうかが分かる

特徴を理解したうえで、具体的な使い方を解説します。

Page Speed Insightを使う方法

Page Speed InsightはGoogle提供のサービスで無料で簡単にブログやWEBサイトの表示速度を確認することができます。

使い方はとっても簡単。

出典:Page Speed Insight

画面上部の【ウェブページのURLを入力】の部分に自分のブログ・WEBサイトのURLを入れるだけです。

記事を投稿後にスマホで確認した時になんだか重いな・・・と感じ、調べてみた結果がコチラ!

パソコン
モバイル (いずれもPage Speed Insight)

スコアは100を上限に数値化されます。スコアが高ければ高いほど表示速度が速いことを示しています。Goodの判定となる90点以上が理想ということになります。

Page Speed Insightを使うと数値化してくれるので非常に分かりやすいですよね。

 

僕のサイトはというと・・・

悲惨な状況。そりゃ遅いわけだ。

「どこにどれだけ時間がかかっているのか」を教えてくれる機能もあります。

どこにどれだけ時間がかかっているかを知ることで、次の一手に繋がるという点では便利です。

ただ、具体的に何をすれば改善できるの?という点については初心者の僕には分かりにくかったです。そんな僕でも表示速度が改善した方法は後ほどご紹介します!

Googleアナリティクスを使う方法

ブロガー御用達の「Googleアナリティクス」でもページの表示速度を確認することができます

コチラも、使い方はとっても簡単です。

左側にあるメニューバーの中から

【行動】⇒【サイトの速度】

を押してみてください。

すると、平均の読み込み時間ページごとの読み込み時間が出てきます。

突出して読み込み時間が遅いページがあれば、そのページを改善するだけでも効果はあります!

コチラもあくまでもページ速度を表示してくれるだけで、何をすれば改善するかは明示されません。

ここからは、モバイルが致命的に遅い僕でも表示速度を改善できた方法を解説します!

初心者でも簡単!ブログ表示速度の改善法 2選

当ブログが実施した方法は、以下の2つです。

  1. 画像の最適化(プラグインあり・なし)
  2. ワードプレス内の整理(プラグイン)

改善前の当ブログの表示速度を振り返ると悲惨な状況でした。

パソコン
モバイル(いずれもPage Speed Insight)

そんなブログでも、これから紹介する2つの方法を実践しただけでこうなりました!

パソコン
モバイル(いずれもPage Speed Insight)

パソコンはGoodの水準にまで改善!

モバイルはもう少し改善が必要ですが、それでも24だったことを考えると大きな改善です。

表示速度を改善① 画像の最適化

画像の最適化が最も簡単な改善方法です。

画像の最適化とは、不必要にサイズの大きな画像をブログに合ったサイズに変えることです。

コチラはプラグインを使う方法プラグインを使わない方法がありますのでそれぞれ解説していきます。

 

「EWWW Image Optimizer」を使う

「EWWW Image Optimizer」は、画像の最適化ができるプラグインです。

特徴はなんと言っても、画像を一括で最適化できる便利さです。

しかも、過去に投稿した記事に使っている画像も一括で最適化できちゃいます!記事が多い人には特にオススメですね!

使い方はシンプルです。

wordpressの設定画面から「EWWW Image Optimizer」を開くとこんな画面が出てきます。

画像右側の赤枠で囲った部分、【一括最適化】をポチっと押すだけです。

これだけで最適化できる=サイズを圧縮できる画像があれば自動で最適化してくれます。

これでおしまい!

最新のWordpressとも互換性があり、更新も定期的に行われているので安心かなと思います。今のところ不具合は特にありません。

プラグインを使わない:tiny PNG

出典:tiny PNG

プラグインはwordpressが重くなりそうでいやだな…という方は、tiny PNGもオススメです。

tiny PNGは、PNGやJPEGなどの画像ファイルをリサイズできるサイトです。ただし、コチラはすでに公開済みの画像を一括で最適化することはできません。

【Drop your WebP, PNG or JPEG files here!】と書かれているところに最適化したい画像をドラッグするか、クリックしてファイルを開くだけで最適化してくれます。

試しに上記の画像を最適化してみました。

出典:tiny PNG

最適化が終わると、パンダさんが絶妙な表情で喜んでくれます。

元々の画像は278.4KBありましたが、73%減の75.0KBにまで圧縮できました!圧縮した画像は、右側の赤枠部分のダウンロードから保存できます。

tiny PNGは、画像の解像度を大きく損なわずにリサイズできます。また、一度に最大20枚まで最適化できますので、1記事書く際に使う画像を一気に…という時に便利です。

画像の最適化で表示速度アップ!

記事数が多い人はプラグイン「EWWW Image Optimizer」の活用がオススメ!

記事数が少ない、今後の記事の画像を最適化したい人はtiny PNGでも十分です。

表示速度を改善② リビジョンの掃除

画像の最適化のほかに効果があるのは「リビジョンの掃除」です。当ブログはリビジョンを掃除した結果、表示速度は大きく改善しました!

オススメのプラグインは「WP-Sweep」です。

wordpressには、更新前の記事を自動的に保存して復元の時に活用できるリビジョンという機能があります。

リビジョンは記事を下書き保存したり公開・更新するたびに作られていきます。

現在、この記事を書いている段階でもこまめに保存していたためにすでに「9件のリビジョン」があります。

記事を前の構成に戻したいなという時などに、リビジョンを使うと簡単に戻せます。

ブロガーにとっては便利な機能なのですが、不要なリビジョンが1つ1つの記事に溜まっているとサイト全体が重くなってしまうという欠点があるのです。

そこで「WP-Sweep」の出番です。

このプラグインは、不要なリビジョンを掃除してくれるのです。使い方は初心者の僕でも簡単でした。

リビジョンの掃除前には、念のためバックアップをオススメします。

wordpressの【ツール】から【Sweep(データベース掃除)】を選ぶと下記の画面が出てきます。

リビジョンの欄を見ていただくと、「211のリビジョンが溜まっている」ことが分かります。

1つ前のリビジョンに戻すことはないな、と思っているのであれば【削除】ボタンを押せばリビジョンは消えます。

かなりの数のリビジョンが溜まっている方はサイトのパフォーマンスを悪化させている可能性が高いので、ブログの表示速度はこれだけでも改善します。

僕はこまめに保存してしまう癖があり、リビジョンはほとんど使わないので定期的に掃除するようにしています。

リビジョンの掃除で表示速度アップ!

かなりの数のリビジョンが溜まっている場合はサイトのパフォーマンスが悪化している可能性大。

記事を書く際にこまめに保存する人は要注意。不要なら掃除すると表示速度はアップします。

すべてのリビジョンが消えてしまうのは怖いな、という方には「Optimaze Database after Deleting Revisions」というプラグインもオススメです。

コチラであれば、残したいリビジョンの数を指定してそれ以外を消すことができます。例えば、残したいリビジョンを「2」と指定すれば、各記事の2つ前までのリビジョンを残し、それ以外は削除されるという具合です。

コチラの方が細かく設定できるので、初心者には扱いづらい面もあります。

まとめ:画像最適化とリビジョンの掃除で表示速度アップへ!

ブログやWEBサイトの表示速度について解説しました。

サイトの表示速度が遅いとユーザビリティが下がる恐れがあり、結果的にSEOに悪影響を及ぼす可能性があります。Googleも表示速度を評価の基準の1つにすると明言しているので侮れません。

せっかくいい記事を書いていても、忙しい読者は読み込みに時間がかかるサイトではなく別のサイトに流れてしまうのではもったいない。そこで必要になってくるのが改善です。

改善といっても、コードを書き換えるなど複雑なことは一切必要ありません。初心者の僕でも簡単にできた方法は以下の2つです。

  1. 画像の最適化
  2. リビジョンの掃除

すでに公開している記事の画像も一気に最適化したい!という方であれば、プラグイン「EWWW Image Optimizer」がオススメです。簡単操作ですぐに最適化され、ブログのパフォーマンスは向上します。

プラグインに頼りたくないという方であれば、tiny PNGというサイトの活用を検討されてみてはいかがでしょうか?

すでに公開済みの記事の画像は最適化できませんが、これからブログに挿入する画像の最適化は簡単にできます。

皆さんの記事が多くの人に届くことを願っています!

ということで、また次回。皆さんの日々が豊かなものになりますように!

 

当ブログはブログランキングに参加しています!大変励みになりますので応援をよろしくお願いいたします!

にほんブログ村 にほんブログ村へ
にほんブログ村

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA