スマートフォン対応(レスポンシブ)5つの注意点

※この記事は見出しと黄色の下線を読めば、30秒で理解できます。
最近では、スマートフォンからのWEBサイトにアクセスする人が多くなっていて、これからもっと増えるのは間違いありません。なのでレスポンシブ(スマートフォンやタブレット対応)はとても大切な施策なわけですが、ただスマートフォンで見えるように小さく表示出来るだけではダメですよね?
というわけで今回は一歩踏み込んで、

  1. デバイス機能
  2. GPSについて
  3. タッチ操作
  4. 端末の能力
  5. サイズや解像度

という5つの点を紹介したいと思います。
「スマートフォン対応(レスポンシブ)を求められているWEB制作者」や「スマートフォンからのアクセスが少ないと感じている方」に読んで頂きたいです。
レスポンシブって何?という方はこちら

 
※「スマートフォンやタブレット対応」と「レスポンシブ」とは意味が少し違いますが、ここではわかり易く、レスポンシブ=スマートフォン対応で説明しています。

1.デバイス機能

スマートフォンデバイスが高機能化し、カメラやGPSはもちろん、内部的にはHTML5やCS3等による機能が充実していっています。簡単に言えばもっと動的にアプリのような操作感が要求されています。
それらのデバイスの機能の進化を上手く利用できれば、より良いサイトを作り出せる可能性があります。

2.GPS連動

gps
スマートフォン、タブレットに装備されているGPS位置情報機能から、フォームにアクセス中のユーザーの現在地を検索し、住所を特定する事が出来ます。
WEBサイトと連動させることでとても便利になります。

3.タッチ操作

マウス操作中心の操作から、タッチを中心においた設計を意識する必要があります。繊細な操作ができないという制約があると同時に、直感的な操作による新たな体験を与えられる可能性もあります。
合わせて「マウスオーバーアクションは使わない」「ボタンの配置やサイズを変更する」などの施策が必要となります。

※参考にさせて頂きました→ http://www.aiship.jp/knowhow/archives/14719

4.端末の能力

スマートフォンなどのモバイル端末ではPCに比べて回線速度が遅いため、快適に閲覧できるようにするために、表示の速い、軽いサイトが求められます。
Webサイトの表示は高速なほどよいとされています。ブロードバンドが普及した現代であっても、これは不変の事実です。むしろ、ナローバンドが一般的だった昔よりも「Webはすぐに表示されるのが普通」と認識されている現代の方が速度がユーザーエクスペリエンスに与える影響は大きいとも言えます。※参考にさせて頂きました→ http://blog.nest-online.jp/7149

5.サイズや解像度

size
スクリーンサイズや解像度、その他仕様が多く存在しています。つまり、デスクトップにおける多様なサイズや解像度に対応することと共に、スマートフォンの小さな画面サイズを対象としてコンテンツやデザインを設計しなければなりません。

まとめ

スマートフォン向けにより良いサイトを考えるということは、より深くユーザのことを考える事です(UI,UX)。それはデバイスを問わずに「良いサイト」を作る考え方となります。
モバイル対応サイトを作る時には、是非今回の5つの点を頭に入れて制作に入って下さい。