ライフクリエイター諏訪亮祐

Lighthouseを使ってユーザー目線でWebサイトを見直す

Lighthouseとは、ウェブページの品質向上を目的に開発されたGoogle公式のツール(Google Chromeの拡張機能)です。Lighthouseでは、Performance(表示速度)、Accessibility(ユーザー設計)、Best Practices(推奨項目)、SEO(検索エンジン最適化)、Progressive Web App(アプリの品質)という5つの指標からウェブページを診断&スコア化してくれます。

似たツールにPageSpeed Insightsというツールがありますが、Lighthouseは表示速度に限らず様々な側面からウェブページの品質改善を測定できます。また、SEOに関してはGoogleが推奨する指標を元にしたスコアなのでGoogleの検索アルゴリズム対策になります。

診断した結果、以下の画像のスコアが表示されました。

以前からPageSpeed Insightsで100(満点)だったので「Performance」に関してはほぼ問題無し。しかし、細かい改善ポイントがあります。ここから100まで持っていくことが重要。

「SEO」に関しては満点なので問題無し。
上記2点に関してはセールスポイントなのでこの程度は当然の結果です。

問題は「Accessibility」と「Best Practices」。
制作側の主観的なデザインではなく、指標に則った設計・デザインを心がけなければいけません。

「Progressive Web App」については対応させないと測定できないので保留。

この結果を元にしてPerformanceから各項目ごとに修正していきます。
修正前と後でのスコアだけでなく、修正法なども記録していきます。

カテゴリー