ページ速度がSEOに与える影響:Lighthouseスコアを90点以上に改善する方法
「ウェブサイトのデザインはきれいなのに、なぜか検索順位が上がらない」という悩みを抱えている担当者の方は少なくありません。その原因の一つとして見落とされがちなのがページ速度です。
Googleは2021年以降、Core Web Vitalsを検索ランキングの評価指標に組み込んでいます。つまり、いくら良質なコンテンツを用意していても、ページの読み込みが遅ければSEO上の評価が下がる可能性があります。本記事では、Googleが提供する無料ツール「Lighthouse」を使ってページ速度を診断し、スコアを90点以上に引き上げるための具体的な手順を解説します。
ページ速度はSEOに本当に影響するのか
まず前提として確認しておきたいのですが、ページ速度はSEOの「ランキング要因の一つ」であり、それだけで順位が大きく変動するわけではありません。ただし、Googleが明言しているとおり無視できない要素です。
それ以上に実務的な観点で重要なのがユーザー体験への影響です。
たとえば、モバイルでページが表示されるまでに3秒以上かかると、直帰率が大幅に上昇するというデータがGoogleから公表されています。直帰率が上がれば滞在時間が短くなり、間接的にSEO評価にも悪影響を与えます。検索順位を上げることと、訪問者にきちんとページを見てもらうことは表裏一体です。
LighthouseとCore Web Vitalsの関係を理解する
LighthouseはGoogleが開発したオープンソースの自動診断ツールで、Chrome DevToolsから誰でも無料で利用できます。パフォーマンス・アクセシビリティ・SEOなど複数の観点からウェブページを評価し、0〜100点のスコアと改善提案を出力します。
パフォーマンススコアに関係する主な指標がCore Web Vitalsです。
- LCP(Largest Contentful Paint):ページ内の最大コンテンツが表示されるまでの時間。2.5秒以内が目標。
- INP(Interaction to Next Paint):ユーザーの操作に対してページが応答するまでの時間。200ミリ秒以内が目標。(2024年3月にFIDから移行)
- CLS(Cumulative Layout Shift):ページ表示中に要素が予期せずズレる度合い。0.1以下が目標。
これら3つの指標が基準値を満たしていると、Lighthouseのパフォーマンスセクションのスコアも自然と上がります。逆にいえば、この3指標を重点的に改善することがスコアアップの近道です。
Lighthouseスコアを90点以上にする具体的な改善手順
1. 画像の最適化(LCP改善に直結)
LCPの原因として最も多いのが、画像サイズの最適化不足です。
- WebP形式に変換する:PNGやJPEGと比較してファイルサイズを大幅に削減できます。WordPressであれば「Imagify」や「ShortPixel」などのプラグインで自動変換が可能です。
loading="lazy"属性を使う:ファーストビューに表示されない画像には遅延読み込みを適用し、初期表示を軽くします。widthとheight属性を明示する:サイズを指定することでブラウザが表示領域を事前確保でき、CLSの改善にも役立ちます。- CDNを活用する:画像配信にCDN(コンテンツデリバリネットワーク)を使うと、ユーザーの地理的な距離によるレイテンシを抑えられます。
2. レンダリングブロックリソースの削除(LCP・全体スコアの改善)
CSSやJavaScriptファイルが多いと、ブラウザがHTMLを解析する前にそれらを読み込もうとして表示が遅れます。
- 不要なCSSを削除・圧縮する:使われていないCSSルールは「PurgeCSS」などで除去できます。
- JavaScriptを非同期読み込みにする:
<script>タグにdeferまたはasync属性を付けることで、HTMLの解析をブロックしなくなります。 - クリティカルCSSをインライン化する:ファーストビューの描画に必要なCSSだけをHTMLに直接埋め込み、残りは非同期で読み込む手法です。
3. サーバーの応答時間を改善する(TTFB対策)
TTFB(Time to First Byte)はサーバーがリクエストを受け取ってから最初のデータを返すまでの時間です。これが遅いとすべての指標に悪影響が出ます。
- キャッシュを設定する:静的コンテンツにブラウザキャッシュを設定し、再訪問時の読み込みを軽減します。WordPressでは「W3 Total Cache」「WP Super Cache」が代表的です。
- ホスティング環境を見直す:共有サーバーを利用している場合、VPSや専用サーバーに変更するだけで大幅に改善することがあります。
- HTTPSとHTTP/2の利用を確認する:HTTP/2は複数リソースを並列で取得できるため、表示速度の向上に寄与します。
4. フォントの読み込みを最適化する(CLS・LCP改善)
Googleフォントなど外部フォントを使用しているサイトで見落とされやすいポイントです。
font-display: swapを指定する:フォントが読み込まれるまでシステムフォントで代替表示させ、コンテンツを早く見せます。- フォントファイルをセルフホスティングする:外部サーバーへのリクエストをなくすことで応答時間が短縮されます。
5. JavaScriptの実行時間を削減する(INP改善)
INPが遅い場合、重いJavaScriptが主な原因であることが多いです。
- 不要なプラグインやスクリプトを削除する:特にWordPressは使っていないプラグインが蓄積しがちです。管理画面から定期的に棚卸しをしてください。
- メインスレッドの処理を分割する:長時間実行するJavaScriptタスクは「Web Workers」を使ってバックグラウンドで処理させる方法があります。
- タグマネージャーを整理する:Googleタグマネージャーに大量のタグが溜まっていると、それだけでINPが悪化します。
改善前後のスコアを正しく測定するポイント
Lighthouseはブラウザ上で実行するため、測定タイミングや環境によってスコアがブレることがあります。精度の高い診断には以下を意識してください。
- PageSpeed Insights(PSI)を併用する:実際のユーザーデータ(フィールドデータ)と、ラボ環境のデータ両方を確認できます。
- モバイルスコアを優先する:Googleはモバイルファーストインデックスを採用しているため、モバイルのスコアを基準にしてください。
- シークレットモードで測定する:拡張機能の影響を排除した状態でLighthouseを実行することで、より正確な結果が得られます。
- 複数回測定して平均を取る:ネットワーク状況によってスコアが変動するため、3〜5回測定した平均値を参考にしましょう。
まとめと次のステップ
ページ速度の改善は一度やれば終わりではなく、コンテンツの追加や機能拡張のたびにスコアが下がることがあります。月に一度程度、PageSpeed InsightsでチェックするルーティンをSEO運用の中に組み込んでおくと安心です。
改善の優先順位としては、①画像の最適化 → ②サーバーキャッシュの設定 → ③不要なJS・CSSの削除の順で着手すると、多くのサイトで効果が出やすいです。
「自社サイトのLighthouseスコアを確認したいが、何から手をつければいいかわからない」という場合は、私たちサイプレスにご相談ください。ページ速度の診断からCore Web Vitalsの改善、SEO全体の戦略立案まで、中小企業の実情に合わせた形でサポートしています。まずは現状把握だけでも、お気軽にお声がけいただければ幸いです。
Related Pages
関連するサービス・ガイド
株式会社サイプレス 編集部
MEO・SEO・AIO・Web集客支援の専門家チームが、実践に基づいた情報を発信しています。東京都葛飾区を拠点に全国のビジネスを支援。