Lighthouseを使ってみよう

Googleウェブマスター向け公式ブログでGoogle Chromeの拡張機能であるLighthouseの使い方を説明してくれていますので、私もLighthouseのご紹介をしたいと思います。

灯台

ふわふわ

Lighthouseって?

Lighthouseとは、Chromeに設置する拡張機能でして、該当ページの「Performance(表示速度に関わる指標やCSSの記述等)」「Progressive Web App(プログレッシブウェブアプリとしての構文等)」「Accessibility(アクセスのしやすさ)」「Best Practices(最高品質にするための推奨項目)」をチェックすることができますが、ここに新しく「SEO」という項目が出来ました。

Lighthouseのアイコン

デベロッパーの皆様が「暗礁に乗り上げないようにする」ことを目的としているため、「Lighthouse(灯台)」と名付けられました。

引用)Googleウェブマスター向け公式ブログ

診断結果

この「SEO」の項目では簡単な10項目に合わせて該当ページをチェックし、診断してくれるという仕組みです。

Lighthouse内のSEOカテゴリでは、ウェブページの基本的な「SEO ヘルスチェック」を実行できます。その結果、デベロッパーやウェブマスターの皆様にウェブページで改善可能な箇所を見つけていただけるようになっています。

引用)Googleウェブマスター向け公式ブログ

現時点では全て英文なのですが…では、その「SEO」項目での使い方をご紹介したいと思います。

ふわふわ

SEO診断方法

Chrome拡張機能におけるやり方をご紹介します。まず、ブラウザに該当ページが表示されている状態で、Lighthouseアイコンをクリックし、「Option」ボタンを押します。そこで「SEO」をチェックした後、改めて「Generate Report」をクリックすると、診断開始です。

使い方

ふわふわ

SEO診断結果項目

ここでは10個の診断項目と2個の進言項目が分かりますので、ご紹介します。

審査項目

診断項目

  • Document doesn’t use legible font sizes
    全体の75%以上が16px以上のフォントサイズになっているか
  • Has a <meta name=”viewport”> tag with width or initial-scale
    モバイル用も含めてviewportは適切か
  • Document has a <title> element
    タイトルタグは適切に設置されているか
  • Document has a meta description
    meta descriptionは適切に設置されているか
  • Page has successful HTTP status code
    ステータスコードは適切(200)か
  • Links have descriptive text
    コンテンツを理解できるよう、内部リンクのアンカーテキストは適切な表記か
  • Page isn’t blocked from indexing
    コンテンツを読み込ませる際、変なブロックはしていないか
  • Document has a valid hreflang
    言語設定は適切に設置されているか
  • Document has a valid rel=canonical
    canonical属性があれば、それは適切に設置されているか
  • Document avoids plugins
    サポートされていないプラグインを使っていないか

進言項目

Additional items to manually check(更に付け加えて良くするならば…)ということで、リンク紹介しています。

  • Page is mobile friendly
    モバイルフレンドリーかどうかを確認してください
  • Structured data is valid
    構造化データのマークアップを確認してください

以上のことが分かります。おそらく診断項目1項目10点の10項目100点満点で評価してくれているのだと思います。今後はこのLighthouseの「SEO」機能はどんどん強化していく予定とのことです。現段階では、実際に「SEOスターターガイド」に書いてあることを該当ページ軸で診断してくれているのですが、それでもSEOに不慣れな人からすれば有難い機能ですね。

ふわふわ

利用感想として

個人的には、「SEO」項目よりも「Performance」項目の方が利用価値が高いです。FCPやDCLだけでなく、FMP(First Meaningful Paint)まで分かるのは有難いです。FMPとは、ページコンテンツが目に見える状態になるまでの時間(単位は特に無し)で、少ないほど表示速度が速いのですが、これがユーザーの体感値に最も近いような気がしていますので参考値としては有用です。

というわけで、是非このChrome拡張機能、試してみてはいかがでしょうか。


関連記事

Search Console Insightsがリリース

2020年8月にSearch Console Insightsのベータ版がリリースされていました。私はベータ版の対象者になっていたので、当時は詳細を紹介していました。これが米国現地時間2021年6月15日に正式にリリース紹介されましたので、あらためてご紹介します。ここ数日間をかけて徐々にロールアウト ...(続きを読む)

SEOが不要になる

私の個人的な意見です。個人的な意見というのは、確証が無い憶測での記事ということですので、ゆる~い感じでご覧いただければと思います。 SEOとはSearch Engine Optimizationの略で「検索エンジン最適化」の訳ですが、このSEOについて、何か特別なマークアップ以外はもう考えなくて良く ...(続きを読む)

GSCのクエリフィルタリング機能更新

先日、Google Search Console内での検索パフォーマンスで正規表現フィルタが新機能として実装されたことをご紹介しましたが、その後この機能がアップデートされたと米国現地時間6月1日にGoogleは発表しました。発表内容は日本語ですが、ここでもご紹介します。 Googleからの発表内容 ...(続きを読む)

202106コアアップデート

Googleは米国現地時間6月2日にコアアップデートを行うことをツイートしました。前回が米国現地時間2020年12月3日でしたので、約半年後の告知となっています。コアアップデートの度にGoogleは2019年8月のブログ記事を引用して発表していますが、その記事の和訳は私のブログでこちらに記載していま ...(続きを読む)

コメントを書く

コメントは承認から反映までしばらく時間がかかる場合がございます。メールアドレスが公開されることはございません。