Google Lighthouseの使い方と日本語表示されない場合の対処法

こちらでちょっと説明しましたが、Google LighthouseはWebページの解析ツールです。

Webページについていくつかの項目で評価し、自分のサイトやブログが「適切なパフォーマンスが出せているか、適切な設定ができているか」について確認することができます。

この記事ではLihgthouseのインストール方法から日本語化されていないときの対処法や使い方まで説明していきます。

Google Lighthouseのインストール方法

LighthouseはChromeの拡張機能です。

ですので、まずはこちらからChromeウェブストアに行きます。（外部リンクです）

「Lighthouse」と検索して、「Chromeに追加」してください。

Google Lighthouseの使い方

こちらも簡単です。

まずは計測したいWebページに移ります。

そして、Chromeの右上にある拡張機能一覧から「Lighthouse」を選んでください。もし、一覧にピン留めされていなかったら、拡張機能マークから「Lighthouse」をピン留めしてください。

あとは「Generate report」をクリックするだけです。右上の歯車マークで「どの項目を計測するか？」と「デスクトップorモバイル」の設定ができます。

しばらくすれば計測結果が表示されます。

計測結果の説明

各項目が何を計測しているか説明しておきます。

• Performance（パフォーマンス）：ページの読み込みスピードを診断します。読み込みスピードを妨げている原因も解析してくれます。
• Accessibility（アクセシビリティ）：ページの使いやすさ、見やすさを診断します。文字や背景などのコントラストを計測して見やすさを測ったり、alt属性やname属性をちゃんとつけているかなどを測ります。
• Best Practices（ベストプラクティス）：セキュリティや脆弱性のあるAPIを使っていないかどうかを診断します。HTTPSを使用しているかなどを測ります。
• SEO：SEOの設定が上手くできているか、を診断します。SEOについてはこちらをご覧ください。
• PWA（プログレッシブウェブアプリ）：PWAの設定ができているか、の診断をします。PWAとは、簡単に言うと、ウェブサイトをモバイルアプリのようにスマホにインストールする機能です。

Google Lighthouseが日本語化されていないとき

基本的に日本語化されているようですが、私の環境では日本語化されませんでした。

「英語でも大丈夫！」という人はそのままでも大丈夫ですが、「日本語がいい！」という人は以下の要領で日本語化してください。

日本語化、といいましたがGoogle翻訳すればOKです。

「日本語に翻訳」が出ないときは、以下のようにしてみてください。

Google Lighthouseの計測結果について

Lighthouseの計測結果を見ると、「もっとパフォーマンスを上げないと！」とか「もっとちゃんとSEO設定をしないと！」「PWAの設定は！？」と思うかもしれませんが、正直そこまで血眼になっていい点を取らなくてもいいと思います。

超トップブログでも、全部そこまで計測値が高いわけではないです。

ですので、あまりスコアを上げることに躍起になる必要もないかな、と思います。

ただし、設定を変えたりWordPressのプラグインを導入したときに、極端にパフォーマンスが下がったりしたら対策をすべきかな、と思います。

あとは、そもそもSEOの設定が上手くいっていなかったり、画像のalt属性を書いていなかったり、基本的な部分に問題がある場合は改善すべきかな、と思います。

まとめ

Lighthouseのインストール方法と使い方について説明しました。

Lighthouseは手軽に導入できるので、定期的にパフォーマンスのチェックをしていきましょう。