以下の通り、2018/7 よりページの読み込み速度、つまり、表示速度が、モバイル検索のランキング要素に追加されます。
2018/7/9 に導入されました。
ページの読み込み速度をモバイル📱検索のランキング要素として使用する Speed Update を、全てのユーザーを対象にロールアウトを開始しました！
詳しい情報はブログをご覧下さい 👉 https://t.co/EcWFaaNE0G
— 金谷 武明 Takeaki Kanaya @ 東京 (@jumpingknee) 2018年7月9日
また、Google では、表示速度と直帰率に関する、以下の様な情報を公開しています。（英語なので、簡単に日本語訳しています）
表示速度が 1 秒から 3 秒に落ちると、直帰率は 32% 上昇
表示速度が 1 秒から 5 秒に落ちると、直帰率は 90% 上昇
表示速度が 1 秒から 6 秒に落ちると、直帰率は 106% 上昇
表示速度が 1 秒から 10 秒に落ちると、直帰率は 123% 上昇
引用：Find out how you stack up to new industry benchmarks for mobile page speed – Think with Google
つまり、今後は、SEO 対策としても、直帰率を下げるためにも、より一層モバイルでの表示速度が重要になってきます。
ここでは、Google 公式のページ表示速度をチェックし、その最適化を提案するツールである「PageSpeed Insights」。
その使い方・指摘された改善方法について、解説したいと思います。
PageSpeed Insights とは？
モバイル端末やパソコン向けのページの実際のパフォーマンスに関するレポートと、そうしたページの改善方法を確認できます。
と、説明がある通り、ページの統計情報や、問題となっている点を分かりやすく教えてくれます。
- PC・モバイルでの表示速度を計測
- 速度向上のための改善案を提案してくれる
- CSS・JS、画像など、Google が最適なサイズに圧縮してくれたものをダウンロードできる
無料で使える、とても便利な Google 公式のツールです。
PageSpeed Insights の使い方
以下のサイトにアクセスして、入力欄にチェックしたい URL を入力し、分析ボタンを押す、これだけです。
チェックには、30 秒 ～ 1 分ほどかかります。
「origin:」を URL の先頭に付ければ、サイト全体の速度データを集計してくれるようです。
当サイトで試してみましたが、上手く取得できませんでした。
PageSpeed Insights のチェック項目と改善方法
これは、当サイトのチェック結果です。
モバイル・PC で、個別にチェック結果が表示されます。
ページの速度・最適化は、ただ単に点数が表示しているだけで、改善策は、ページの統計情報・最適化についての提案に表示される項目です。
ページの速度
上記画像では、「Unavailable」となっています。
本来ならここに、「速い」「平均」「遅い」のどれか（速いなら緑、平均ならオレンジ、遅いなら赤色）と、点数が表示されます。
「Unavailable」となっているのは、2018/1 から、速度スコアに Chrome ユーザー エクスペリエンス レポート（CrUX）というデーターを利用している為です。
Chrome ユーザー エクスペリエンス レポートは、アクセスが多い、人気のあるページしかデータを取得しません。
なので、ほとんどの方が、「Unavailable」と表示されると思います。
もし、点数が表示されているなら、そのサイトは Google から人気があると評価されているという事です。
羨ましい・・・
「Unavailable」と表示されてしまうけど、ちゃんと点数を知りたいと思う方もいらっしゃるでしょう。
Lighthouse という Google が公式で出している Chrome の拡張機能を使えば、調べる事ができます。
最適化
該当ページが、パフォーマンスに関する一般的なおすすめの方法に、どの程度あっているかチェックし、ページのパフォーマンスを 0 ～ 100 の値で評価。
80 以上なら Good（緑）、60 ～ 79 なら Medium（オレンジ）、それ以下なら Low（赤）で表示されます。
ページの統計情報
この項目は、ちょっとテクニカルな内容になるので、分からない方は読み飛ばしてください。
具体的に何をチェックするかというと、CSS・JavaScript などのレンダリングブロックリソースを読み込むために必要なラウンドトリップの回数。
また、ページで使用されている合計バイト数、データセットのラウンドトリップ回数などが表示されます。
最適化についての提案
以下の様なチェックと、それに対する改善案を教えてくれます。
- サーバーの応答時間を短縮する
- ブラウザのキャッシュを活用する
- 圧縮を有効にする
- CSS を縮小する
- HTML を縮小する
- JavaScript を縮小する
- スクロールせずに見えるコンテンツのレンダリングをブロックしている JavaScript/CSS を排除する
- リンク先ページのリダイレクトを使用しない
- 画像を最適化する
- 表示可能コンテンツの優先順位を決定する
修正提案の詳細を知りたい場合、「修正方法を表示」という部分をクリックします。
具体的な改善方法は、Google が分かりやすく説明してくれていますので、以下のページを参考に対応してください。
最適化された画像・JS・CSS のダウンロード
「画像、JavaScript、CSS リソース」というリンクをクリックすれば、ZIP 圧縮されたファイルをダウンロードできます。
まとめ
始めに書きましたが、今後は、SEO 対策としても、直帰率を下げるためにも、より一層モバイルでの表示速度が重要になってきます。
なので、PageSpeed Insights や、Lighthouse などのツールを上手に使いながら、より検索上位に表示されるように改善していきましょう。
コメント