なぜ「構造的な問題」が売上に影響するのか

ECサイトの売上改善というと、デザインの刷新や広告の最適化に目が行きがちです。しかし実際には、HTMLの構造的な問題が検索順位を下げ、SNSでのシェアを阻害し、ユーザー体験を損ねているケースが非常に多いのが現実です。

厄介なのは、これらの問題が「見た目では分からない」こと。ブラウザは多少の構造エラーを補完して表示してくれるため、運営者が気づかないまま放置されるのです。

PagePulseの診断エンジンは、SEO・構造化データ・パフォーマンス・アクセシビリティの4軸でサイトを自動チェックします。その中から、ECサイトで特に検出頻度が高い5つの問題をピックアップしました。

問題リスト

1 Product構造化データの欠落・不備

影響度：高

Google検索結果で「価格」「在庫状況」「レビュー評価」がリッチリザルトとして表示されるかどうかは、schema.org/Product の構造化データの有無で決まります。

PagePulseの診断では、以下のパターンを検出しています。

  • Product自体が未実装 — 最も多いパターン。MakeShopやカラーミーのデフォルトテンプレートでは未対応のケースあり
  • priceの記述ミス — priceに「¥」記号を含めている（数値のみが正しい）
  • availabilityの省略 — 在庫切れ商品でも InStock のまま放置

修正方法

  1. JSON-LD形式で @type: Product を商品ページ内に追加（<head> でも <body> でも可）
  2. offers.price は数値のみ（「3980」）、priceCurrency に「JPY」を指定
  3. 在庫連動で availability を InStock / OutOfStock に動的切替
  4. リッチリザルトテストで検証

2 og:image未設定によるSNSシェア機会の損失

影響度：高

X（旧Twitter）やFacebookで商品ページがシェアされた際、og:image が未設定だとサムネイルが表示されません。テキストだけのリンクはCTRが大幅に低下し、口コミによる流入機会を逃します。

特にECサイトでは、商品画像がシェア時のサムネイルになることで購買意欲を直接刺激できる大きなチャンスです。

修正方法

  1. 全商品ページに <meta property="og:image"> を追加
  2. 画像サイズは 1200×630px を推奨（各SNSのプレビューに最適化）
  3. og:title と og:description も商品名・説明と一致させる
  4. Twitter Card（summary_large_image）も併せて設定

3 モバイルビューポートの設定不備

影響度：高

ECサイトのトラフィックの60〜70%がモバイル経由（経産省「令和6年度EC市場調査」で物販系61.7%、民間調査では71.1%）にもかかわらず、ビューポートメタタグの設定が不適切なサイトが散見されます。

最も多い問題は以下の2パターンです。

  • viewport自体が未設定 — デスクトップ表示がそのままモバイルに縮小表示される
  • maximum-scale=1 の固定 — ピンチズームが無効化され、アクセシビリティ違反（WCAG 1.4.4 Resize Text / 1.4.10 Reflow）

修正方法

  1. <meta name="viewport" content="width=device-width, initial-scale=1"> を設定
  2. maximum-scale や user-scalable=no は削除（ズーム制限の解除）
  3. CSSでの font-size 指定を相対単位（rem）に統一

4 画像alt属性の一括空白・重複

影響度：中

商品画像の alt 属性が空（alt=""）、またはすべて同じテキスト（例：「商品画像」）に設定されているケースです。

SEO的には、画像検索からの流入を完全に放棄していることになります。Google画像検索はECサイトにとって貴重な流入経路であり、適切なalt属性は検索エンジンに画像の内容を伝える唯一の手段です。

修正方法

  1. 商品メイン画像の alt に「ブランド名 + 商品名 + 型番」を設定
  2. サブ画像には角度や使用シーンを記述（例：「〇〇 背面ビュー」）
  3. 装飾画像（区切り線、背景パターン等）のみ alt="" とする

5 canonicalタグの設定ミスによる重複コンテンツ

影響度：中

ECサイトでは、同一商品がカラーバリエーション・サイズ別・カテゴリ別など複数のURLで表示されることが一般的です。ここで rel="canonical" の設定が抜けていると、Googleが各URLを別ページとして扱い、SEO評価シグナルが分散してしまいます。

  • パラメータ付きURL（?color=red、?sort=price）にcanonicalがない
  • canonicalが自己参照ではなく、別ページを指している（設定ミス）
  • httpとhttps、wwwありなしの混在

修正方法

  1. 全商品ページに <link rel="canonical"> を自己参照で設定
  2. カラー・サイズ違いのバリエーションページは「代表URL」に正規化
  3. パラメータ付きURLは、canonicalでパラメータなしURLへ正規化
  4. Google Search Consoleの「ページのインデックス登録」レポートで重複検出を確認

まとめ：構造を直すだけで「土台」が変わる

ここで挙げた5つの問題は、いずれもHTMLやメタタグの修正で改善できる技術的な課題です。デザインの変更や広告予算の増額は必要ありません（ただし利用中のECプラットフォームによっては、テンプレートやプラグインの制約で対応方法が異なる場合があります）。

しかし、その効果は累積します。構造化データの修正でリッチリザルトが表示されればCTRが上がり、og:imageの設定でSNSシェアが増え、モバイル対応の改善で直帰率が下がる。これらが合わさって、結果的に売上に反映されていきます。

PagePulseは、この記事で紹介した5つの問題すべてをワンクリックで自動検出します。あなたのサイトの現状を、まず数値で把握するところから始めてみてください。