スマートフォンを使用していて、読み込みの遅いサイトに出会ったことはありませんか。
調べ物をしているときに、読み込みが遅いサイトに出会うと、イライラして自分はブラウザバックしてしまいます。
Googleによると「ユーザーの50%はサイトが2秒以内に読み込まれることを期待しています」とのことで、それ以上の時間がかかる場合、離脱してしまうユーザーも多そうです。
そのぐらい大事なサイト読み込み速度なのですが、サイト運用者の方は正確に把握しているでしょうか？
今回はそんなサイトの読み込み速度を計測できる「Test My Site」についてご紹介します。
Test My Siteとは
Googleが提供する、モバイルサイトに特化した読み込み速度をチェックするツールです。
サイトの読み込み速度を計測し、同業者の平均と比較してくれます。
また、改善法などもGoogleが提案してくれるので、それを元に読み込み速度の改善をおこなうことができます。
Test My Siteを使ってみる
今回は、このサイトの読み込み速度を計測してみます。
使い方は簡単で
URLを入力すると計測ができます。
計測には約1分ほどかかるので待ちます。
結果として表示される項目
3Gでの読み込み時間と訪問者の推定離脱率
特に良好・良好・普通・要改善の4段階で評価されます。
今回のように良好だった場合は、早急に改善する必要はありません。
推定離脱率は今回の場合4秒間にどのくらいのユーザーが離脱の確率があるのかを割り出してくれます。
同じ業種内の比較
同じ業種のパフォーマンスを比較し表示してくれます。
ここで、業種全体の読み込み速度の確認ができます。
もし、自分のサイトが平均よりも、表示が遅い場合はサイト改善が必要です。
速度改善法
具体的な改善策を表示してくれます。バツマークのついているところを改善することで
読み込み速度の改善が期待できます。
このサイトの結果を見て
このサイトの読み込みは良好なようなので、ひとまず安心です。
改善の必要はあまりないかもしれませんが、簡単な改善をおこない「特に良好」になるようにしてみます。
読み込み速度の改善
先程の結果を元に読み込み速度の改善をおこないます。
画像の圧縮
読み込みが遅くなる原因として上げられるのが画像です。高画質、高解像度の画像は読み込みを遅くしてしまうので、適度な圧縮が必要です。今回はサイト内で使用しているすべての画像を100KB以下に圧縮しました。
画像の読み込みを遅らせる
通常のサイトは、文章や画像を同時に読み込むので処理に手間取り表示が遅れます。
この処理をやめ、画像を遅らせて読み込むことでサイトの表示を高速化させることが可能です。
このサイトはWordPressを利用したサイトなので、プラグインの「a3 Lazy Load」を利用することで改善をはかりました。
キャッシュ処理を利用する
キャッシュ処理を利用しサイト全体の表示速度を改善します。
キャッシュとは、データの一部を一時的に保存することで、処理速度を速める仕組みです。サイトの場合、一度読み込んだ画像をキャッシュとして、ブラウザのメモリに保存することでWebサーバとの通信を簡略化しています。
このサイトではプラグインの「WP Super Cache」を利用しました。
改善の結果
もう一度Test My Siteで計測を行います。
結果は画像のように3秒となり、先程より1秒改善され「特に良好」になりました。
このサイトは、元が悪くなかったのでそんなにインパクトが無いかもしれませんが
8秒とかのサイトだと、上記のような改善をすることで4秒ほど高速になることもあります。
クライアントさんのECサイトでおこなった場合
実際にクライアントさんのECサイトでは、高解像度の商品画像を使用しており、
読み込みに12秒もかかっていました。ECサイトで読み込み12秒は致命的で、コンバージョンが発生しませんでした。
取り急ぎ、サイト内の画像をすべて圧縮して、再度計測をおこなったところ6秒にまで改善することができました。まだまだ、カートの動線などで改善が必要ですが、読み込みもされずに離脱という自体は回避することができました。
まとめ
企業のサイトはもちろん、個人のブログなどでもサイトの読み込み速度は非常に重要です。
現在、あまりサイトにアクセスがなくて悩んでいる方は、一度サイトの読み込み速度を確認してみてください。遅かった場合は離脱されている可能性があります。
「Test My Site」を利用することでサイトの改善すべき点もわかります。1度使用し内容をWEB担当者と共有し、サイトの最適化をおこなってみてください。