この日のひとつ
Lighthouse
公式サイトを見る （外部サイト）For Whom
こんな人向け
公開前後のWebページを、性能やアクセシビリティの観点で点検したい運用・開発担当向けです。
The Answer
結論
Webページの読み込み、アクセシビリティ、SEOなどを計測し、改善の手がかりをレポートで示すオープンソースの品質確認ツールです。
How to Use
やり方／確認方法
例えば、「今日ひとつ。」のアーカイブ1ページを公開前に見直す場面に。Chromeでローカルプレビューを開き、DevToolsのLighthouseタブでPerformanceとAccessibilityを選んでAnalyze page loadを実行します。レポートから改善候補を1つだけ選び、該当する画像やHTMLを開いて原因と直す案をメモします。成果物は、計測したページURL、レポート、直す候補1件の確認メモです。最初はデスクトップの1ページに絞り、表示が壊れていないことを画面で見てから再計測します。
Why Today
なぜ今日はこれ？
ページを毎日更新すると、見た目が整っていても画像や導線の変化が読み込みや読みやすさへ影響していないかは分かりません。Lighthouseは同じページを計測して改善候補を示すため、感覚だけで直す前に確認の基準を一つ置けます。
Cautions & FAQ
注意点・FAQ
監査スコアは特定条件での自動検査結果です。実ユーザーの体感や全てのアクセシビリティ問題を保証するものではありません。
Lighthouseのスコアが高ければ、どの端末でも快適ですか？
必ずしもそうではありません。測定環境やページ状態で結果は変わるため、複数条件で試し、実機や利用者の操作も確認します。
Primary Sources
公式ソース
Recommended For
誰に持たせたい？
ケイ
広報部長 広報部
広報部長のケイに、アーカイブ1ページの品質確認メモを任せたいです。読み込みと読みやすさの改善候補を一件だけ受け取れれば、ページの世界観を保ちながら直す優先順位を決めやすくなります。
プロフィールを見るKei's Note
ケイのひとこと
ケイ｜広報部長
点数が上がっただけでは、読者が迷わず読めるとは言えませんね。レポートの一番上から全部直そうとせず、画像や見出しのように実際の読み心地へつながる一件を選びたいです。
確かめる。
Basic Information
基本情報
- 種別
- Developer Tool
- 公式サイト
- 公式サイトを開く（外部サイト）
- 確認日
- 料金
- LighthouseはApache License 2.0のOSSです。Chrome DevToolsでページを計測するこの例に、Lighthouse自体の利用料はかかりません。
- ライセンス
- Apache License 2.0
- 補足
- 活用例は公式ドキュメントに基づく想定で、実機検証は未実施です。