ネットショップをデザインする際、多くの人はトップページに重点を置きます。なぜなら、訪問者がはじめに目にするのがトップページだからです。しかし、ECサイトの最終的なゴールは売上をあげることであり、その目標を達成するためには、優れた商品ページが必要不可欠です。
効果的な商品ページは、お客様に商品の価値を瞬時に伝えることができます。商品の外観や使用感を的確に伝え、「これは絶対に手に入れたいものだ！」とお客様に思わせるのです。
マーケティング担当者が商品ページを作成する際に選択できる機能やバリエーションはたくさんあります。この記事では、参考になりそうな商品ページをいくつか紹介し、それらのデザインのどこが優れているのかを説明していきます。気になるものがあれば、ぜひあなたのネットショップにも取り入れてみてください。
では、お楽しみください。もし記事を読み進めるうちにこれらの商品を購入したくなっても怒らないでくださいね…。それこそが、商品ページが優れていることの証なのですから。
最高の商品ページ：海外の優れた事例16選
それでは、トップレベルのECサイトが、お客様の購買意欲を高める商品ページをどのように作成しているかを詳細に見ていきましょう。
- Master & Dynamic
- Holstee
- Studio Neat
- Love Hair
- Rocky Mountain Soap
- United By Blue
- Leesa
- Manitobah Mukluks
- Luxy Hair
- Pilgrim
- Outdoor Voices
- Kettle & Fire
- Perfect Keto
- PooPourri
- Sixty-Nine
- Johnny Cupcakes
1.Master & Dynamic
Master & Dynamicの商品ページにアクセスすると、「大胆」「エレガント」「ラグジュアリー」などの言葉が頭に浮かぶことでしょう。商品の細部を強調するクローズアップ写真からは、品質の高さと丁寧な作りが感じ取れます。このヘッドフォンからどんな音が聴こえるのか、気になりますよね。
このブランドの商品ページは一般的なネットショップとは一線を画しています。ファーストビューには洗練された画像と簡潔な商品名のみ表示されており、「カートに追加」ボタンも詳しい商品情報も見当たりません。ネットショップにとって一番重要なショッピングカートは、下にスクロールするとはじめて見えるようになっているのです。
更に下にスクロールすると、このブランドのデザインへのこだわりが伝わる商品説明が表示され、商品の素材や機能、操作方法などの詳細を知ることができます。こうして細部までヘッドフォンを「体験」できるように工夫されています。
なお、この時に「カートに追加」がページ上部のバーに移動している点に気づきましたか？デザインを重視しているブランドだけあって、ヘッドフォンの体験を邪魔しないよう目立たない場所にボタンが設置されています。しかし、それによりコンバージョンが犠牲になっているわけではありません。ページ上部に配置することで、お客様がヘッドフォンをいつでも自分のものにできることをさりげなくリマインドできます。また、実際に購入したいと思った時にわざわざ上にスクロールする必要がないので、ユーザーフレンドリーなデザインでもあります。（なお、このバーでは色の選択肢もパッとわかる仕組みになっています。）
2. Holstee
Holsteeが楽しくて遊び心のあるブランドであることは、商品ページからも見て取れます。白を基調としたシンプルなデザインは、ポップな色合いの商品を引き立てせるだけでなく、いくつかの重要な要素に目が行くように工夫されています。「カートに追加」ボタン、会員登録による割引特典、送料無料の条件といった購入を促す情報は、グリーン系の色で統一することで自然にお客様の目に入るようになっています。
Holsteeは非常に視覚的なブランドであり、ファーストビュー以降はそれまでのシンプルなものとは打って変わって盛りだくさんな商品ページを用意しています。下にスクロールすると、鮮やかな写真やビデオ・アニメーションなどを駆使して、お客様が商品についてより詳しく知るための情報を網羅しています。
一通り商品説明が終わると、カスタマーレビューや配送・返品の扱い、エコロジー（素材や製造元を含めたエコシステム全体に対するブランドの考え）などが表示されますが、これらはタブの切り替えで確認できるようになっています。こうして、商品説明以外の補足情報は最小限のスクロールで情報が入手できるように設計されています。
3. Studio Neat
Studio Neatも情報満載な商品ページで成功をおさめているブランドです。購入を決断するために必要な情報をすべて網羅する商品説明で、お客様をショッピング体験へと導いています。
商品ページをアクセスすると、ブランドの生い立ちと商品の使い方などを説明する動画にファーストビューの下半分をすべて割いている点がユニークです。これにより、商品の訴求ポイントを効率的にお客様に伝えることができます。
また、下にスクロールをすると、お客様がこの商品を買うべき理由を商品レビューも交えて述べています。商品説明はキャッチーなうえ、要点がきちんと伝わる写真と組み合わせてあるので、お客様はまるで目の前に商品があるかのように感じることができます。
Studio Neatの商品ページは、一連のライフスタイル写真で締めくくられており、様々なアングルから商品とブランドを効果的にアピールすることに成功しています。
4. Love Hair
Love Hairは環境に優しい商品に焦点を当てているヘアケアブランドです。商品ページも同様に清潔感があり、白の背景に淡いピンクをアクセントカラーとして添えて商品やメッセージを引き立てています。
また、商品の静止画を見せるだけではなく、スタイリッシュな動画コンテンツを活用してお客様が一番知りたい商品の使い方が簡単に分かるように工夫しています。
動画の下では、商品の効果についても詳しく説明しており、お客様の悩みに直接語りかける機会を設けています。それでも購入を悩むお客様には、使用している高品質な成分やブランドのサステイナビリティへの取り組みについても説明しています。
5. Rocky Mountain Soap
自然派ボディケア製品を販売するRocky Mountain Soapは、ネットショップを訪れるお客様が高品質で安全な商品を求めていることを熟知しています。そのため、商品ページではこうした価値観にフィットする情報を分かりやすく表示しています。GMO（遺伝子組み換え作物）フリー、ヴィーガン（完全菜食主義者）、クルエルティフリー（動物実験をしない）、無添加といった主要な利点は、専用のアイコンでひと目で確認できるようになっているので、お客様が躊躇することなく商品を購入することに役立っています。
また、Rocky Mountain Soapの商品ページは,ファーストビューのすぐ下に他のお客様の商品レビューが埋め込まれている点も特徴的です。商品の購入を迷っている人は、ほんの少しスクロールするだけで簡単に最新の商品レビューを読むことができます。
このブランドは、商品レビューの重要性も明確に理解しています。Bizrate Insightsの調査(英語)では、回答者の約25％がネットショッピングをする際に「必ずカスタマーレビューを参照する」と述べており、さらに40%の回答者が「頻繁に参照する」と応えています。商品説明のすぐ下に、複数のお客様が満足して5つ星評価を与えているというレビューがあることは、実際に商品に触れたことのないお客様の不安を軽減する確実な方法です。
6. United by Blue
環境への配慮を徹底していることで有名なUnited By Blueは、世界中の海や水路からゴミをなくすことを使命としているブランドです。「製品が1つ売れるたびに、1ポンドのゴミを拾う」ことが目標に掲げられていますが、お客様の購入によって実際に海や水辺から取り除かれたゴミの量が分かる仕掛けを組み込んでいることが、他のネットショップとは一線を画すポイントです。地球をきれいにしながら素敵なTシャツを手に入れたい、と思わない人はいないでしょう。
また、このゴミの量ほどのインパクトはありませんが、返品を減らすことも環境に配慮する上では大切な施策です。United by Blueでは、お客様が自分に合った商品を購入できるようにサイズチャートや測定方法、商品レビュー欄のフィット感別フィルタリングなどを提供しています。
なお、カスタマーレビューにいく手前で、お客様が興味を持ちそうな他の商品をシンプルなサムネイルで紹介しており、アップセル・クロスセルの機会を逃さない工夫もしています。
7. Leesa
Leesaは実店舗を訪れずにマットレスが購入できるネットショップです。商品ページでは、オンラインでマットレスを購入する際の不安要素をうまく解消する工夫がなされています。
- マットレスは高価なものなので、分割払いも可能
- 気に入ったマットレスと出会えるよう、100日間の無料トライアルを提供
- 高品質である証明として、マットレスは10年保証付
このような情報を商品ページに表示することで、実物を見れないオンラインでも、お客様は安心して大きな買い物をすることができます。
同じようなマットレスメーカーが数多く出てきたので、Leesaは自社マットレスが他社より優れている点を「カートに追加」の下の表と、マットレスのレイヤーを示すインタラクティブなグラフィックを使用して説明しています。
また、商品ページをさらにスクロールすると、マットレスが10台売れるごとに1台寄付するというブランドの社会的責任の方針についても紹介されており、お客様が気持ちよくLeesaで買い物ができるようになっています。
マットレスはたしかに大きな買い物ですが、スクロールすればするほどLeesaで購入する理由が増えていきます。商品レビューで他のお客様がどれだけLeesaのマットレスを気に入っているかを知ることもできますし、商品に関する質問を集めたFAQも用意されているので、お客様は商品ページから離れることなく必要な情報がすべて手に入ります。
8. Manitobah Mukluks
Manitobah Mukluksも商品あたりの単価が高いため、購入プロセスをより考慮する必要がありました。商品が20ドル以下であれば、欲しいと思ったお客様はかなりの確率で購入してくれますが、価格が上がれば上がるほど、お客様は購入を決定する際に罪悪感を感じがちです。こうした罪悪感はビジネスにとっては邪魔者以外の何物でもありません…。
送料が高すぎるとお客様はカートを放棄しやすいことがデータからも分かっているので、このブランドでは購入時に最も多い不安を解消するため、商品ページの「カートに追加」ボタンのすぐ下に「送料無料」と「返品無料」と表示しています。これにより、お客様は今自分が目にしている価格が最終的な金額にかなり近いだろうと安心します。
なお、購入を躊躇している場合は、下にスクロールするだけで、商品の詳細だけでなく会社の生い立ちやミッションについても学ぶことができるようになっています。
お客様は商品ページを離れることなく、先住民族が所有する会社であること（およびそれが何を意味するのか）や、ブーツのソールに描かれたアートに秘められたストーリーを知ることができます。
![Manitobah Mukluks]()
9. Luxy Hair
Luxy Hairは人毛を使ったヘアエクステンションを販売しているネットショップです。お客様ごとに求めている商品が異なるため、髪の太さや色、髪質などをクイズ形式の質問で尋ね、自分に合った商品を探す旅へと導きます。
一連の質問に答えた後、お客様は（理想的には）探し求めていた商品が掲載されているページにたどり着きます。
この商品ページの優れている点は、高度にパーソナライズされたショッピング体験を提供していることです。Luxy Hairがお客様のショッピングプロセスをガイドしてくれるので、数あるコレクションの中から最適なものを探し当てるよりも、お客様が商品を購入する可能性は高くなります。
また、この商品ページでもかご落ちの最大の要因である送料と返品について、ポリシーが明記されています。さらに、Luxy Hairではカスタマーサポートチームが24時間体制で対応していることも表示しており、お客様は購入に関して問題や質問があった場合に安心して連絡を取ることができます。
10. Pilgrim
アロマテラピーとダイナミックなデザインが融合したPilgrimの商品ページでは、使用している商品写真に工夫が見られます。商品を紹介する画像は、同じ構図を白と黒の両極端な背景で撮影しており、日中と夜間でどのように見え方が異なるかを分かりやすく伝えています。
このインパクトある画像と併せて、商品ページのファーストビューでは、お客様が購入を決断するための重要な要素を手堅く盛り込んでいます。
- 簡潔明瞭な商品情報
- 生活シーンをイメージした商品写真
- 複数の支払いオプション提示（「ShopPay」、「GPay」、「PayPal」など）
- 返金および返品に関する情報（30日間の返品、1年間の保証）
- 配送ポリシー（米国および英国への配送スピート（4日間））
尚、下にスクロールしていくと、商品の特徴や素材などの詳細がグラフィックととも表示されているだけでなく、実際に商品を使用しているお客様が投稿した動画コンテンツも確認できるので、より深く商品を知ることができます。
11. Outdoor Voices
Outdoor Voicesは、日常的に着用できるスポーツウェアを販売するアパレルブランドですが、ここも商品写真にこだわりをもっています。掲載されている写真では、モデルが遊び心のあるポージングをとっており、ターゲット顧客に親しみやすさを提供しています。
また、商品ページのデザインがすっきりしていて機能的であることも評価すべきポイントです。お客様は「バッグに追加」ボタンを見失うことなく、商品のお手入れ方法や仕様、支払い方法などの情報を簡単に見つけることができます。
12. Kettle & Fire
Kettle & Fireは、世界的に有名なシェフが作ったボーンブロス（骨のだし）のスープを、最大2年間保存できる容器に入れて販売しているブランドです。
一見するとAmazonのリスティングページに似ている商品ページは、ライフスタイルショットだけでなく、栄養ラベルや原材料のインフォグラフィックスを画像としてカルーセルで表示している点が特徴的です。商品名の下にはお客様からの評価が表示され、アピールポイントが箇条書きで簡潔に説明されています。
なお、Kettle & Fireではいくつかの異なる購入オプションを用意していますが、お客様が商品を選んでカートに入れるまでの手順は分かりやすく表示されています。
おすすめ読み物：
ネットショップを簡単に作成しよう！おすすめツール9選【2021年版】
13. Perfect Keto
Perfect Ketoも、効果的とされる商品ページ(英語)に必要な多くの要素を手堅く盛り込んでいます。お客様が知りたい情報を素早く提供するためにファーストビューで行っている工夫は以下の通りです。
- 商品名や説明は分かりやすく
- 顧客の評価（☆）を表示
- 商品の選択肢を明確に（フレーバーや、新商品・限定商品など）
- 複数の支払い方法を提供（分割払いや定期購入などのオプション含む）
- 箇条書きのリストでメリットを伝える
- 高品質な商品画像の使用
下にスクロールすると、お客様が購入に踏み切れない場合に備えて、原材料の効能や商品を活用したアレンジレシピ、商品レビューやライフスタイルショットなどが用意されており、お客様の不安を解消できるようなつくりとなっています。
14. PooPourri
PooPourriは、人前で話すのがタブーとされているトイレの悩み（具体的には「大きい方」の臭い）に対して、ウィットに富んだアプローチ（※）をとっているブランドです。簡潔な商品説明に大胆な色使いを駆使した画像を添えることで、お客様は楽しみながらトイレ用の消臭スプレーが必要かを判断することができます。
さらに「Most Poopular Products」という秀逸なコピーで売れ筋商品を紹介しています。これはオンラインで買い物をする際にお客様が期待する機能であり、現在の選択肢が欲しくない場合でも、お客様をショップ内の別の商品に誘導することができる優れたアドオンです。
また、看板商品の「Before-you-go」スプレーがどのように機能するか分からない場合に備え、PooPourriでは使い方を紹介するポップな動画を用意しています。それでも質問がある場合は、「Let's Talk Sh*t！」というチャットウィンドウをクリックすると、カスタマーサービスの担当者と話すことができます。
*商品ページに出てくるPooやSh*t、Crapは大きい方を指すスラングです。センシティブな悩みも、PooPourrioのこうしたコピーによりとっつきやすい印象に変わりますよね。
15. Sixty-Nine
Sixty-Nineは、その斬新なデザインで注目を集めているブランドです。他の多くのネットショップとは異なり、目の前でキャラクターが動き、こちらを見ているかのように見せる仕掛けで、商品を生き生きと紹介しています。
特定の商品をクリックすると、アニメーションからインタラクティブなページに切り替わり、余白を多用したすっきりとしたデザインが表示されます。通常のECサイトの商品ページとは違いかなりユニークなものになっていますが、説明は必要最低限で雑然としたものがないので、お客様をダイレクトに購入へと導くことができます。
16. Johnny Cupcakes
Johnny Cupcakesも遊び心のあるブランドで、自らを「世界初のTシャツ・ベーカリー」と呼び、最近加わった商品はすべて「焼きたて」であると宣伝しています。実店舗の内装やギフトボックスも本物のベーカリーそっくりに作りこまれており、とても楽しいコンセプトでお客様を出迎えます。
高画質な商品写真をうまく活用し、ポップなデザインの洋服やグッズを効果的にアピールしています。また、ぽっちゃりした愛くるしいキャラクターがカップケーキを追いかけているロードアニメーションは、好きにならずにはいられないでしょう。
なお、このブランドの商品ページで「今すぐ購入」ボタンをクリックすると、画面の右側にショッピングカートが表示され、いつでもチェックアウトできるようになります。これは、お客様にまだ取引が完了していないことをリマインドするだけでなく、支払いのオプションが複数あることを知らせる役割をはたしています。商品ページが瞬時にチェックアウトページに変わることで、購入プロセスをスピードアップすることができる設計になっています。
売れる商品ページをデザインするために
商品ページは、ECビジネスの原動力となる大切なページです。お客様の疑問や不安に答え、購入を決断させることができるので、正しくデザインすることは非常に重要です。
優れた商品ページは、オンラインでの検索にヒットしやすく、お客様を楽しませることができ、購入したい商品を決めるのに役立つものです。以下では、より良い商品ページを作成するためのヒントと推奨事項をご紹介します。
- 優れた商品ページの中核とされる要素を盛り込む
Nielsen Norman Groupが何百ものEC商品ページを調査した結果によると、商品ページには以下の要素が含まれている必要があります。
- 分かりやすい商品名
- 識別可能な画像
- 画像の拡大図
- 価格（商品固有の追加料金を含む）
- 色やサイズなどの商品オプションとその選択方法
- 商品の在庫状況
- 商品をカートに入れる明確な仕組みと、入れた際の素早いレスポンス
- 簡潔で的確な商品説明
- 大きくて鮮明な360度の画像を使う
買い物客の4分の3(英語)は、オンラインで商品を購入する際にじっくり時間をかけて画像を確認しています。あなたのページを訪れたお客様が、直接商品を手にとれなくても使用感などが想像できるように、鮮明な画像を用意しましょう。商品ページに360度ビューや分かりやすい説明ビデオを追加することで、お客様のショッピング体験を向上させ、コンバージョンを高めることができます。
- 説得力のある商品説明を書く
素晴らしい商品写真が撮れたら,次は商品の詳細情報を充実させましょう。お客様の76%(英語)が商品の具体的な仕様を知りたいと思っていることからも、商品ページに的確な説明や仕様書（サイズ表など）を含むことは極めて重要です。購入を検討しているお客様は、こうした情報を基に製品比較などを行うこともできるので、結果的に購入の決断をスピードアップすることができます。
- ライブチャットウィンドウを追加する
優れた商品ページは、その商品に対してお客様が抱きそうな疑問をあらかじめ予測して、答えを準備してあります。しかし、さらに詳しい情報を必要として、あなたとコンタクトをとりたいと思うお客様は常に存在します。ライブ チャット用のウィンドウがあれば、お客様は簡単にカスタマーサービスから求めている情報を得ることができ、スムーズに購入へと進むことができます。
- お客様の評価を表示する※
平均的なお客様は、何かを購入する前に10件のカスタマーレビューを読みます(英語)。商品ページにレビューを掲載していない場合は、お客様はサードパーティのサイトで評価を確認するかもしれません。一度外部サイトに移動したお客様は、あなたのネットショップに戻ってこない可能性も十分に考えられます。このような事態を避けるためにも、商品ページに商品レビューを掲載して、お客様が評価を探す手間を省くことが大切です。
Shopify で 商品ページを作成してみよう！
商品ページは、お客様があなたから商品を購入したいかどうかを判断する場所です。経験豊富なデザイナーでなくても、ウェブサイトを構築し、見栄えがよく売上につながる商品ページを作成することは可能です。Shopifyでは、デザインとコンバージョンの両方をバランスよく兼ね備えた商品ページを作成することができます。
Shopifyストアの構築に取り組んでいる間に、ビジネスの管理、マーケティング、成長に役立つ23種類の無料Shopifyアプリもチェックしてみてください。
原文：Courtney Symons、翻訳：坂本真紀
よくある質問
商品ページとは何ですか？
商品ページはどのように作成するのですか？
2.認識しやすい画像を追加し、拡大表示できるようにしましょう
3.価格を明記します
4.色や数量など商品の選択肢を明確にし、それらを簡単に選べるようにしましょう
5.商品の在庫状況を表示しましょう
6.商品を簡単にカートに追加できるようにし、その情報が素早く反映されるようにしましょう
7.簡潔で役に立つ商品説明を書きましょう
8.商品レビューなどを効果的に盛り込みましょう
ネットショップではどのように商品を紹介すべきですか吗?
・回転ビューやクロースアップショットなどの追加画像を掲載しましょう
・商品を使用しているシーンをアニメーションや動画で紹介しましょう
・おすすめの関連商品を表示しましょう
・拡張現実（AR）や360度写真を使ってみましょう
・商品の使い方を分かりやすく説明しましょう
Shopify上で商品ページを作成する方法を教えてください。
2.Shopifyの管理画面に入ります
3.「オンラインストア」を開き、「テーマ」に進みます
4 .カスタマイズボタンをクリックして、テーマの編集ページに移ります
5.ドロップダウンリストから「商品ページ」を選択しましょう
6.商品ページのテンプレートのカスタマイズを開始します