Lighthouse SEO スコア:E コマースのカテゴリページで 100 点を達成
Tech
SEO
E-commerce
Next.js
PrestaShop

Lighthouse SEO スコア:E コマースのカテゴリページで 100 点を達成

実際の商品カテゴリページが、Lighthouse で SEO 100 点、アクセシビリティ 100 点、ベストプラクティス 100 点、モバイルパフォーマンス 97 点を記録しました。

Uygar DuzgunUUygar Duzgun
Jun 17, 2026
更新日 2026年6月25日
8 min read

Lighthouse SEO スコア:E コマースのカテゴリページで 100 点を達成

小さな静的ページであれば、Lighthouse SEO スコアで 100 点を取得するのは簡単です。しかし、商品カード、画像、価格、在庫状況、フィルター、canonical 設定、構造化データ、そして最新の商業データを提供し続けるバックエンドを備えた、実際の E コマースカテゴリページでそれを達成するのははるかに困難です。

2026 年 6 月 17 日、`https://www.cigge.se/e-cigaretter/engangs-vape` に対して Lighthouse を実行しました。デスクトップの結果は全域でクリーンでした:パフォーマンス 100、アクセシビリティ 100、ベストプラクティス 100、SEO 100 です。モバイルの結果も健闘しました:パフォーマンス 97、アクセシビリティ 100、ベストプラクティス 100、SEO 100 です。

だからといって、このページの SEO が「完了」したわけではありません。これは、技術的な基盤が十分に強固であり、SEO 作業を壊れたマークアップ、遅いレンダリング、または混乱したクロールシグナルとの戦いではなく、コンテンツ、インテント、内部リンク、商業データ、および権威性(オーソリティ)に集中できる状態にあることを意味します。

結果

Lighthouse 監査項目デスクトップモバイル
------:---:
パフォーマンス10097
アクセシビリティ100100
ベストプラクティス100100
SEO100100
Cigge E コマースカテゴリページのデスクトップ版 Lighthouse 結果。パフォーマンス 100、アクセシビリティ 100、ベストプラクティス 100、SEO 100 を示しています
Cigge E コマースカテゴリページのデスクトップ版 Lighthouse 結果。パフォーマンス 100、アクセシビリティ 100、ベストプラクティス 100、SEO 100 を示しています
Cigge E コマースカテゴリページのモバイル版 Lighthouse 結果。パフォーマンス 97、アクセシビリティ 100、ベストプラクティス 100、SEO 100 を示しています
Cigge E コマースカテゴリページのモバイル版 Lighthouse 結果。パフォーマンス 97、アクセシビリティ 100、ベストプラクティス 100、SEO 100 を示しています

テストされた URL は、削ぎ落とされたデモルートではなく、稼働中の実際の E コマースカテゴリページでした。これは重要な点です。カテゴリページは通常、ヘッドレス E コマースが最初に複雑化してしまう場所だからです。

私が関わったりテストしたりしたスウェーデンの vape(電子タバコ)E コマースページの中で、これほど高速なカテゴリページの結果を見たことはありません。制御された競合他社とのベンチマークを経て初めて「スウェーデン最速の vape サイト」と呼ぶべきですが、このページはその有力な候補です。デスクトップで完璧な Lighthouse スコア、モバイルでパフォーマンス 97、そしてページ上に実際の商業データが存在しています。

商品詳細ページには 1 つの主要商品があります。一方、カテゴリページには多数の商品、多数の画像、並べ替え、フィルター、ページネーション、商品の入手可能性、価格変動、マーケティングテキスト、内部リンクなどが存在します。このページは、買い物客、検索エンジン、そして CMS チームのすべてに同時にサービスを提供しなければなりません。

Lighthouse SEO スコアが証明するもの

Lighthouse は、Google の Chrome チームによる自動化された監査ツールです。パフォーマンス、アクセシビリティ、ベストプラクティス、SEO、およびその他のウェブ品質シグナルをチェックします。Google PageSpeed Insights も、ラボ診断に Lighthouse を使用しています。

緑色のスコアがランキングの保証であるわけではありません。Google 自身のドキュメントでは、90 以上を「良好」とみなしており、ページが実際の商品データや本番用スクリプトを搭載すると、完璧な 100 点を維持するのは困難であるとされています。

したがって、私はこの Lighthouse SEO スコアを勝利宣言ではなく、技術的な証明点として捉えています。このページは、E コマース SEO を阻害しがちな基本的なチェック(クロール可能な HTML、適切なメタデータ、アクセシブルな構造、安定したパフォーマンス、明らかなブラウザやセキュリティのミスがないこと)に合格しています。

E コマースがこれを困難にする理由

E コマースページは、シンプルなマーケティングページでは現れない SEO の失敗モードを生み出します。

商品グリッドは JavaScript を過剰に配信してしまう可能性があります。商品画像は、適切にサイズ設定され優先順位付けされていない場合、パフォーマンスを破壊する可能性があります。フィルターはクロールトラップを作成する可能性があります。ページネーションはシグナルを分割する可能性があります。CMS の説明文は見出し構造を壊す可能性があります。バリエーション URL は重複ページを作成する可能性があります。在庫の更新は広範なキャッシュパージを強制する可能性があります。バックエンドの画像 URL はローカルまたはプライベートなパスを漏洩させる可能性があります。構造化データは、買い物客が見ているものから乖離してしまう可能性があります。

一つの弱い層が、ページ全体を引きずり下ろす可能性があります。

おすすめ

このスコアは、カテゴリページをいくつかのメタタグが付いたテンプレートとしてではなく、一つのシステムとして扱うことで得られました。その同じシステム視点は、私の Next.js による E コマースのスケーリング に関する仕事の背後にもあります。

スコアの背後にある SEO 作業

重要な作業は Lighthouse の実行前に行われました。

ページ 1 とページネーションされたカテゴリルートが一貫したベースを共有できるよう、カテゴリの canonical を整理しました。これにより、重複ページによる混乱が減り、ページネーションがメインのカテゴリ URL と競合することを防ぎます。

編集可能なカテゴリ説明が見出しを提供しない場合に備えて、テンプレートの H1 フォールバックを復元しました。これは些細に聞こえるかもしれませんが、欠落している H1 はクロールデータにおいて最も明確な技術的 SEO 欠陥の一つでした。

パブリック URL がバックエンドの想定を漏らすことなく、正しいストアフロントのオリジンから解決されるよう、サイトマップのオリジン処理を修正しました。サイトマップは退屈なものであるべきです。間違ったホスト、インデックス不可能な URL、またはブロックされた URL が含まれている場合、クロールの注意を無駄に消費してしまいます。

ローカライズされた canonical と hreflang の返信リンクを強化しました。多言語 E コマース SEO は、各言語が外側を指していても、一致する返信パスを受け取っていない場合に失敗します。

また、商品およびマーチャントの構造化データを強化しました。E コマーススキーマは現実と一致する必要があります:商品、オファー、入手可能性、マーチャントの詳細、配送の詳細は、ページおよびバックエンドの状態と一致している必要があります。

クロールのクリーンアップは単一のスコア以上のものでした

Lighthouse のスクリーンショットはクリーンな成果物ですが、より深い SEO の価値はその周辺のクロール修正から生まれました。

フォローアップの技術監査により、方向性が明確になりました:

問題タイプ修正前修正後
------:---:
Robots でブロックされた URL1,6127
欠落している H199967
サイトマップ内のインデックス不可能な URL1,18514
欠落している hreflang 返信リンク1024
複数の H12452
非連続的な H1 構造2,5292

私が緑色の丸よりも重視しているのはこれらの数字です。Lighthouse はページが高品質なラボチェックに合格したことを教えてくれます。クロールデータは、サイトが大規模に検索エンジンによって理解されやすくなっていることを教えてくれます。

パフォーマンスにはキャッシュの規律が必要でした

パフォーマンススコアは、単一の画像調整から生まれたものではありません。

ストアフロントは PrestaShop バックエンドの上で Next.js フロントエンドを使用しています。このセットアップは、キャッシュの境界が明確であれば速度をもたらしますが、無効化が広すぎると苦痛をもたらします。

私たちはサイト全体のパージではなく、スコープを限定した無効化に移行しました。商品イベント、在庫イベント、カテゴリ変更、メーカー更新、画像変更、CMS 編集、ブログ/ブートストラップイベントは、すべて同じ爆発半径を必要とするわけではありません。在庫イベントがストアフロント全体をパージすると、ユーザーは遅いページと冷えたキャッシュという代償を支払うことになります。

おすすめ

より良いモデルは単純です:最小限の有用なキャッシュタグセットを無効化し、フロントエンドが安定したカテゴリページと商品ページを迅速に提供し続けられるようにします。同じエンジニアリングパターンは、私の Next.js によるカスタム CRM CMS の仕事にも現れています:編集者に権限を与えつつ、動的データがフロントエンドを損なわないようにするのです。

だからこそ、カテゴリページは実際の E コマースデータを運びながら、デスクトップでパフォーマンス 100、モバイルで 97 を達成できるのです。

クリーンな HTML は依然として重要です

現代の E コマースチームは、SEO をメタデータプラススキーマと捉えがちです。それは狭すぎます。

ページには依然としてセマンティックな HTML が必要です。妥当な H1 が一つ必要です。ドキュメントを壊すことなく編集できるカテゴリコピーが必要です。商品リンクはリンクとしてレンダリングされる必要があります。適切な寸法と alt テキストを持つ画像が必要です。フィルターやページネーションの状態が間違った層に混入したからといって変更されない canonical URL が必要です。

おすすめ

ここが PageBuilder とリッチテキストの作業が重要になる場所です。CMS 編集者はコンテンツを容易にするべきであり、不正なカテゴリ HTML を作成するべきではありません。Tiptap React エディター の作業は、編集可能なブロックを実用的に保ちながら、ストアフロントの HTML とセキュリティルールを尊重するのに役立ちました。

おすすめ

私が ヘッドレス WordPress 移行 で古いコンテンツシステムを再構築した際にも、同じルールが適用されました:編集者体験を柔軟に保ちつつ、公開される HTML を予測可能に保つことです。

ここから主張しないこと

Lighthouse SEO スコア 100 点が、そのページが 1 位にランクインすることを意味すると主張はしません。

検索ランキングは依然として、クエリのインテント、商品ラインナップ、価格、ブランドの信頼性、内部リンク、被リンク、コンテンツの質、ユーザーの行動、そして Google がサイト全体をどのように解釈するかに依存します。

また、Lighthouse をパフォーマンスの唯一の情報源として使用することもありません。ラボ結果は再現可能であるため有用ですが、フィールドデータは実際のユーザー、実際のデバイス、実際のネットワークから得られるため重要です。

誠実な主張はより狭く、かつ強力です:この E コマースカテゴリページは、商業ページとして振る舞いながら、厳格な技術的品質ゲートを通過しました。

実践的な教訓

E コマース SEO において、私は技術プラットフォームが邪魔をしないことを望みます。

それはつまり、カテゴリページが有用な HTML をレンダリングすること。canonical とサイトマップが一貫した物語を語ること。hreflang が相互であること。商品データと構造化データが一致すること。バックエンドの小さな変更後もキャッシュが温かい状態を保つこと。編集者がページ構造を損なうことなくコンテンツを追加できること。商品を隠すことなく画像が高速にロードされることです。

これらの要素が整ったとき、このような Lighthouse SEO スコアが可能になります。さらに重要なのは、SEO チームが実際に複利効果を生む作業(コンテンツ、商品カバレッジ、内部リンク、コンバージョン、権威性)に時間を費やせるようになることです。

私は Lighthouse の結果をエンジニアリングの質の証拠と考えています。スコアは目に見える部分です。真の価値はその背後にあるシステムにあります。

ソース