「LCPの問題: 2.5秒超」の原因と改善方法を解説

「LCPの問題: 2.5秒超」の原因と改善方法を解説

ある日突然、Googleサーチコンソールから届いた「LCPの問題: 2.5秒超」の警告。

何が問題なのか分からず、不安になっていませんか?

この記事では、専門知識がなくても3分で原因を特定し、30分で改善に着手できる具体的な方法を、初心者にも分かりやすく解説します。

LCPの問題: 2.5秒超とは?

LCP(Largest Contentful Paint)の問題: 2.5秒超とは、Googleサーチコンソールで表示される警告で、ウェブページの最も大きなコンテンツ(メイン画像やテキストブロック)の表示完了に2.5秒以上かかっている状態を指します。

Googleは、ユーザー体験の指標として2.5秒以内を「良好」と評価しており、これを超えるとSEO評価が下がり、検索順位の低下やユーザーの離脱率上昇につながります。

主な原因は、重い画像ファイル、最適化されていないCSS/JavaScript、サーバー応答の遅延などです。この問題を放置すると、サイトのトラフィックやコンバージョン率に悪影響を及ぼすため、早急な改善が必要です。

そもそもLCPって?評価基準は?

LCP(Largest Contentful Paint)とは、「ページ内で最も大きなコンテンツが表示されるまでの時間」を測る指標です。

ユーザーが「ページが読み込まれた」と体感する速度を数値化したもので、Googleが重視するCore Web Vitals(コアウェブバイタル)の1つです。

つまり、ファーストビュー(最初に見える画面)で最も目立つコンテンツの表示速度がLCPです。

この数値が遅いと、ユーザーは「重いサイト」と感じ、すぐに離脱してしまいます。

参考記事:LCPとは?

LCPの評価基準

評価

秒数

判定

良好

2.5秒以内

SEO評価◎

改善が必要

2.5〜4.0秒

要対策

不良

4.0秒超

SEO悪影響

LCPは秒数で測定され、Googleは以下の3段階で評価します。

良好(2.5秒以内): SEO評価が高く、ユーザー体験も良好。この基準を目指しましょう。

改善が必要(2.5〜4.0秒): 対策が必要な状態。放置すると検索順位に悪影響が出始めます。

不良(4.0秒超): 深刻な問題。ユーザーの離脱率が大幅に上昇し、SEO評価も低下します。

この評価は、実際のユーザーのアクセスデータ(フィールドデータ)に基づいており、特にモバイル環境での速度が重視されます。

2.5秒はギリギリの合格ラインなので、余裕を持って2.0秒以下を目標にすることが理想的です。

LCPの対象となる要素

LCPで測定されるのは、ビューポート内(画面に最初に表示される範囲)で最も大きな要素です。

具体的には以下が対象となります。

  • 画像<img>タグ)
  • 動画のサムネイル
  • 背景画像(CSS)
  • 大きなテキストブロック

ファーストビュー外(スクロールしないと見えない部分)の要素は測定対象外です。

そのため、メインビジュアルやヒーロー画像が最もLCPに影響します。多くの場合、サイトトップの大きな画像がLCP要素となっています。

LCPが2.5秒を超えて起きる問題

LCPが2.5秒を超えると、さまざまな問題が発生します。

SEOの順位、コンバージョン低下や離脱率の上昇など大きく影響を及ぼします。

SEO順位の低下

LCPが2.5秒を超えると、ページエクスペリエンスの評価が下がり、検索結果での表示順位が低下します。

実際のデータでは、LCP問題があるサイトは平均10〜20位のランキング下落が報告されています。

特に競合が多いキーワードでは、わずかな速度差が1ページ目と2ページ目の分かれ目になります。

さらに、Googleは「モバイルファーストインデックス」を採用しているため、モバイルでのLCP速度が特に重要です。

検索流入の減少は、サイト全体のトラフィック喪失に直結するため、早急な改善が必要です。

コンバージョン率の急降下

ページの表示速度とコンバージョン率(CVR)には強い相関関係があります。

Google の調査によると、ページ読み込み時間が1秒から3秒に増えると、直帰率が32%上昇します。

さらに、表示速度が1秒遅れるごとに、コンバージョン率は約7%低下するというデータがあります。

Amazon の事例では、わずか0.1秒の遅延で売上が1%減少すると報告されています。

特にECサイトや申込フォームでは、LCPが4秒を超えるとCVRが最大40%も悪化します。

ユーザーは「遅い=信頼できない」と判断し、購入や問い合わせを諦めてしまうのです。速度改善は、直接的な売上向上施策と言えます。

ユーザー離脱率の上昇

ページの読み込みが遅いと、ユーザーは待ちきれずにサイトを離れてしまいます

Google の調査では、モバイルページの読み込みに3秒以上かかると、53%のユーザーが離脱することが判明しています。

さらに、5秒を超えると離脱率は90%まで跳ね上がります。

Pingdom の分析によると、ページ読み込み時間が2秒から5秒に増えると、直帰率は50%から75%へ急上昇します。

わずか3秒の違いで、訪問者の4分の1が失われる計算です。

特にモバイルユーザーは忍耐力が低く、外出先での閲覧では回線速度も不安定なため、LCP問題の影響を強く受けます。

せっかく広告費をかけて集客しても、遅いページでは入口で顧客を逃がしている状態なのです。

LCP問題を特定する方法と手順

サーチコンソールで警告を受け取った後、以下の手順で問題を特定します。

Step1:Search Consoleで問題ページを確認

まずはSearch Consoleで問題のページを確認するところから始めます。

手順は下記の通り。

  1. Google Search Consoleにログイン
  2. 左メニューから「エクスペリエンス」→「ウェブに関する主な指標」をクリック
  3. モバイル」タブを選択(モバイルが優先)
  4. 改善が必要」または「不良」の項目をクリック
  5. 問題のあるURL一覧が表示されます
  6. 代表的なURL(トップページや主要ページ)をコピー

Google Search Consoleにログインし、左メニューの「エクスペリエンス」から「ウェブに関する主な指標」を開きます。

「モバイル」タブで「改善が必要」または「不良」をクリックすると、LCP問題のあるURL一覧が表示されます。

モバイルの方がアクセスも多く影響力も高いため、モバイルを先に確認しましょう。

モバイル確認後にPCも別途確認していくと良いでしょう。

ここで重要なのは、実際のユーザーデータに基づいた評価であることです。

複数ページが表示される場合は、トップページやアクセス数の多い主要ページのURLをコピーしましょう。

Step2:PageSpeed Insightsで原因分析

Step1でコピーしたURLをPageSpeed Insightsに貼り付けて「分析」をクリックします。約30秒で結果が表示されます。

  1. PageSpeed Insightsにアクセス
  2. コピーしたURLを貼り付けて「分析」をクリック
  3. 「モバイル」のスコアを確認
  4. 「Largest Contentful Paint」の秒数をチェック
  5. 下にスクロールして「診断」セクションを確認
  6. 「LCP要素」の項目で、どの画像やテキストが原因か特定

まず「モバイル」タブのスコアを確認し、「Largest Contentful Paint」の秒数をチェックしましょう。

次に下にスクロールして「診断」セクションへ進みます。

ここで最も重要なのが「LCP要素」の項目です。

実際にどの画像やテキストが表示を遅らせているか、具体的な要素が表示されます。

多くの場合、ヘッダー画像やメインビジュアルが原因です。

さらに「改善できる項目」では、「画像要素の最適化」「レンダリングを妨げるリソース」などの具体的な問題点が示されます。

この情報が次の改善作業の指針となります。

Step3: 原因を判別

PageSpeed Insightsの診断結果から、LCP問題の主な原因を3つのカテゴリーに分類します。

主に下記がよくある主な原因になります。

  • 「画像要素の最適化」→ 画像が原因
  • 「レンダリングを妨げるリソース」→ CSS/JavaScriptが原因
  • 「サーバーの応答時間」→ サーバー/ホスティングが原因

「画像要素の最適化」「適切なサイズの画像」が表示される場合。ファイルサイズが大きい、形式が最適化されていないことが原因です。

「レンダリングを妨げるリソース」「使用していないJavaScript」が表示される場合。コードの読み込みがページ表示をブロックしています。

「サーバーの応答時間を短縮」が表示される場合。ホスティング性能やTTFB(初期応答時間)に問題があります。

ほとんどのケースで画像が原因です。

まずは画像最適化から着手すると、最も効果的に改善できます。

【画像が原因】の改善方法(最重要)

まずLCPを遅くさせる大きな要因として画像があります。

まずはここから改善を行っていきましょう。

参考記事:画像の最適化(速度改善)

画像形式の最適化

画像形式を変更するだけで、画質を落とさず30〜80%のファイルサイズ削減が可能です。

従来のJPEG/PNG形式から、次世代フォーマットのWebPに変換すると、読み込み速度が劇的に向上します。

さらに新しいAVIF形式なら、WebPよりさらに20%軽量化できます。

画像形式の比較

形式

サイズ

対応状況

推奨度

JPEG

100%

全ブラウザ◎

△ 旧形式

PNG

120%

全ブラウザ◎

△ 透過以外不向き

WebP

30〜50%

95%以上◎

推奨

AVIF

20〜40%

90%以上◯

2025年注目

WordPressであれば、WWW Image Optimizerプラグインを導入、Shopifyの場合はAvif/WebP Image Optimizerアプリを導入しましょう。

実装コード

<picture>
  <source srcset="image.webp" type="image/webp">
  <img src="image.jpg" alt="説明">
</picture>

表示させるためのコードは上記を参考に設置してみてください。

WebP非対応ブラウザには自動でJPGが表示されます。

画像サイズの最適化

表示サイズより大きすぎる画像は、無駄なデータ通信でLCPを悪化させます。適切なサイズに調整することが重要です。

適正サイズの計算式: 表示サイズ × デバイスピクセル比(DPR)

例えば、800pxで表示する画像なら、Retina対応で1600pxが最適です。

4000pxの画像を使うのはデータの無駄遣いになります。

レスポンシブ画像を実装すれば、デバイスに応じて最適なサイズを自動配信できます。

レスポンシブ画像のソース例

<img srcset="small.jpg 480w, medium.jpg 800w, large.jpg 1200w"
     sizes="(max-width: 600px) 480px, 800px"
     src="medium.jpg" alt="説明">

PC向けは表示幅の2倍、スマホ向けは750〜1125pxで十分です。

Photoshop、Canva、オンラインリサイズツールで簡単に調整可能。適切なサイズ調整だけで、画像の読み込み時間を50〜70%削減できます。

画像圧縮の実施

画像のファイルサイズを圧縮することで、見た目の品質を保ちながら読み込み速度を大幅改善できます。

圧縮には2種類あります。ロスレス圧縮は画質劣化なしで10〜30%削減、ロッシー圧縮はわずかな劣化で50〜80%削減できます。

写真には品質70〜85%のロッシー圧縮が最適で、肉眼では劣化がほぼ分かりません。

おすすめツールは、オンラインならTinyPNGSquoosh、WordPressならShortPixelやEWWW Image Optimizerです。

実例では、2MBの画像を200〜400KBまで削減でき、読み込み時間が80%短縮されます。

圧縮は最も簡単で効果的なLCP改善策です。

画像の遅延読み込みの実装

遅延読み込み(Lazy Loading)は、画面外の画像を後から読み込む技術で、ファーストビュー以外の画像を後から読み込ませることで表示速度が改善されます。

ただ、使い方を間違えると逆効果になります。

ポイントとしては、ファーストビュー(最初に見える範囲)の画像には適用しないことです。

LCP要素となるメイン画像に遅延読み込みを設定すると、表示が遅れてLCPが悪化します。

正しい実装

<!-- メイン画像: 優先読み込み -->
<img src="hero.jpg" fetchpriority="high" alt="メイン">

<!-- 下部画像: 遅延読み込み -->
<img src="content.jpg" loading="lazy" alt="説明">

WordPress 5.5以降は標準で遅延読み込みが有効なので、LCP画像を除外する設定が必須です。

適切に実装すれば、初期読み込みが30〜50%高速化します。

参考記事:遅延読み込みとはLCPリクエストの検出とは

CDNの活用

CDN(Content Delivery Network)は、世界中のサーバーから最も近い場所でコンテンツを配信し、画像の読み込み速度を劇的に改善します。

Cloudflareなどのサービスの導入で実装が可能です。

主要CDNサービス

Cloudflare(無料プランあり)

最も人気。無料で基本的なCDN機能が使え、設定も簡単。画像最適化機能も搭載。

下記のようなサービスもあります。

画像特化CDN

  • Cloudinary - 自動最適化、形式変換
  • imgix - デバイス別の最適配信
  • Cloudflare Images - 高速画像配信

海外からのアクセスでは50〜70%の高速化、国内でも20〜30%の改善が期待できます。特にグローバルサイトには必須です。

参考記事:CDNとは

【CSS・JavaScript起因】の改善方法

画像を最適化してもLCPが改善しない場合、CSS・JavaScriptがページの表示をブロックしている可能性があります。

これらのファイルは、ブラウザが読み込みと実行を完了するまで、画面表示を遅らせる「レンダリングブロック」を引き起こします。

それぞれの改善方法を紹介していきます。

参考記事:レンダリングブロックとは

CSS最適化

CSSファイルは、読み込みと解析が完了するまでページ表示をブロックします。

最適化で大幅な高速化が可能です。

下記にそれぞれ最適化の方法をご紹介します。

参考記事:CSSの高速化

クリティカルCSSのインライン化

ファーストビュー(最初に見える範囲)の表示に必要なCSSだけをHTML内に直接記述し、残りは後から読み込む手法です。

これにより、初期表示を待たせずに画面を表示できます。

<style>
  /* ファーストビューに必要なCSSのみ */
  .hero { display: block; height: 500px; }
</style>
<link rel="preload" href="style.css" as="style" 
      onload="this.rel='stylesheet'">

通常、外部CSSファイルの読み込み完了まで画面は真っ白ですが、クリティカルCSSをインライン化すれば即座に表示されます。

Critical CSS Generatorで自動抽出でき、WordPressならAutoptimizeプラグインで簡単に実装可能です。LCPを0.5〜1秒改善する効果があります。

未使用CSSの削除

Webページには、実際には使われていないCSSコードが大量に含まれていることがあります。これらを削除すれば、ファイルサイズを大幅に削減できます。

テーマやフレームワーク(Bootstrap等)を使うと、実際に使うのは全体の20〜40%程度

残り60〜80%は無駄なコードです。これを削除すれば、CSSファイルサイズが30〜60%削減できます。

不要なCSSを確認するには、Chrome DevToolsの「Coverage」タブで、F12キーを押して開き、リロードすると未使用コード(赤色表示)が一目で分かります。使用率50%以下なら削減の余地が大きいです。

WordPressならAutoptimizeやAsset CleanUpプラグインで自動削除。開発者はPurgeCSSをビルドプロセスに組み込むと効率的です。

CSS の圧縮(Minify)

CSS圧縮(Minify)とは、改行・スペース・コメントを削除してファイルサイズを縮小する手法です。機能は一切変わらず、コードが1行にまとまります。

ファイルサイズが20〜40%削減され、読み込み時間が短縮されます。

WordPressユーザーには、プラグイン導入が最も簡単です。

WP Rocketなら設定画面で「CSSファイルを縮小化」にチェックを入れるだけ、Autoptimizeなら「CSSコードを最適化」を有効化するだけで完了します。

一度設定すれば、以降は自動的にすべてのCSSが圧縮されます。

手動で圧縮する場合は、CSS MinifierなどのオンラインツールにCSSコードをコピペして「Minify」をクリックし、圧縮されたコードをダウンロードして元ファイルと置き換えます。

プログラマーや開発環境がある方は、GulpやWebpackなどのビルドツールに圧縮プラグインを組み込めば、ビルド時に自動圧縮されます。

WordPress以外のサイトでもプラグイン導入が最速で、技術知識不要で即効果が出ます。

JavaScript最適化

JavaScriptは、CSSよりもさらに深刻なレンダリングブロックを引き起こします。

defer/async属性を追加するだけで劇的に改善するケースが多く、難しいコード変更は不要です。

また、第三者スクリプト(外部サービスのコード)を遅延読み込みすることで、LCPを1〜3秒改善できます。

下記で具体的な方法を紹介します。

参考記事:JavaScript最適化

defer/async属性の使い分け

JavaScriptの読み込み方法を変えるだけで、ページ表示速度が劇的に改善します。

通常の<script>タグはHTML解析をブロックしますが、defer/async属性を追加すると非同期読み込みが可能です。

読み込み方法の違い

読み込み方法

HTML解析

ダウンロード

実行タイミング

実行順序

通常(属性なし)

停止

順番待ち

即座に実行

保証

defer

継続

並行処理

HTML解析後

保証

async

継続

並行処理

DL完了次第

不定

使い分けの基準例のソース

<script src="analytics.js" defer></script>  <!-- DOM解析後に実行 -->
<script src="ads.js" async></script>  <!-- 非同期で実行 -->

defer: jQueryなど他のスクリプトに依存する場合
async: Google Analytics、広告タグなど独立したスクリプト

適切に使い分ければ、初期表示を0.5〜2秒短縮できます。

フォントの最適化

カスタムフォント(Googleフォント、Adobe Fontsなど)は、読み込み完了までテキストが表示されないため、LCPを悪化させる原因になります。

FOIT(Flash of Invisible Text)はフォント読み込み完了までテキストが完全に非表示になります。

LCP要素がテキストの場合、数秒間何も表示されない致命的な状態です。

FOUT(Flash of Unstyled Text)は最初にシステムフォントで表示され、カスタムフォント読み込み後に切り替わります。

文字が「パッ」と変わるため、ユーザー体験が悪化します。

特にFOITは深刻で、日本語フォントは容量が大きい(2〜5MB)ため、モバイル回線では読み込みに3〜5秒かかることも。

その間、ページが真っ白に見えてしまいます。適切な最適化が必須です。

font-display: swap の実装

フォントのダウンロード中はシステムフォント(代替フォント)で即座に表示し、カスタムフォントの準備ができたら自動的に切り替えます。

これにより、FOITによる「真っ白な画面」を完全に防げます。

@font-face {
  font-family: 'CustomFont';
  src: url('font.woff2') format('woff2');
  font-display: swap;  /* すぐ代替フォントで表示 */
}

Googleフォントの最適化

Googleフォントを使用している場合は、URLに&display=swapを追加するだけです:

<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap" rel="stylesheet">

preconnectでサーバー接続を事前確立し、display=swapでFOITを防止します。

これだけでLCPが0.5〜1秒改善します。

【サーバー・ホスティング起因】の改善方法

画像やコードを最適化しても改善しない場合、サーバーやホスティング環境に根本的な問題がある可能性があります。

PageSpeed Insightsで「サーバーの応答時間を短縮」「初期サーバー応答時間を短縮」と表示される場合、TTFB(Time To First Byte)が遅く、ブラウザがデータを受け取り始めるまでに時間がかかっています。

これはすべてのコンテンツ読み込みの起点なので、ここが遅いとLCP全体に悪影響を及ぼします。

下記の対策で改善を行っていきましょう。

参考記事:サーバーの速度改善TTFBの改善方法

高速サーバーを使用

サーバーの性能は、LCPに直接的な影響を与えます。特に月額500円以下の格安共有サーバーでは、他のユーザーとリソースを共有するため、アクセスが集中すると応答が遅延します。

格安サーバーから高速サーバーへ移行するだけで、TTFBが1.5秒→0.3秒に短縮し、LCP全体が1〜2秒改善するケースが多数報告されています。

LCP改善に最適なサーバーを選ぶには、以下の基準をチェックしましょう。

必須チェック項目

  1. SSD/NVMe SSD搭載
  2. HTTP/2・HTTP/3対応
  3. PHPバージョン
  4. LiteSpeed/Nginx採用
  5. 国内サーバーロケーション
  6. 無料SSL・自動バックアップ

これらの条件と費用が合えば専用サーバーの活用をおすすめします。

サーバー設定の最適化

サーバーを変更せずとも、設定を見直すだけでTTFBを改善できます。

特にWordPressサイトでは効果絶大です。

主要な最適化項目

  1. PHPバージョンを最新に更新
  2. データベースの最適化
  3. オブジェクトキャッシュの有効化
  4. Gzip/Brotli圧縮の有効化

テキストファイルを圧縮して転送量を削減。サーバー設定で有効化できます。

これらの設定だけで、TTFBが0.3〜0.5秒短縮可能です。

参考記事:データベースの最適化

キャッシュ戦略

キャッシュとは、一度生成したページを保存し、再利用する仕組みです。毎回サーバーで処理するより圧倒的に高速になります。

ブラウザキャッシュの対応

ブラウザキャッシュは、画像・CSS・JavaScriptなどの静的ファイルをユーザーのブラウザに保存し、再訪問時に再ダウンロードを省略する仕組みです。

初回訪問時は通常通りダウンロードしますが、2回目以降はローカルから読み込むため、読み込み時間が80〜90%短縮されます。リピーターのLCPが劇的に改善します。

.htaccess の設定コード

<IfModule mod_expires.c>
  ExpiresActive On
  ExpiresByType image/jpg "access plus 1 year"
  ExpiresByType text/css "access plus 1 month"
</IfModule>

WordPressならWP RocketやLiteSpeed Cacheプラグインで自動設定可能。

画像は1年、CSS/JSは1ヶ月程度のキャッシュ期間が推奨されます。

サーバーサイドキャッシュ

サーバーサイドキャッシュは、動的に生成されるHTMLページを保存し、再利用する仕組みです。WordPressなどのCMSでは、毎回データベースにアクセスしてページを生成しますが、キャッシュがあれば保存済みのHTMLをそのまま返せます。

データベースへの問い合わせが不要になるため、サーバー負荷が大幅に減り、TTFBが劇的に短縮します。効果は絶大で、応答時間が1.0秒→0.2秒になるケースも。

方法としてCDNで配信するだけで超高速できます。

ワードプレスの場合は、WP Rocketなどのプラグインでの対応もできます。

HTTP/2・HTTP/3の有効化

HTTP/1.1には深刻な制限があります。

1つの接続で1ファイルずつしかダウンロードできないため、画像やCSS/JavaScriptが多いページでは順番待ちが発生し、表示が遅延します。

ブラウザは最大6接続までしか開けないため、ファイル数が増えるほど待ち時間が長くなります。

HTTP/2・HTTP/3なら無制限に並列ダウンロードでき、この問題が解消されます。

HTTP/3はさらにUDPベースで通信が安定し、モバイル環境でも高速です。

プロトコルの比較

プロトコル

速度

並列処理

推奨度

HTTP/1.1

遅い

6接続まで

旧世代

HTTP/2

高速

無制限

標準

HTTP/3

最速

無制限+改善

最新

レンタルサーバーであれば、各管理画面でどの設定になっているか確認ができます。

VPSや自前サーバーの場合、SSL/TLS必須でモジュール有効化が必要です。

HTTP/2・HTTP/3はHTTPS通信でのみ動作するため、Let's Encryptで無料SSL証明書を導入しましょう。

HTTP/2化だけでLCPが20〜40%短縮する事例が多数報告されています。

参考記事:HTTP/3とは?HTTP/2との違いは?

Gzip/Brotli圧縮

HTML、CSS、JavaScriptなどのテキストファイルは、圧縮せずに配信すると無駄にデータ量が多くなり、LCPを悪化させます。

500KBのHTMLファイルをそのまま送信すると、モバイル回線では数秒かかります。

特にCSS/JavaScriptファイルが複数あると、合計で数MBになることも。

圧縮技術で転送量を削減しましょう。

圧縮方式の比較

圧縮方式

削減率

対応ブラウザ

推奨度

なし

0%

-

非推奨

Gzip

60〜70%

99%以上

標準

Brotli

70〜80%

95%以上

最新

Brotli圧縮はGzipより15〜25%さらに圧縮率が高いため、2025年の推奨方式です。

有効化手順

①対応状況を確認

Chrome DevToolsのNetworkタブでContent-Encoding: gzipまたはbr(Brotli)を確認します。

②サーバー側で有効化

Apache (.htaccess):

<IfModule mod_deflate.c>
  AddOutputFilterByType DEFLATE text/html text/css application/javascript
</IfModule>

Nginx:

gzip on;
gzip_types text/css application/javascript;
brotli on;
brotli_types text/css application/javascript;

WPの場合は、WP Rocketプラグインで自動有効化ができます。

圧縮により転送量が70%削減され、LCPが0.5〜1秒短縮します。

「LCPの問題: 2.5秒超」 のよくある質問

Q1: LCPが2.5秒ちょうどでも改善すべきですか?

A: はい、改善を推奨します。2.5秒はギリギリの合格ラインであり、少しの変動で「改善が必要」に転落する可能性があります。

理想は2.0秒以下です。余裕を持った数値を目指すことで、サーバー負荷やネットワーク状況の変動にも対応でき、安定した評価を維持できます。

特にモバイル環境は不安定なため、余裕を持たせることが重要です。

Q2: モバイルだけLCPが悪い場合の対処法は?

A: モバイル特有の問題に焦点を当てましょう。主な原因は以下の3つです。

  1. 画像サイズが大きすぎる: モバイル表示なら750〜1125pxで十分。レスポンシブ画像で最適化しましょう。
  2. モバイル回線の速度: 遅延読み込みの除外設定を確認。ファーストビュー画像にloading="lazy"が付いていないかチェック。
  3. 第三者スクリプトの影響: モバイルでは特に重い。Flying Scriptsなどで遅延読み込みを徹底してください。

PageSpeed Insightsの「モバイル」タブで具体的な改善提案を確認し、優先的に対処しましょう。

Q3: 改善したのにSearch Consoleで反映されないのはなぜ?

A: Googleのクロールとデータ収集には28日程度かかります。改善直後に結果が出なくても焦る必要はありません。

対処手順:

  1. PageSpeed Insightsで改善を確認(即座に反映)
  2. Search Consoleで「修正を検証」をクリック
  3. 検証プロセスが開始(数日〜数週間)
  4. 十分な実ユーザーデータが収集されるまで待つ

改善効果は確実に出ているので、1〜2ヶ月は経過観察しましょう。焦って何度も変更すると、かえって混乱します。

Q4: 費用をかけずに改善できますか?

A: はい、無料で大幅改善が可能です。以下の施策は費用ゼロで実施できます。

無料でできる対策

  • 画像のWebP変換
  • 画像圧縮(TinyPNG)
  • 画像サイズの適正化
  • defer/async属性の追加
  • 未使用CSS/JavaScriptの削除
  • ブラウザキャッシュ設定(.htaccess編集)
  • WordPress無料プラグイン(EWWW、LiteSpeed Cache)

有料でさらに効果的

  • 高速サーバー移行(月900円〜)
  • WP Rocketプラグイン(年49ドル)
  • landinghubの導入

まずは無料施策でLCPを1〜2秒改善できるケースが多いです。それでも不十分なら有料オプションを検討しましょう。

Q7: どのくらいの期間で効果が出ますか?

A: 施策実施直後から効果は出始めますが、Search Consoleでの反映には時間がかかります

タイムライン:

  • 即座(数分): PageSpeed Insightsのスコア改善
  • 数日後: 実ユーザーの体感速度向上、直帰率改善
  • 1〜2週間後: Google Analyticsで滞在時間・CVR改善確認
  • 2〜4週間後: Search Consoleで「良好」判定(検証プロセス)
  • 1〜2ヶ月後: 検索順位への影響が顕在化

重要: Googleは28日間の実ユーザーデータを収集して判定するため、Search Consoleの反映には最低1ヶ月必要です。焦らず継続的に監視しましょう。

Q8: 画像を減らさずにLCPを改善できますか?

A: はい、画像数を減らさずに改善可能です。重要なのは「数」ではなく「最適化」です。

画像を残したまま改善する方法:

  1. WebP形式に変換(30〜80%軽量化)
  2. 適切なサイズに調整(表示サイズの2倍まで)
  3. 圧縮率70〜85%で圧縮
  4. CDN経由で配信
  5. ファーストビュー外は遅延読み込み

これらを実施すれば、画像の見た目や数は変えずに、読み込み時間を50〜80%削減できます。デザインを犠牲にする必要はありません。

Q9: 動画を埋め込んでいるとLCPは悪化しますか?

A: 埋め込み方次第です。YouTube等の動画は適切に実装すれば影響を最小化できます。

悪化する例

  • <iframe>をそのまま埋め込み(重い)
  • 自動再生設定
  • 複数動画を同時読み込み

改善方法:

  1. サムネイル画像+クリック後に動画読み込み(Lazy Load)
  2. YouTubeならlite-youtube-embedライブラリ使用
  3. ファーストビュー外に配置
Copy<!-- 軽量な埋め込み方法 -->
<lite-youtube videoid="動画ID"></lite-youtube>

WordPressならWP YouTube Lyteプラグインで自動最適化できます。これだけで動画埋め込みによる遅延を90%削減可能です。

Q10: 広告タグがLCPを悪化させている場合の対処法は?

A: 広告は収益に直結するため削除できませんが、読み込みタイミングを調整することで改善できます。

対処法

  1. ファーストビュー外に配置: スクロールしないと見えない位置に
  2. 遅延読み込み: ユーザー操作後に読み込み(Flying Scripts)
  3. 広告数の削減: 本当に必要な枠だけに絞る
  4. Lazy Load対応: Google AdSenseなら自動遅延読み込み有効化

Google AdSense設定:

  • 「自動広告」→「ページ読み込み」を「遅延」に設定

注意: 広告の表示回数・収益は若干減る可能性がありますが、ユーザー体験が向上し、離脱率低下で結果的に収益増加するケースも多いです。A/Bテストで検証しましょう。

記事を書いた人

井上寛生

井上寛生

LandingHub 執行役員 / 事業責任者 / 技術責任者

大学院では情報工学を専攻し、修了後に株式会社TeNへ新卒入社。当時は社内唯一のエンジニアながら、開発部門をゼロから立ち上げ、採用・育成を一手に担い、全員が未経験からスタートした精鋭エンジニアチームを組成。2021 年にはWEBサイト高速化プラットフォーム「LandingHub」を立ち上げ、プロダクトオーナー兼事業責任者として企画・開発・グロースを牽引。現在は執行役員として、会社の技術戦略と事業成長の双方をリードしている。
コラム一覧に戻る