この記事は、以下のような人にオススメです。
- Lighthouse 10のバージョンアップで変更点を確認したい人
- 今回のアップデートでSEOに影響あるかについて知りたい人
- TTIが削除された理由を知りたい人など…
こんにちは！Webディレクターのオスカーです。
2023年2月10日にLighthouse 10がリリースされました。
今回のアップデートでTTIが削除され、CLSがより重要なパラメータになりました。
あと、いくつかの診断項目も追加され、より強いLighthouseになりました。
これはSEOには直接関与しない内容ですが、なんてったってLighthouseですので、あえてSEOの関連情報として読んでいただけばと思います。
最後までお読みいただけますと幸いです。
もくじ
Lighthouseとは
Lighthouse とは、サイトのUX（ユーザーエクスペリエンス）を向上させるため、Web Vitals項目を調査・診断するWebサイト監査ツールです。
LighthouseはGoogleにより開発され、2018年5月にversion 3.0としてリリースされました。
そんなLighthouseですが、今年（2023年）2月10日にversion 10としてリリースされました。
これは2021年11月のversion 9より、1年2ヵ月ぶりのバージョンアップとなっております。
LighthouseとCore Web Vitalsの関係について
Lighthouseの更新に入る前に、言っておきたいことがあります。
LighthouseとCore Web Vitalsは直接な関連しません。
Core Web VitalsはGoogle SEOにおいて、重要な数値であり、ランキングに直接な影響があります。
LighthouseはWeb Vitals項目を調査・診断することはできますが、SEOと直接関連していません。
つまり、Lighthouseの数値は参考になるものであり、Lighthouseの更新はSEOの更新ではないことをご理解いただきたいです。
以下にJohn Muellerのツイートの通りです。
CWV are independent of Lighthouse scores (there might be some components that overlap, but the scoring Lighthouse does is separate).
— johnmu is a ranking factor and so are you 🐀 (@JohnMu) February 10, 2023
バージョンアップの変更点について
さて、今回のLighthouseのバージョンアップで何が変わったかについて、説明しますが、まとめますと以下の２点になります。
- スコアの計算方法
- 診断内容追加
変更点①：スコアの計算方法
１つ大きいな変更はスコアの計算方法です。
| 項目 | 加重 (version 8) | 加重 (version 10) |
|---|---|---|
| First Contentful Paint | 10% | 10% |
| Speed Index | 10% | 10% |
| Largest Contentful Paint | 25% | 25% |
| Time to Interactive | 10% | 0% |
| Total Blocking Time | 30% | 30% |
| Cumulative Layout Shift | 15% | 25% |
Lighthouse 10では、「Time To Interactive (TTI) 」は計算対象でなくなり、その10%の枠が「Cumulative Layout Shift (CLS)」に加算されます。
「Time To Interactive (TTI) 」が対象外になった理由
なんてTTIが計算外になったのでしょうか？あくまで推測ですが、原因はこの２つではないかと思います。
- TTI は Google SEOやランキングで使用されるCore Web Vitals指標ではありません
- FIDを測定するのに、TTIよりもTBTの方が良かった
TTI は Google SEOやランキングで使用されるCore Web Vitals指標ではありません
SEOに直接に影響を与えるCore Web Vitalsは３つ：
- LCP（Largest Contentful Paint）：「読み込みのパフォーマンス」
- FID（First Input Delay）：「インタラクティブ性」
- CLS（Cumulative Layout Shift）：「視覚的な安定性」
このように、TTIはCore Web Vitals指標ではありません。
ただし、今まで、TTIはFIDを推測するための項目として使われていました。
FIDの数値はFCPとTTIお間にあるとされています。
下記の例で言いますと、仮にユーザーのクリックを反応するため、JSの読み込み完了が必要となりますと、FIDはクリックしてからJSの読み込み完了までの時間になります。
そのため、TTIは参考数値としては役立っていました。
FIDを測定するのに、TTIよりもTBTの方が良かった
TBTの定義は、FCPとTTIの間、50ms以上かかたタスクで、そのオーバーした部分の合計の数値になります。
このように、どちらの数字もFIDを表せちおぁせんが、TBTはサイト全体の健全性とインタラクティビティへ影響していて、FIDにより近い数値になっています。
TTIは大枠の数値を表しますが、あくまでもサポート情報として機能をしています。
結果、今回のバージョンアップで、TTIは完全にLighthouseより削除（removed）されました。
変更点②：診断内容追加
２つ目の変更は診断内容の追加です。
以下２点が追加されました。
- Back/forward cache（bfキャッシュ・bfcache）
- Paste-preventing inputs
Back/forward cache（bfキャッシュ・bfcache）
Lighthouse曰く、bfcache（bfキャッシュ）はサイトパフォーマンス向上において、非常に強力なツールです。
bfcacheは、ユーザーがページからページへ移動するとき、ページの完全なスナップショット (JavaScriptヒープを含む) をキャッシュします。ページ全体がメモリに保存されているので、ユーザーが「前のページに戻る（Back）」というアクションをする時、ブラウザーはキャッシュから呼び出し、すばやく簡単にページを復元できます。
そして、Backと同様、「戻る前のページに進む（Forward）」もbfcache対応したっ場合、高速な表示が実現できます。
ブラウザにはbfcacheからページを復元させない方法はいくつかありますが、今回の新しいLighthouse診断では、実際にテストページから移動したあと、ページに戻ることで、bfcache可能かどうかをテストを行います。さらに、失敗した場合はその理由を説明するようになっています。
貼り付け防止入力フィールド
元々ある診断内容には「ユーザーがパスワードフィールドに貼り付けることを許可する」という部分がありますが、今回はその機能が拡張され、ページ内の入力フィールドへの貼り付けが機能することが確認できるようになりました。
Lighthouseは、入力フィールドへ貼り付けを禁止することは、UXを悪化させ、正当な安全性とアクセシビリティのワークフローを妨げます、と主張します。
この点について、オスカーも同意します。
他の変更点について
上記２点のほか、Lighthouseのライブラリの更新もありましたが、エンジニア分野になりますので、割愛いたします。
最後にLighthouseの拡張機能を共有して終わります。
おわりに
繰り返しになりますが、今回のバージョンアップはあくまでもLighthouse側のもので、Core Web VitalsやSEOに直接な影響はありませんが、レポートの見方や診断ツールが追加もありますので、把握しておくことをおすすめします。
こちらにはWeb Vitalsの数値をGTMで取得する方法を記載しています。
SEO x GTM：Web Vitalsの数値を集計したい｜開発いらず、GTMだけでGA4に送って保存分析
ぜひ合わせて見てください。
今日も見ていただきありがとうございました。
お役に立てれば幸いです。
それでは。
コメント