19 支払い&送料 | デザインってオモシロイ -MdN Design Interactive-
【サイトリニューアル!】新サイトはこちらMdNについて


19 支払い&送料
制作・文=マツダナオキ((株)TSUDUMI)


ユーザーを逃さないための3カ条
■どのページにも簡単な説明やリンクを設置する
■さまざま導線を想定してサイトを設計する
■必要な情報だけを的確に閲覧できるようにする




気になったときに情報を得られるつくり


ECサイトでは、ユーザーは商品を選んで購入するまでの過程で必ず「支払い方法」や「送料」についての説明を閲覧するものだ。運営側からしてもぜひ見ておいてもらいたい。では、どういった際に閲覧されるのだろうか。「初めて訪問したとき」、「商品を選ぶ前」、「決済の直前」、「決済の途中」などまったく人それぞれである【1】。つまり、サイト全体のどのページからでもそれらの情報ページへ遷移することができ、さらに言えばどのページ内でも要約した情報が得られることが望ましい。特にECサイトの場合、各商品ページなどの中層ページが、検索エンジンや広告からのランディングページになることが多い。商品の詳細情報と同時に、支払い・送料についての情報も得られればユーザーのたどる導線も短くなり、コンバージョンの向上にもつながるはずだ。商品説明のすぐ下部やフッター近くに支払い・送料についての要約情報と詳細へのリンクがあれば、見てもらいやすいだろう【2】。そしてカートに入れるボタンの近くに、ツールチップで表示してもいい【3】。

購入意識のあるユーザーが、これらの情報の取得につまずいて、離脱するケースがもっとももったいないのだ。支払い・送料についての情報を得るための導線を複数想定し、ステップが少なく早い段階で知ることができるようにして、購入にいたる過程での離脱率を抑えるようにしよう。

多くなりがちな情報をきっちりまとめる


支払い・送料についての詳細説明は、どうしても長くなりがちだ。選択肢が多ければ多いほど長くなる。しかし、あるユーザーが商品を購入する際、選択する支払い方法と配送方法は、基本的にひとつだろう。そう考えるとユーザーにとって必要な情報だけを簡単に見つけられ、わかりやすく伝えることが大切になる。詳細説明のページでは、ページ内リンクや、タブといったインターフェイスをうまく使って、必要な情報にすぐにたどり着けるように工夫してみよう【4】。決済ページの遷移中では、さらにこの「必要な情報」、「不必要な情報」が重要になる。支払い方法の選択をするにあたり、各選択フォームの間にだらだらと長い説明が挟まっていると、選択したい項目が見つけにくくなる。そのため複数のラジオボタンの中からひとつを選択した際に、選択した項目の情報だけが表示されるようにしよう。すると、フォーム自体が見やすくなり不必要な情報でじゃまに感じることもなくなる【5】【6】。このように、支払い・送料といった情報は、商品の魅力とはまったく別物だが、見せ方・つくり方次第で運営者側の姿勢が反映される。利用する側=ユーザーにとって、しっかりプラスになるように設計することが大切になる。



【1】購入にいたるまでにはさまざまなフローが想定される。どこでも閲覧できるようにしよう



【2】フッターとしてページに配置しておくと、すべてのページに統一して組み込みやすい



【3】カートに入れるボタンの近くに、ツールチップで表示させるとわかりやすい



【4】一度に商品を購入する際、ユーザーが選ぶ支払方法や配送方法は、ひとつだけになる



【5】支払い方法などの説明が長くなる場合、項目をタブ形式するなどして視認性を上げる



【6】選んだ項目の説明のみを表示した決済ページ。ラジオボタンが見つけやすくなる
twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在