ゼロクリック時代のShopifyテーマ開発

概要

最近、AIの使われ方が明らかに変わってきました。

以前は「試しに触ってみるもの」だったAIチャットが、いまは普通に検索の代わりになっています。

「黒で防水、1万円以内のスニーカーがほしい」

こんな抽象的な入力でも、AIは条件を解釈して候補を出してくれる。
ユーザーはキーワードを工夫しなくていいし、複数サイトを回遊しなくてもいいとても便利な機能です。

ただ、ECサイト側から見ると少し話が変わります。

いわゆるゼロクリック問題です。
検索 → 流入 → 比較 → 購入 というこれまでの前提が崩れ始めています。

AIが「比較レイヤー」を吸収してしまうなら、テーマ設計の考え方も変わらざるを得ません。

必要な対応

これまでのShopifyテーマ開発は、

・コンバージョン率を上げるUI
・ファーストビューの改善
・CTAの設計
・モバイル最適化

といった、人間の視覚体験をどう最適化するかが中心でした。
これは今後も重要ですが、AIが見ているのはUIではなく構造化されたデータです。

具体的には以下が必要な情報です

・商品名
・価格
・在庫
・SKU
・バリエーション構造
・返品・配送ポリシー

Googleも公式に、検索エンジンがページ理解のために構造化データを利用していると説明しています。
AI検索や生成AIが回答を作る文脈でも、明示的なデータは扱いやすい形式になります。

つまり、これからはUIの完成度 × データ構造の整合性この両方が必要になります。

schema.org/Product について

AI購入や検索エンジンが商品を理解するとき、実際に見ているのは Product の中身です。

特に重要なのが Offer。

Googleのドキュメントでも、Product構造化データでは offers の指定が前提になっています。

チェックすべき3点

1. Offer が正しくネストされているか

◼️よくある失敗例

{
  "@type": "Product",
  "name": "Sample Product",
  "price": "5000"
}

これは仕様的に正しくありません。

価格は Product 直下ではなく、Offer の中に入れるのがルールです。

◼️成功例

{
  "@type": "Product",
  "name": "Sample Product",
  "offers": {
    "@type": "Offer",
    "price": "5000",
    "priceCurrency": "JPY",
    "availability": "https://schema.org/InStock"
  }
}

この構造になっていないと、機械側は
「販売条件が定義されていない商品」として扱います。

2. priceCurrency が明示されているか

意外と抜けがちなのがここです。

"price": "5000"

だけだと、

5000円？、5000ドル？5000ユーロ？なのかAIには判断できません。

そのため下記を明示して、初めてpriceの意味を持ちます。

"priceCurrency": "JPY"

Shopifyは多通貨対応が前提なので、ここが曖昧だと将来的に問題になります。

3. 在庫情報が実態と一致しているか

"availability": "https://schema.org/InStock"

になっているのに、実際は売り切れ、というミスがよくあります。

テーマ側で在庫の条件分岐が甘いと、
構造化データだけが「InStock」のまま残ることがあります。

AIにとっては、「在庫ありと宣言されている商品」として扱われます。

これは信用問題にもつながります。

まとめ

AIが急速に進化し、日常的に使われるようになった今、私たち開発者もそれに合わせて設計思想をアップデートしていく必要があります。

これまでのように「ユーザーにとって見やすいサイト」を追求するだけでは十分とは言えません。
これからは、人間だけでなく AIにとっても理解しやすいサイト構造 を意識することが重要になります。