)Lesson0:このブログのスコアこのブログはあの手この手を使って、色々な試みを行っています。実験的な要素も多分にあります。今回は、ユーザー体験(UX)を向上させる試みを行ってみようと思います。その具体的な方法は、googleが提供するLighthouseというツールを活用して、それに則った改善を行うというものです。Lighthouseを使うことで、とても気軽にサイトの評価・採点を行うことができます。指定して実行すると、ページに対する集中的なテストを実行してパフォーマンスに関するレポートを生成できます。Developersgoogleが考えるユーザー体験やサイトの品質の指標に照らしてくれます。客観的に見ても、ユーザーに対してプラスになることが多いように思うので、取り組む価値はあります。chromeでLighthouseを使うLighthouseでサイトのスコアを計測するトップページのスコア記事ページのスコアまとめ:AMPサイトを更に最適化して高スコアをめざす副産物的な意味では、満たす項目が多いほどgoogleの検索結果などで優遇される可能性もありますね。chromeでLighthouseを使う簡単に自分のブログの評価やスコアを計測できます。今どんな状態かを調べてくれます。起動方法chromeのdevtoolのなかにあるlighthouseというツールchromeの右端にある縦に●が3つ並んだところから「開発者ツール」で、devtoolを起動できます。auditsを押すと解析がスタートします。設定は特に何もしなくて大丈夫です。SEOに適した仕様になっているか上記の5項目について採点と、100に近づけるための改善内容を示してくれます。英語ですが、翻訳ツールでちょこちょこやればOKです。App(PWA)などはサイトによっては、あまり重視しない項目もあるかと思います。このブログでは、PWAに関してはあまり知識もなかったので、これを機に学んで可能な限り実装してみたいと思います。Lighthouseでサイトのスコアを計測する今回はトップページと、記事のページを計測してみました。表示される要素が大きく違うので、計測結果に違いがあると考えたためです。このサイトの結果はこんな感じでした。91初期値でそこそこ良いスコアが出ています😄AMPの恩恵でしょうか。まとめ:AMPサイトを更に最適化して高スコアをめざすLighthouseの良さは、明確で具体的な改善案を提示してくれることです。Lighthouseの出す提案に沿って、解決していくだけで、着実にスコアを上げることが可能というわけです。このブログもまだまだ改善の余地あり。次回は、lighthouse最初の項目であり、最も重要なPerformanceの改善に取り組んでみます。コメントはtwitterでお気軽に。