ファッションのデジタルカタログで、リンクはどこに貼るのがベスト？

ファッションブランドやアパレル通販などのデジタルカタログで個々の商品に購入手続きページへのリンクを貼り付けたい場合、どれくらいの範囲にリンクを設定するのが適切なのでしょうか？　ユーザーの使い勝手を左右する部分だけに、気になるところです。ファッション関連のデジタルカタログの実例を見ながら、考えてみたいと思います。

1. 商品の詳細情報にリンクを貼る

アパレル関連のデジタルカタログの実例は実にたくさんあります。まずは、大丸・松坂屋さんのカタログを見てみましょう。

（出典：http://dmall.jp/digicata/list/）

商品写真のそばにレイアウトされている詳細情報、ここにリンクを設置しています。拡大して見てみましょう。

（出典：http://dmall.jp/digicata/list/）

このように、リンクの設置範囲が囲みで表示されています。ここをクリック（またはタップ）すると…

（出典：http://dmall.jp/digicata/list/）

このように、ECサイトの商品詳細・購入ページに遷移します。比較的小さな範囲にリンクを設置するので、リンク自体はあまり目立ちませんが、元のカタログのデザインを損ねることなく使いやすさを追求するには、いいバランスになるはずです。

2. 商品の画像にリンクを貼る

次に、丸井さんのECサイト「マルイ・ウェブチャンネル」のカタログを見てみましょう。

（出典：https://voi.0101.co.jp/voi/sp/index.jsp）

カタログのページを開くと、リンクの貼られた範囲が一瞬だけ青色で表示され、「ここにリンクがあるよ！」と知らせてくれます。

（出典：https://voi.0101.co.jp/voi/sp/index.jsp）

こちらの特徴は、リンクが商品情報ではなく写真そのものに貼られていること。リンクはどうしても四角形の範囲でしか設定できないようで、このページ左下の商品のように、モデルの頭部にリンク範囲の線が重なっていたりもします。

そのかわり、「押しやすさ」「分かりやすさ」の点ではとても便利です。試しに、このカタログをiPhoneのブラウザで開いてみました。

気になる商品の写真があったら、直感的に親指でタップできます。リンク範囲も比較的大きくできるので、スマートフォンユーザーを重視するのであれば、この方法は有効な手段の一つになるでしょう。

3. 詳細情報にリンクを貼り、さらにアイコンを追加する

最後の実例は、ベルメゾンさんのデジタルカタログです。まずは、その一例を見てみましょう。

（出典：http://dc.bellemaison.jp/dc/）

最初の実例と同じように、詳細情報の部分にリンクを貼り付けているのですが、さらに、ショッピングカートのアイコンを追加しています。
拡大して見てみましょう。

（出典：http://dc.bellemaison.jp/dc/）

このカートのアイコンがあることで、この色で示された範囲が何か？というのがひと目で分かります。ここをクリックすると…

（出典：http://dc.bellemaison.jp/dc/）

カタログ画面がグレーアウトして、詳細情報のウインドウが表示されます。
元のカタログのデザインを損なうことなく、デジタルカタログとしての便利さを両立させるアイデアの一つだと思います。

以上見てきたように、デジタルカタログで購入画面へのリンクを設定するかは、ユーザーの利便性を左右するものであり、デジタルカタログ導入の効果にも影響する重要な部分です。
できるだけ押しやすく、分かりやすいリンクにするのが理想的ですが、モデルや商品の写真や紙面デザインなどの見栄えにも影響しますので、慎重にバランスを取っていく必要がありそうです。