タッチターゲット(touch target)とは、タッチ画面で、指で押す対象になる領域である。ボタンやリンクなどが当たる。大きさと、まわりとの間隔が、押しやすさを決める。
たとえば、スマートフォンのニュースアプリを使うとする。「閉じる」の小さな×ボタンが、「フォロー」ボタンのすぐ横にある。×を押したつもりが、「フォロー」に触れて、意図しないフォローになってしまう。
大きさの目安
ニールセン・ノーマン・グループ(NN/g)の2019年の記事が、目安を示している。最小の大きさは、1cm × 1cm である。素早く、正確に選べる大きさとして、Parhi(パルヒ)らの調査に基づく。
- 大きさは、画面上の実際の長さ(cm)で考える。ピクセルの数では、画面の密度によって、実際の大きさが変わってしまう。
- 指先の幅は、平均で1.6〜2cmである(MIT Touch Lab の調査)。親指は、押す面が平均2.5cmである。
- 指は、ターゲットより太い。だが、押し間違いの原因は、指の太さではなく、ターゲットの小ささにある、と NN/g は書いている。
- 小さいと、押すのに時間がかかる。フィッツの法則によると、的が小さいほど、狙いを定めるのに時間がかかる。

間隔をあける
小さいだけでなく、近すぎることも、押し間違いの原因になる。近くの別の部品を、まちがえて押してしまう。
- まず、大きさを確保する。そのうえで、間隔をあける。間隔は、最低でも2mmが目安である。
- 細長いボタンは、上下に積むと、間隔が足りなくなりやすい。左右に並べると、横幅の分だけ、押し間違いの余裕ができる。
- 地図の上のマーカーは、小さく密集していると、押しにくい。一覧の表示も、用意するとよい。
見えるのに、押せない
文字や形が見えるのに、小さすぎて、押せないことがある。NN/g は、これを「見る・押すの非対称(view-tap asymmetry)」と呼ぶ。見ることはできても、押すことはできない、というずれである。たとえば、カルーセルの下に並ぶ点の表示である。点は見えても、1つずつ押すには、小さすぎる。マウスでは問題なくクリックできる部品を、そのままタッチ画面に持ってきたときに、起きやすい。
もっと大きくするとき
1cmは、最小の目安である。次のようなときは、もっと大きくする。
- いちばんよく使う操作のボタンは、目立たせるため、大きくする。
- 歩いたり、車の中で使ったりする画面は、押し間違いやすい。大きくする。
- 子どもや、手先が思うように動かなくなった高齢者に向けた画面は、大きくして、余裕をもたせる。
- とても大きな画面では、目に入りやすく、届くまでの時間も短くするために、大きくする。
- スマートウォッチのような小さい画面では、ボタンを小さくしない。ジェスチャーや音声での操作を考える。
NN/g の記事に、例がある。店内で使うアプリの例である。商品の検索と、バーコードの読み取りの2つのボタンを、約2cm × 2cm にして、画面の上に置いていた。歩きながら使う人が多いからである。