トップメディア

商品ページの構成の組み方|どこに何を置くと読まれるのか

2026年7月30日5分で読めますAIKOAI編集部

同じ文章と同じ写真を使っても、置く順番を変えるだけで読まれ方は変わります。商品ページづくりで見落とされやすいのが、この配置の話です。AIKOAIでは構成の組み立てをAIKOが担います。AIKOAIは一般社団法人AIWAYが運営しています。

上から順に、離脱していく前提で組む

商品ページを開いた人は、上から順に見て、途中でやめます。全部読む人はごく一部です。

これを前提にすると、組み方は決まります。判断に必要なものを上に、あってもなくてもいいものを下に。この一本の原則だけで構成はかなり整います。

逆によくある失敗は、こだわりや背景を先に置くことです。書いた本人にとっては大事な部分でも、まだ何の商品か分かっていない人には届きません。

上から下までの置き場所

一番上:商品全体が分かる写真。 ここで印象がほぼ決まります。迷ったら、商品だけを写した明るい一枚です。

その下:一文の説明。 何の商品で、誰のためのものかを書きます。「夏の茄子で漬けた、ごはんのおともになる浅漬けです」のような形です。

次:値段と買う場所。 上のほうにあったほうが親切です。探させないことが大事です。

続けて:使ったあとが分かる写真と説明。 使っている場面、大きさが分かる比較、質感の一枚。ここで欲しい気持ちが動きます。

その下:裏づけの情報。 素材、作り方、大きさと重さ、手入れの方法。細かい情報はまとめて置きます。

さらに下:物語。 誰がどんな思いで作っているか。ここまで読む人は、もう買う気持ちが動いている人です。物語は最後の一押しになります。

いちばん下:条件のまとめ。 送料、届くまでの日数、返品の扱い、問い合わせ先。買う直前に確かめられる場所です。

上に置くほど多くの人に読まれます。読まれたいものではなく、判断に必要なものを上に置きます。

見出しは、流し読みのために立てる

多くの人は文章を読まず、見出しだけを追って気になったところで止まります。ですから見出しは、飾りではなく道しるべとして立てます。

「こだわり」より「使うほど手になじみます」。「商品詳細」より「大きさと素材」。中身が分かる見出しにすると、流し読みでも要点が届きます。

スマートフォンで見たときを基準にする

構成を考えるとき、基準にすべきは小さい画面です。多くの方は移動中や休憩時間に、片手で見ています。

画面が小さいと、一度に見えるのは数行だけです。パソコンで見ると横に並んで見えるものが、縦に長く伸びます。ですから「横に並べて比べる」形の見せ方は伝わりにくくなります。

代わりに効くのは、上から順に一つずつ読める形です。写真、一文、値段、写真、説明。この繰り返しのほうが、小さい画面では読みやすくなります。

長い文章の塊も避けたい形です。三行ほどで区切り、あいだに写真や見出しを挟むと、指を動かしながら読み進められます。AIKOAIでは小さい画面での読みやすさを前提に構成を組みます。

迷ったら、買う手前まで自分で進んでみる

構成の良し悪しをいちばん確実に確かめる方法は、自分がお客様の順に見てみることです。

ページを開いて、上から下まで読み、値段を確かめ、買う手前まで進む。この間に一度でも「探した」瞬間があれば、そこが直す場所です。

送料を探した。大きさを探した。届くまでの日数が見つからなかった。戻るボタンを押した。こういう小さな引っかかりが、実際の離脱につながっています。

自分のページは何度も見ているので、どこに何があるか覚えてしまっています。できれば家族や知り合いに見てもらい、探した場所を教えてもらうのが確実です。

詰め込みすぎたときの直し方

書いていくうちに情報が増え、長くなりすぎることがあります。そのときは削るのではなく、下へ動かしてみてください。

消すのは惜しいけれど上には要らない、という情報がほとんどです。下にまとめて置けば、必要な人だけが読みます。上が軽くなると、全体が読まれやすくなります。

AIKOAIでの進め方

写真と話した内容を渡すと、AIKOがこの順番に沿った構成を組みます。どの写真を一番に置くか、どこで場面写真を挟むか、物語をどこに入れるか。

「この写真を最初にしたい」「物語をもっと上にしたい」といった希望があれば、伝えるだけで組み替えられます。公開後に反応を見ながら順番を入れ替えることもできます。

順番は、あとから入れ替えられる

構成は一度決めたら固定するものではありません。公開後に反応を見ながら入れ替えられます。

途中で離れている人が多いなら、その手前に原因があります。物語を上に置いてみる、写真の順を変えてみる、説明を短くしてみる。試して比べるのがいちばん確実です。

一度に全部を動かさないでください。一つ変えて、少し置いて反応を見る。この繰り返しで、自分の商品に合う順番が見つかります。

商品によって効く順番は違います。手仕事のものは物語が上でも効くことがあり、実用品は条件が上のほうが決まりやすいものです。

よくある質問

Q. 物語を上に置きたいのですが。 A. できます。ブランドの性格によっては効く場合もあります。反応を見て入れ替えるのが確実です。

Q. 写真が少なくて埋まりません。 A. 商品全体と質感の二枚があれば成立します。無理に埋める必要はありません。

Q. 長いページと短いページ、どちらがいいですか。 A. 長さより順番です。上に必要な情報が揃っていれば、長くても問題ありません。

商品ページづくりの全体像はサービス紹介、立場ごとの進め方は活用シーンをご覧ください。AIKOAIは一般社団法人AIWAY(AIWAY Group)が運営しています。

← メディア一覧へ戻る