On this page

当PageSpeed Insights检测到某些点按目标(例如按钮、链接或表单字段)可能过小或距离过近,以致用户不方便在触摸屏上点按时,就会触发此规则。

概览

If the links or buttons are too small or crowded, clicking on these objects on the touch screen can be more laborious than using a traditional mouse cursor. In order to avoid the trouble of accidentally pressing the wrong position, please set enough size for each click target and keep enough distance between them, so that the user will not touch any other click target with his finger when clicking any target. The average width of the pulp of an adult finger is about 10 mm (less than half an inch), so Android Interface GuidelinesThe recommended minimum point is about 7 mm according to the target size, or in移动视口正确设置的网站上,点按目标至少要达到48 CSS像素。

Recommendations

You should make sure that the most important click targets on the site (the ones most commonly used by users) are large enough, that is, at least 48 CSS pixels high/wide (if you are correct)配置您的视口),以便用户轻松点按。不常用链接的尺寸可以较小一些,但仍要与其他链接之间保持一定的距离,以免10毫米宽的手指不慎同时按到两个链接。用户无需张合手指(或依赖其他浏览器界面功能来排除手指点按干扰,如Chrome的弹出式放大镜),即可轻松准确地点按所需的按钮或链接。

将重要的点按目标设置得足够大以易于点按

This approach is better suited to your users' most frequently clicked targets, such as buttons for common actions, search bars, other important form fields, and major navigation links. The size of these click targets should be at least 7 mm (if you are correctConfigure your viewport,即为48 CSS像素),如果小于7毫米,则其周围须留有足够的空间。

确保较小的点按目标之间有足够的空间

对于不常用的链接或按钮,尺寸小于建议的7毫米是没有问题的。不过,其横向和纵向5毫米(32 CSS像素)范围内不应该有其他点按目标,以免用户手指点按一个点按目标时不慎按到其他点按目标。

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under theApache 2.0 License. For details, see our Site Policies.