1か月近く前の話ですが、LINE ヤフー社の 「Tappy」がラボアプリとしてリリースされてましたね。webページ上のタップターゲットについて、その大きさを分析し、タップの成功率を表示してくれるステキなツールなのですがご存じでしょうか。URLを入力するだけで、そのページに含まれるリンクやボタンといったタップ可能な要素の、タップ操作の成功率を計算して表示してくれるます。何年か前に「スマホのタップ操作の成功率を算出するモデル」というプレスリリースがありましたが、ついにツールとなって登場ですって。
Tappy
現在は、解像度が認識可能なiOS機種に対応しているとのこと。デバイスの項目では、 iPhone 4 から iPhone 15 までが選べるようになっていました。URLを入力し、任意項目を設定、分析を開始すると程なく、右ペインにタップ成功率の算出結果が表示されます。
タップターゲットのサイズについては、Material Design のユーザー補助機能に関するガイドラインでも説明されているように、「ユーザーが操作できる画面上のすべての要素は、確実に操作できるよう十分な大きさにする必要がある。」とされており、要素の幅と高さは 48 dp 以上が推奨されています。これについて考慮されていない UI の場合、PSI ( PageSpeed Insights ) の「ユーザー補助」レポートでも改善を提案されるので、普段から気を使っている人がほとんどかも知れませんね。
ウェブページやアプリ制作の現場で、「タップ領域が狭すぎると誤タップするから気を付けなさい」と言われても、実際にどのくらい影響するのか分からないし、そんなの気にしすぎじゃない? と思う方もいらっしゃるかもしれません。「Tappy」を使えば、「どのくらい影響するのか分からない」という点はクリアできそうですよね。
Tappyがスマートフォン用ウェブページの開発時にお役立ていただければ幸いです。
LINE ヤフー社のプレスリリース内で、このように書かれていました。お言葉に甘えて、UX 向上のために活用させていただきましょう。