on:2012年11月9日sponsorsスマートフォン、タブレット、ラップトップタイプのタブレットなど、タッチデバイスに最適なナビゲーションの考察を紹介します。見た目のレスポンシブではなく、操作性を考慮したレスポンシブです。Devices下記は各ポイントを意訳したものです。各デバイスのサイズ各デバイスのタッチ方法タッチデバイスに最適なナビゲーションの位置デモスマフォ・タブレット・ラップトップタブレットのサイズまずは、デバイスごとのスクリーンサイズを確認してみます。過去2ヵ月にリリースした主要なスマートフォンのサイズ一覧です。スマートフォンのサイズ一覧スマートフォンのスクリーンサイズは、3.5-5.5インチがメインストリームです。過去2ヵ月にリリースした主要なタブレットのサイズ一覧です。タブレットのサイズ一覧タブレットのスクリーンサイズは、7-10.1インチがメインストリームです。ラップトップタイプのタブレットのサイズ一覧です。タブレットのスクリーンサイズは、11.6-13.3インチがメインストリームです。スマフォ・タブレット・ラップトップタブレットのタッチ方法スクリーンサイズにおけるタッチを考慮する場合に大切なポイントは2つです。最初の「大きさ」は、当然大きいほどタッチするのが簡単です。タッチ損ねやエラーを妨げるために十分な大きさを確保してください。2番目の「位置」は、実は設計する上で最も重要なポイントです。ターゲットをマウスでクリックする際には大きさや位置はそれほど気にならないかもしれませんが、なぜ重要であるかを理解するために、下記のイラストを見てください。スマートフォンの持ち方(※右利きの例)これらの体勢でスマフォを操作する場合、スクリーンの底のエリアは容易にタッチでき、上のエリアは指を曲げたり届かなかったりでタッチ操作が困難です。同様に、タブレットの持ち方も見てみましょう。タブレットの持ち方タブレット自体を膝におくか、両手で持って操作するかに分かれます。どちらで持っても、上中央の位置に指を届かせるのは非常に難しいです。タブレットは底の部分を手で支え、スクリーンを親指で支えます。タブレットの持ち方ラップタイプの方が通常のタブレットより親指が底にあるため、より上中央の位置の操作が困難になります。今日のたいていのナビゲーションシステムは、マウスやキーボード操作を前提に設計されています。容易にタッチするために設計はされていません。ありがちなレスポンシブ用のナビゲーションを見てみましょう。あるナビゲーションシステム上のナビゲーションシステムは確かによく見かけます。これはスクリーンサイズに対して最適化されているだけで、タッチすることに関して最適であるとは言えません。タッチに最適なターゲットの位置はもっとずっと底の配置です。タッチデバイスに最適なナビゲーションの位置このナビゲーションの位置がタッチしやすいかは、次のデモを実際に触れて見てください!デモタッチデバイスに最適なナビゲーションのデモを4パターン紹介します。