2020年01月15日

「サービス／商品の詳細情報（一覧）」の役割・見せ方

皆さんこんにちは。
アシスタントクリエイターの村本です。

今、このブログでは
「Webサイトに置ける各コンテンツの役割と、なぜそれが必要なのか？」を
１つ１つ確認しています。

今回は「サービス／商品の詳細情報（一覧）」についてです。

「サービス／商品の詳細情報（一覧）」とは？

このコンテンツでは、文字通りサービスや商品の詳しい情報を載せます。
サービス（商品）の「特長」や「お客様の声」を読み、興味を持ってもらった利用者を
次に誘導するのがこのコンテンツです。

役割

　利用者の立場で考えると、　
　「実際にサービス（商品）を利用してみようかな」と思ったときに
　次に見たいのがこの情報（詳細）のはずです。

　前回の記事にも書きましたが
　利用者はサイトを見ている時点で、複数の会社（サービス、商品）を比較しています。

　ですので、このコンテンツには
　「このサービス（商品）を利用しよう！」と判断するための情報を提供する役割があります。

なぜ必要なの？

　どんなに興味深くても情報が少ないと判断に至らず、利用者は次の行動に迷ってしまします。
　また、闇雲に細かい情報ばかり並べても意味がありません。

　利用者にとって、判断材料にならない情報は不要ですし、
　無駄な情報が多いと情報整理に疲れてそのサイトを見るのをやめてしまいます。

　まずは、確信を持つための判断材料として何が必要か？
　情報整理をし、比較しても選ばれるための材料をきちんとそろえておくことが大切です。

　そしてWebサイトの最終目的である
　『お問合せ』や『予約／購入』の入力に進んでもらえるようにしましょう。

デザインのポイント

サービスや商品によって見せ方(デザイン)は異なりますが、気を付けたい点は基本的に同じです。

　① 最短ルートで情報にたどり着けること
　　　カテゴリや階層がある場合、制作側の感覚ではなく利用者目線で考えて配置する。
　　　どういうカテゴリ分け（検索）が用意されていると、
　　　欲しい情報までストレスなくたどり着けるか。
　　　利用者の思考で情報整理し、
　　　気になる情報を次々に見ていけるようなボタン配置やデザインを取り入れること。

　② 適切な表現で伝えること
　　　どのような表現方法が１番伝わるか？
　　　「リード文・テキスト・ビジュアル」？

　　　サービスや商品によって適切な表現を選ぶことが大切です。
　　　例えば…
　　　・サービス（商品）が複数あり数値データや特長が多い場合は、
　　　　表にまとめるてスッキリ見やすくする
　　　・キレイな写真を大きく表示し、ビジュアルで良さを伝える
　　　・文章表現を使い、数値やビジュアルだけでは伝わらない部分（五感や、体感）を伝える

　③ 情報量に合わせたウィンドウ表示すること
　　　情報量が多い場合、そのまま全ての内容を載せると
　　　読みにくいだけでなく利用者に情報整理させる負担が大きくなり、
　　　サイトの離脱にもつながりかねません。

　　　特にスマホ表示では、スクロールの長さや文字サイズを意識して、
　　　情報を分割・整理する必要があります。
　　　この場合は、ページ遷移をせずにスクロールを減らすウィンドウ表示を検討しましょう。
　　　例えば…
　　　・アコーディオン
　　　・モーダルウィンドウ
　　　・タブ切替　

　④ コンバージョンボタンを配置すること
　　　Webサイトの最終目的は、『お問合せ』もしくは『予約／購入』です。
　　　利用者が「このサービス（商品）にしよう！」と思ったときに、
　　　それを手に入れるための手段が不明確だと、行動をやめてしまうかもしれません。

　　　ですので、『お問合せ』や『予約／購入』画面に繋がるボタンを必ず
　　　このコンテンツを読み進めた先に配置しておくことが重要です。