スマホ最適化、25+αのポイント。

GoogleとAnswerLabの共同指揮の下、モバイルサイトにとって最良のデザインの提言を目的に以下の方法で調査が行われたそうです。
その結果から導き出した「スマホサイト最適化25のルール」は、モバイル時代、特にtoCビジネスには欠かせない内容です。

・シカゴ・サンフランシスコにて、119時間のユーザービリティテストを敢行
・iOS・Android両方を含むユーザーに調査を実施
・ユーザーは、商品の購入、価格の調査、予約など、コンバージョンに関連するタスクを実行し、各サイトのユーザービリティを評価する
・ユーザーの評価に加え、リサーチ担当者も客観的評価を行う
その結果を項目のみご紹介します。

1.「会員登録」や「無料お試し」などを含む、サイトの中でも最も重要なCTAボタンは、必ずユーザーの目に留まる、サイトの中心に設置する

2.メニューリストは、小さなスマホ画面のスペースを埋め尽くさないように、最小限数に留める。
タイトルも、明確で分かりやすい、短いタイトルに。

3.トップページ回帰は、必ずページの上部にロゴを設置し、ユーザーが難なくサイトを遷移出来る構造設計にする。

4.プロモーションは「ユーザーの目に付くこと」だけに気が向きてナビゲーションに影響が出ていないか見直す。

5.最もコンバージョンに近いユーザーを逃さない為に、サイト内検索バーは必ず最も目立つ場所に設置する。

6.ユーザーをイライラさせないために、①1ページ目に表示される結果と検索キーワードの関連性、②オートコンプリート、③誤字脱字の自動訂正など、最高の検索体験を提供する。

7.詳細検索機能は、①絞ったはずが検索結果がいっこうに減らない、②絞った結果検索結果が0件になったなどの不満を解消する。

8.検索前に性別、欲しい商品のカテゴリ(靴、鞄などの大カテゴリ)、サイズなど、2~3の質問を事前に問いかけキーワード検索体験を高める。

9.初めて入ってきたユーザーには、入や予約等のコンバージョン関連タスクを求めず、焦ること無く、商品やサイトの探索を中心にサイト内を遷移してもらうアクティベーション>レベニュー　のサイト設計に。

10.会員登録で購入意欲が減退するユーザーが多い。初めて購入するユーザーに「会員登録無しで購入」というオプションは１つ設けておく。

11.ユーザーが登録を嫌がる理由の１つは、情報入力の手間。登録済みのユーザーには、オートフィル機能、新規ユーザーには、登録の手間を大幅に削減する決済サービスの導入などを考慮する。

12.センシティブな情報を取り扱う際には、クリック１つで電話がかかるクリック・トゥ・コールボタンを設置し、ユーザーの不信感を取り除く。電話登録の方が安心出来るというユーザーが非常に多い。

13.その場でコンバージョンに辿りつかないケースでも後々購入できるよう、「買い物かごに入れる」、「SNSでシェア」、「メールで送る」などのオプションを必ず用意する。

14.スマホでの文字入力は苦痛。登録要項を絞った後も、①リターンで次項目に自動移動②番号入フォームには自動でナンバーパッドを表示するなど、入力プロセスの最適化・省力化をする。

15.例えば年月日であれば年、月、日と別々に登録するのではなく、一括で設定できるようにし、ユーザーの手間を削減する。

16.カレンダーのビジュアル化
予約手続きを伴う際に、カレンダーは数字だけでなく、必ずビジュアルで見せ、カレンダーアプリを開くがために離脱するのを防止する。

17.1つの項目の入力エラーによってその他全ての入力データが消えてしまう、そんなことのないように、各項目の明確なラベル、エラーをその場で知らせてるオート・バリデーションなど、入力エラーによるフラストレーションを極力下げる。

18.入力項目は最小限に抑え、オートフィルを使って項目の手間を省く。どうしても数が減らせない場合には、入力をステップに分け、ユーザーに現時点でのプロセスを伝える。終わりが見えるか見えないかで、ユーザーの心理は大きく違う。

19.一部はデスクトップ対応、一部はスマホ対応という中途半端なスマホサイトはかえってユーザーのUXを悪化させる。サイト全体をスマホに最適化させることが重要。

20.モバイルユーザーは、画面をつまんで（ピンチ）ズームアウト・インすることにイライラするだけでなく、ズームの過程でCTRボタンを見逃している可能性も多く調査で指摘されている。ズームアウトやズームインの必要の無いウェブサイトの制作が必要。

21.たとえばアパレル製品は、高画質な画像を、拡大して閲覧できるだけで、コンバージョンの向上につながりやすくなる。

22.情報量が多く、ランドスケープでの閲覧が最適な場合には、ユーザーにポップアップで知らせれば、
一度に表示される情報量が増加し、ユーザーには大きなストレス解消になりえる。

23.複数ウィンドウでの操作は、ユーザー離脱を高める。同サイト内コンテンツを別ウィンドウで開くの設置を避け、単一ウィンドウ内にクーポンや比較情報を設置する。

24.ユーザーが「モバイルサイト」と「フルサイト(PC版)」の2つのチョイスを与えられた際、「モバイルサイトは情報がぎゅうぎゅうで見づらい」、「フルサイトの方が(実際にそうではないが)たくさん情報が入っている」印象を覚える。「フルサイト」ではなく、「PC版」や「デスクトップ版」といった表現で誤解を減らす。

25.位置情報取得は慎重に、あくまで位置情報はユーザー自身が入力することを前提に、「地域限定のお得な情報をGET」といったようなCTRボタンを用意しておくのが効果的。

最後に、技術的なチェック項目として、以下の5点も必ず抑えておく。

・出稿中のスマホ向け広告が、デスクトップサイトに誘導されてないか確認する
・円滑な体験を演出するため、ページのダウンロード回数は最小化する
・複数のブラウザ、バージョン、デバイスでモバイルサイトの動きを確認する
・ページコンテンツが論理的な順序でローディングされているか確認する
・モバイルサイト全体の分析を実行する

指摘されると気づくこともたくさんありますが、現実的には、PCサイトがそのままスマホ画面に表示されるものもまだまだかなり多いのが実情。スマホを世に送り出したAppleでさえ、Storeはスマホ最適化されていますが、製品含めた企業ページは、PCサイト縮小版ですからね。それって、どうなんだろう。

いずれにしても、スマホやタブレット等へのユーザーシフトが進むでしょうから、上記のルールを含めた、UI/UXは、しばらく重要な取組みとして続いて行くのは避けられません。

他方、スマホの画面は大きくなる傾向がありますが、「携帯電話」というツールであることを考えると、画面サイズには限界が自ずと出てくると思います。

当の私は、iPhoneですが、今後噂にもなっているギャラクシー並み大きなサイズが投入されても、たぶん求めないと思います。煩わしいだけですから。バッグにいれておき、Bluetoothかなにかで対応するようにしておくなど、携帯の仕方によっては、大きなサイズも平気でしょうが、個人的にはやらないと思います。

だとしたら、やっぱり、情報の受供給も、ショッピングも、「小さな画面」でいかにストレスなく使って頂くか、ですね。