Shopifyのコア ウェブ バイタルを改善する: ストアオーナー向け実践ガイド

ストアのコア ウェブ バイタルを無視してきたなら、その期限は終わりました。コア ウェブ バイタルはSEOランキングに直接影響を与え、ストアが検索結果に表示されるかどうかを左右します。数字は明白です。2025年のWeb Almanacによると、モバイルサイトのうちコア ウェブ バイタル全3項目に合格しているサイトは48%で、2024年の44%、2023年の36%から上昇しています。基準は四半期ごとに上がっています。ストアがこれをクリアしていなければ、クリアしている競合他社に遅れをとっています。

実際の測定内容

2026年もGoogleはLCP、INP、CLSを3つのコア ウェブ バイタル指標として使用しています。閾値は変わっていません。LCPは2.5秒以下、INPは200ミリ秒以下、CLSは0.1以下です。変わったのはGoogleがそれらのスコアの背後にあるデータをどのように重み付けするかです。Googleはランキング判定において、ラボデータよりも実ユーザー場データ(CrUX)の重み付けを増やしています。Shopifyストアの場合、実際のモバイルユーザー体験が合成テストスコアよりも重要になったということです。

この区別は重要です。Shopifyの管理画面のSpeed Scoreは、1回のシミュレーション訪問のLighthouseラボデータに基づいています。一方、Google Search ConsoleのコアウェブバイタルはChromeユーザーの実データを28日間のローリングウィンドウで使用しています。Lighthouseシミュレーションとは異なり、実ユーザーはさまざまなデバイス、ネットワーク速度、インタラクションパターンを持つため、これらの数値は大きく異なる場合があります。

良いニュースもあります。2025年12月現在、LCPとINPはChrome、Firefox、Safari、Edgeなどすべての主要ブラウザで「Baseline Newly Available」(新たに利用可能なベースライン)となっています。これにより、リアルユーザーモニタリング(RUM)ツールはChromeユーザーだけでなく、ほぼすべての訪問者からCoWVデータを収集できるようになりました。iOS トラフィックが多いストアにとって、これは重要な変化です。

コア ウェブ バイタル一覧: 3つの指標を比較

ビジネスケース(明確な数字)

修正に進む前に、これになぜ時間をかけるべきか説明します。Googleのデータは1秒の遅延がコンバージョンを最大7%低下させ、53%のモバイル訪問者は3秒以上かかるページを離脱することを示しています。Shopifyのチーム自体がこれを大規模で検証しています。彼らは3つのコア ウェブ バイタルとアクティブに販売しているShopifyストア全体でのコンバージョン間の関係を分析し、2026年1月から2月の転換期に28日間のパフォーマンスバケットを分け、その後、集約されたパフォーマンスとすべてのバケット内のストアの中央値コンバージョン率との関係を調べました。結果は以下の通りです。成長しているストアはスピードとコンバージョン間に強い関係があります。ストアがスケーリングするにつれ、アプリ、カスタマイズ、統合を追加し、それぞれがパフォーマンスに影響を与える可能性があり、これらの追加の累積効果がデータに表示されます。

Shopifyビジネスの場合、完全なCLSスコアを追い求めるよりも、LCPとINPの改善を優先する方が、利益に大きな影響を与える可能性が高いです。

Shopifyの最大のパフォーマンス低下要因

1. アプリの肥大化(最大の犯人)

アプリからのサードパーティスクリプト肥大化は、依然としてコア ウェブ バイタルに不合格になる最大の原因です。その数学は容赦ありません。平均して、新しいShopifyアプリは各ページ読み込みに50KBから150KBのJavaScriptを追加します。LCP閾値のちょうど境界線上にあるストア(2.3～2.5秒)の場合、1つのアプリのインストールでそれを超える可能性があります。

修正は地味ですが効果的です。アプリを1つずつ無効化し、PageSpeed InsightsでINPとLCPへの影響を測定することでアプリを監査します。不要なアプリを削除し、以前にアンインストールされたアプリからの残りのコードについてテーマファイルを確認してください。

2. ヒーロー画像とLCP

LCPのGoogleの「良好」基準は2.5秒以下です。Shopifyストアの場合、これは通常ヒーロー画像またはファーストビューの商品写真です。最もよく見かける間違い。ヒーロー画像を遅延読み込みすることです。LCP画像を遅延読み込みしないでください。LCP画像を遅延読み込みすると、ブラウザがページが「読み込まれた」ようにユーザーに見える要素の読み込みを遅延させるため、LCPスコアに悪影響を与えます。ファーストビューのヒーロー画像にはloading="eager"を使用するか、属性を完全に省略してください。

また、アップロード前に画像の寸法を確認してください。画像は通常ページ全体の重量の27%を占めます。最適化されていない商品写真、バナー、ライフスタイル画像がShopifyストアが遅い理由の第1の原因です。

3. INP: ほとんどのストアが見落としている指標

Googleは2024年3月に公式にFirst Input Delay(FID)をコア ウェブ バイタルとしてINPで置き換えました。INPは最初のクリックだけを測定しません。INPはFIDを完全に引き継ぎ、最初のクリックではなくセッション全体のすべてのインタラクションを測定するようになりました。

Shopifyストアの場合、最も一般的なINPの犯人はメインスレッドで実行されるJavaScriptです。Shopifyテーマとアプリで一般的な重いJavaScriptがINPスコアの低下の主な原因です。実用的な修正は次の通りです。重要なコンテンツを最初に読み込んでから、段階的に強化します。読み込みパフォーマンスをサポートするために重要なコンテンツを最初に読み込み、その後JavaScriptで段階的に強化します。コード分割を使用して、ユーザーが必要なものだけを読み込むようにし、インタラクション用にメインスレッドを清潔に保ちます。

INPはモバイルでも容赦なく露出しています。2026年、モバイルコマースは世界的なeコマーストランザクションの大多数を占めています。モバイルデバイスはデスクトップコンピュータよりも処理能力が大幅に低く、INPスコアが低下しやすくなります。

4. CLS: レイアウトシフト問題

累積レイアウトシフト(CLS)は視覚的な安定性を測定します。ページ読み込み中に要素がジャンプすると、CLSスコアに悪影響を与えます。「良好」なスコアは0.1以下です。サイズが指定されていない画像、後から読み込まれるフォント、動的バナーがShopifyでよくある犯人です。常にすべてのimgタグに明示的なwidthおよびheight属性を宣言して、画像が読み込まれる前にブラウザがスペースを予約するようにしてください。

知っておく価値のあるプラットフォームレベルの変更

最近のShopifyの2つの更新がパフォーマンス戦略に直接影響しています。

ページごとのCSSスコーピング(2026年4月):2026年4月、Shopifyはページごとのスコープを持つCSSをロールアウトし、テーマはすべてのスタイルシートをすべてのページ読み込みで配信するのではなく、実際に各ページでレンダリングされるセクションのCSSだけを配信するようにしました。これらの小さな改善は積み重なって、目に見えて速いページとなり、コンバージョン率の測定可能な向上につながります。

Horizonテーマ基盤(2025年夏):Shopifyの Horizonテーマは Dawnのリリース以来、最も重要なテーマリリースです。2025年Summer Editionsで発表され、ブロックのネストが深く、業界別のプリセット、ネイティブAIブロック生成、モバイルファーストアーキテクチャなど、Shopifyテーマの構築方法に根本的な転換を表しています。Horizonのパフォーマンスストーリーは積極的に改善されています。Horizonは発表以来四半期ごとに約5のモバイルPageSpeed ポイントを獲得していますが、Dawnはフラットです(完成度が高い)。Horizonを使用している場合は、テーマを最新の状態に保ち、テーマ設定の組み込みアニメーションを無効化して、意味のあるPageSpeed ポイントを回復してください。アニメーションだけを無効化することで、約10のPageSpeed ポイントが得られます。

テーマ自体を超えて、Shopifyはadminの中により詳細なパフォーマンスダッシュボードを含めるようになり、LCPやINPなどのメトリクスをページごとに分類して表示するようになりました。それを使ってください。シミュレートされたスコアではなく、実ユーザーデータを表示しています。

監視ワークフロー

パフォーマンスは1回限りのプロジェクトではありません。インストールするすべてのアプリ、追加するすべてのマーケティングタグ、加えるすべてのテーマ変更はパフォーマンス決定です。スピードで勝つストアは、四半期ごとの緊急時対応ではなく、パフォーマンスを継続的なアプローチとして扱います。

推奨される最小限の監視スタックは以下の通りです。

• Shopifyの Web Performance ダッシュボード(Online Store admin): Shopifyの組み込みWeb Performance レポートは、すべての主要ページタイプ全体でストアのパフォーマンスの商人向けの概要を提供します。1つのURLを一度にテストするPageSpeed Insightsとは異なり、Shopifyのレポートはホームページ、商品ページ、コレクションページ全体のデータを同時に集約します。
• Google Search Console(Core Web Vitals レポート):28日間のウィンドウで実際のChromeユーザーからのフィールドデータを表示し、ストア全体を対象とします。
• Google PageSpeed Insights:3つすべてのコア ウェブ バイタル指標を合格/不合格ステータスおよび推定時間節約での具体的な改善機会と一緒にレポート。ホームページと最重要商品ページをテストしてください。スコアが大きく異なることが多いため。

すべてのアプリ install、テーマ更新、大規模キャンペーンの開始後にチェックを実行してください。Shopifyでのパフォーマンスリグレッションはほぼ常に最近追加されたものが原因です。監視データは、Shopify CWVリグレッションの最も一般的な原因は、JavaScriptをグローバルに挿入する新しいアプリのインストールであることを示しています。

すぐに実施できるチェックリスト

今日ストアのトリアージを希望する場合は、ここから始めます。

• インストール済みアプリを監査して、不要なものを削除し、削除されたアプリからの残りのテーマコードをチェック
• ヒーロー画像/LCP画像にloading="eager"を設定してください。loading="lazy"はファーストビュー下の画像のみに使用してください。
• すべての<img>タグに明示的なwidth属性とheight属性を追加してレイアウトシフトを防ぐ
• ホームページのカルーセルと自動再生GIFを単一の静的ヒーロー画像で置き換える
• 重要でないJavaScriptをすべて遅延またはasyncにして、トラッキングピクセルをGoogle Tag Manager に統合
• 商品画像をアップロード前に200KB以下に圧縮(可能な場合はWebP形式)
• テーム(HorizonまたはDawn)を最新バージョンに保つため、プラットフォームレベルの最適化を取得
• 少なくとも月1回Google Search ConsoleのCWVスコアを確認

これのどれも大きな予算を必要としません。ほとんどは規律が必要です。すべての新しいアプリのインストールを単なる機能決定ではなく、パフォーマンスのトレードオフ決定として扱うことです。

このポストのすべてのCWVデータは、公開されている2025および2026のソースを反映しています。Google PageSpeed InsightsとShopifyの Web Performance ダッシュボードを主な測定ツールとして使用してください。