変化の早いインターネットの世界では、デザインの常識も常に変化しています。最近の変化を牽引する要因は、もちろん「スマートフォン」対応です。iPhoneやAndroidといったスマートフォンが普及することによって、これまでのWebサイトに大きな変化が求められているのです。

まず、タッチデバイスという操作特性によって、Webサイトのユーザーインターフェース(UI)デザインが変化しています。例えば、従来の見出しや説明の文字を排して、画像を画面一杯にタイルを並べたような「フラットデザイン」と呼ばれるUIデザインにリニューアルするサイトが増えました。それは、どういった変化から登場したのか、考えてみましょう。

これまで大きくなる一方だった画面サイズが、スマートフォン・タブレットという携帯性を持たせるための物理的制約によって解像度は変わらず画面サイズが小さいという状況になってきました。
そのために、PCの画面がそのまま縮小表示されることになりました。また、標準のフォントサイズも大きめに設定するようになりました。
さらに行間も広げることで、読み取りやすい工夫がなされました。同時に見出しの長さを短くしたり、共通要素のナビゲーションは装飾要素を排して目立たないようにし、コンテンツとしての「画像」に目がいく工夫がなされています。

PCの利用は、イスに座って操作するというスタイルが基本です。画面も大きいので、全体をゆっくり見渡します。一画面で全体が見渡せるように、細かく画面を分割して要素を詰め込んでいました。
しかし、タッチデバイスは、持ったまま、立ったり座ったり、移動しながら操作するということができるようになりました。画面も小さいので、スクロールして内容を確認するのが前提になります。
その結果、画面を分割が単純化しました。これまでは、左側にナビゲーション、中央がコンテンツ、右側に関連リンクやバナーを並べる3分割の画面レイアウトが定着していました。しかし、今では、スマートフォンへの対応が進み、画面分割を行わない画面レイアウトが主流になりつつあります。

PCではマウスを使って操作します。マウスは画面上のカーソルを動かすために、1pixel単位の細かい指定も可能です。クリック、ダブルクリック、左右クリックといった細かい操作もできます。特に「マウスオーバー」というインターフェース表現があります。選択する前に、選択範囲を明示したり、プルダウンメニューのような表示を出すことができました。
タッチデバイスでは、基本、指で操作します。そのためマウスに比べるとあまり細かい操作ができません。しかも不安定な状態で片手で操作する状況もあります。そして、タッチデバイスでは、PCでは当然のように行っていた、「マウスオーバー」という表現がつかえないため、ワンクリックにワンアクションということになります。そのために「ボタン」という、直感的にアクションを誘発する形状が見直されることになりました。

これらの変化が「フラットデザイン」を生み出した要因です。これまでのPC向けインターフェースを見慣れていると、むしろ「逆行」「デザインしていない」とも感じられるような変化ですが、デバイスの変化にあわせて新たなデザインとして急速に浸透しているのです。

スマートフォンによるもっとも大きな変化は、一人のユーザーがPCとスマートフォンを利用シーンによって、「使い分ける」ようになったということです。そこで、PCを利用するシーンとスマートフォンを利用するシーンは、明確に異なるととらえて個々に最適化するのが「マルチデバイス対応」の考え方です。

例えば、スマートフォンで、利用の多いコンテンツとして代表的なのは、店舗や営業所の「営業時間」や「地図」です。外出中に、お店が開店しているのか知りたい、どうやって行けばいいか最寄の駅からの道順を確認したい、といったニーズが想像できます。
ECサイトで商品を検索する場面では、スマートフォンの場合は、金額の安さよりも、在庫の有無を重視します。一覧を表示する場合は、PCが価格の安い順だとすると、スマートフォンでは、在庫が有る商品に絞って並べるべきです。
PCでは、お問い合せをしたい時にはメールをしますが、スマートフォンは「電話する」という選択肢をとる場合があります。そのために電話番号をクリックすると電話がかけられるように設定しておいたほうがユーザーにとって便利です。

PCに比べてスマートフォンは「緊急性が高い」情報収集を行うと考えて良いでしょう。スマートフォンを利用するシーンでは、「今すぐ」「短時間」で課題を解決したいのです。これまでのPC向けに最適化した情報を、スマートフォンでも表示できるようにデザイン・レイアウトを調整するだけで十分なのか、利用するユーザーの立場に立って検証してみる必要があります。ユーザーのデバイスの使い分けに注目し、細やかなニーズ対応をすることが、自社のWebサイトの利用を拡げるチャンスなのではないでしょうか？