手指点不准的地方，往往是间距没留够

移动端页面做完，设计师在电脑上模拟手机尺寸点一遍，觉得都挺顺。换成真机、单手、走路时再点，问题就出来了：关闭按钮点不掉，两个相邻的链接总是点错，底部的咨询按钮刚好压在内容上。

手指不是鼠标

鼠标指针只有一个像素的精确度，指尖的接触面却接近一厘米。点在屏幕上，浏览器取的是接触区域的重心，边缘还可能有偏移。这意味着视觉上很小的元素，必须给它更大的可点范围，否则用户要靠运气。

尺寸有个下限

常见建议是触控目标不小于四十四像素见方，部分平台给到四十八。图标可以画得小，点击区域靠内边距撑到这个尺寸，不必把图标放大。文字链接在正文里难以撑开，可以只在移动端增加上下内边距。

间距比尺寸更要紧

两个按钮各自四十八像素，紧挨着放，误触率依然很高。相邻目标之间留出八像素以上的空隙，是更有效的办法。列表项、标签页、分页按钮这类成组出现的元素，间距要一致，用户才能形成肌肉记忆。

把主操作放到拇指区

单手拿手机时，拇指自然覆盖的是屏幕下半部。把咨询、拨号、加入询盘这类主操作放在容易够到的位置，比放在页面顶部更合理。固定在底部的操作条要留出安全区，避免被系统手势条盖住。

输入框别让页面跳

部分浏览器在输入框字号偏小时会自动放大页面，用户一输入，整页就被推大，关闭后还要手动缩回。把输入框字号提到十六像素以上，可以避开这个行为。键盘弹起时，被遮住的提交按钮要能自动滚入视野。

悬停态在触屏上不存在

依赖鼠标悬停展开的二级菜单，在手机上往往点一下没反应，或者展开后立刻消失。触屏设备需要明确的点击展开，并且给一个关闭方式。同理，只在悬停时出现的操作按钮，在手机上等于不存在。

怎么自测

关掉模拟器，用真机单手操作一遍：能不能点到关闭、能不能分清相邻的两个链接、底部按钮会不会挡住内容、输入时页面会不会乱跳。有条件的话，让不熟悉这个网站的人试一次。

小结

触控体验的差距，常常就藏在几像素的留白里。尺寸够大、间距够开、主操作顺手、悬停有替代，四点守住，误触会少很多。冉冉科技在做移动端适配验收时，会按真机逐项核对点击区域。

关于冉冉科技

江苏冉冉信息科技有限公司（品牌“冉冉科技”）成立于2017年，位于江苏省常州市新北区，是一家从事互联网信息服务、电子商务应用与企业应用系统开发的技术服务企业。公司业务涵盖网站建设、网页设计、SEO优化、竞价包年、域名注册、虚拟主机、企业邮箱、整合营销及企业形象策划等，以“只做有效果的网络营销”为服务主张，累计完成三千余起网站建设与服务。