サイトが重いと感じたら、ページの表示速度をチェックして画像を最適化させよう
おすっ！つな（@tu_na_69）です_(:3 」∠)_
あなたのサイト表示速度は何秒？サイトが重いと感じたら、ページ読み込みの表示速度を計測してみましょう。
サイト表示速度は速い方がいい！
サイトの表示速度は、速い方がいいに決まっています！
Google検索では、ページの表示速度もサイト評価のひとつとしています。遅いよりは、表示速度が速い方がSEOに有利といえます。
ところで、あなたはクリックしてページが表示されるまでどれくらいの時間なら待てますか？
3秒でも長いと感じる人もいれば、10秒くらいはふつうに待てるという人まで、性格が表れますね。どれくらいの時間が待てるかで短期度チェックもできそう。
わたしは気長な方だと思うのですが、5秒待ってもページが表示されなければ「あれ？」と思い、10秒以上ぐるぐる状態なら「不具合が生じている」と感じてそのページを閉じてしまいます。
サイトの表示速度が遅いほど、ページを離れる人は増えます。
一般的に、読者が待てるページの読み込み時間は最大でも10秒と言われています。10秒を過ぎると、ほとんどの読者はそのページを離れてしまいます。
また一度でもそうした経験があると、そのサイトに対しての印象も下がります。検索で上位表示されることがあっても、同じサイトをクリックする確率はかなり低くなります。
サイトのページ表示速度が遅くていいことはひとつもありません。
早速、サイトの表示速度を計測してみましょう。急げ～((((ｏﾉ´3｀)ﾉ
サイトのページ速度を計測する方法
今回は無料で簡単に測定できるふたつのサイトで表示速度をチェックしてみます。
PageSpeed Insightsでサイト速度チェック
Googleが提供しているサイトの表示速度がチェックできるサイトです。
サイトURLを入力するだけで、無料で誰でも簡単に使えます。サイトの最適化を100点満点の数値で表してくれるのも、分かりやすくていいですね。
モバイル版、パソコン版の2パターンが一度にチェックできる優れものです。
つなろっくのサイト表示速度をチェックした結果はこちらです。
モバイル版81点!!
パソコン版35点!!Σ(･ω･ﾉ)ﾉ！
あ・赤点・・・。
パソコンとモバイルでこれほど差が出るものなのでしょうか_(:3 」∠)_
注：「Page Speed Insights」は 2018年にリニューアルされ、現在は新しいバージョンになっています。新バージョンでの計測結果はこちら。
Googleアナリティクスのサイト速度チェック
Googleアナリティクスは無料で登録できて詳しいアクセス解析をしてくれるハイスペックなツールサイトです。
Googleアナリティクスなら、サイトの表示速度も簡単にチェックできます。
レポートから「行動」→「サイトの速度」をクリックします。
当サイトのサイト速度を調べた結果は、こちら。
平均読み込み時間・・・6.88秒
少し遅い気もしますが、許容範囲かな？
平均読み込み時間とは、リンクをクリックしてからページがすべて表示されるまでに要する時間になります。
数日後にほぼ同じ状態で測定しなおしてみると、平均読み込み時間は5.99秒でした。
数値に違いが出るのは、Googleアナリティクスのサイト速度が、サンプルページを使った計測方法をとっているからです。サンプルページは1％のみ。そのため、同じ条件でも計測する日によって平均読み込み時間は異なります。
そのため正確なサイト表示速度ではなく、参考速度になります。
週ごとに変動をチェックする感じがいいかもしれませんね。
改善点をチェックしてサイトを軽量化
みなさんのサイトの表示速度はいかがでしたか？
PageSpeed Insightsではここを直すとサイトをもっと軽量化できるよという改善点を教えてくれます。
例えば、以下のような項目。
- 画像を最適化する
- ブラウザのキャッシュを活用する
- スクロールせずに見えるコンテンツのレンダリングをブロックしているJaveScript/CSSを排除する
- JavaScriptを縮小する
- CSSを縮小する
赤点をもらった人は、そのまま放置せずにできるだけ早めに改善に取り組みましょう！
画像の最適化
サイトを軽量化するいちばん効果がある方法は、画像データのサイズを小さくすることだと思います。画像を圧縮したり、サイズを縮小して最適化させてあげると、だいぶ改善されると思います。
画像はアップロードする前に、圧縮しましょう。特にスマホの写真データはそのままではかなり重いです。アプリなどもありますが、わたしはいまのところこちらを利用しています。
すでにはてなブログにアップロード済みの画像はこちらの方法もおすすめです。
