携帯用ショップサイトのページ構築の大前提となるのが、気軽に訪れるユーザーのために、「シンプルに、使いやすくする」ということです。そのために、以下の4つのコツを覚えておきましょう。
1. ページ階層は2階層程度に
2. すぐ購入できる構造に
3. 画像データを軽くする
4. アクセスキーで利便性を向上
それぞれ具体的に実践方法をご案内します。
●階層は2階層程度
携帯電話では、1画面に表示できる文字量や画像数に限りがあります。そこで、パソコン用のショップサイトの1ページを複数のページに分割して、1ページあたりの情報量を絞り込む必要があります。
ただ、あまり分割しすぎて商品購入までの階層が深くなってしまうと、ユーザーは購入画面にたどりつく前に飽きて、サイトから去ってしまいます。携帯用ショップサイトでは、商品紹介から購入までの階層は多くても2階層程度にして、なるべく早くユーザーを購入画面に誘導するべきです。
●すぐ購入できる構造に
商品を買うのに手間がかかると、ユーザーの購買意欲が薄れます。携帯電話のように限られた操作しかできず、パソコンに比べれば小さな画面で確認しているならなおさらです。商品の写真ページや詳細ページなど全ページに購入ボタンを設置し、どのページからも購入できるようにしましょう。
●画像データを軽くする
パソコンに比べ通信速度が遅い携帯電話では、容量の大きな画像は表示に時間がかかり、ユーザーのストレスになります。商品画像は１枚につき20KB程度を目安に、縮小したり、解像度を抑えたりしておきましょう。
「たくさんある商品画像を縮小するのは面倒」という人には、「縮小専用。」というフリーソフトがオススメです。これは画像のサイズ指定はもちろん、画像の容量を指定して縮小できるすぐれもの。大量の画像もドラッグ＆ドロップで1度に変換できます。
●アクセスキーで利便性向上
マウスが使えない携帯電話では、基本的に上下のスクロールと上下左右のカーソル移動しかできず、画面内の自由な移動ができません。この点を解決してくれるのが、携帯電話特有のHTMLタグであるアクセスキーです。
アクセスキーはダイヤルボタンを押すだけで、ダイレクトにリンク先に移動できるというもの。いくつかリンク先がある場合に、ダイヤルボタンひとつで別のページへ移動できるので、スムーズに目的のページへたどりつけるのです。
また、クリックするだけで電話がかけられる電話番号リンクも活用しましょう。これを使えば、電話番号をわざわざメモせずに、ショップへ電話がかけられます。
アクセスキータグ、電話番号リンクタグを活用すれば、ユーザーにとって使いやすいサイトになります。
これら4つのコツをしっかり押さえて、シンプルで使いやすい携帯用ショップサイト作りを心がけましょう。