How to Use Lighthouse to Measure Target Tap Spacing?
At this time, Google is sending emails to notify you of problems detected by the Google Search Console . Among these, one of the most common is the proximity between the buttons in the mobile version of the websites.
Notices like the one above are coming in conjunction with the update of Lighthouse made by Google these days, aimed at measuring the target tap spacing on websites for mobile devices.
The target tap spacing is exactly the space between a button and another, always present in the menus of the websites.
It is easy to understand how in the tablet and smartphone versions of the websites too much proximity between one button and another can create navigation difficulties for users, who often find themselves clicking, or rather to plug on a menu item but instead being the buttons too close the finger stops on the wrong one.
The thing of many SEOs and webmasters is often underestimated and mistakenly comes to create not only navigational difficulties that impact on the user experience , but from today, when an audit is returned , the tap objectives will be included in the SEO score.
How to use Lighthouse to measure target tap spacing
As Google explains, the tap targets are important for mobile design, because the excessive proximity of the targets could lead to accidental selections and the video published on Searchenginejournal that we report below shows step by step how we can use Lighthouse to measure the target spacing tap.
https: // twitter.com / i / status / 1105099173823680513
Once Lighthouse has started, among the many items in the report that it will create, we can also view the item that determines whether tap targets are sized appropriately or not.
Otherwise, the audit could recommend a whole series of steps to be taken to optimize the tap targets as an element of action, as we said a moment ago, to improve the SEO score.
To launch a Lighthouse audit we can choose two different ways:
- we can run a Lighthouse audit directly from within Chrome from the development tools section.
- we can perform a Lighthouse audit directly from the Web.dev website of Google.
When tap targets are mentioned in the audit, Google links to a developer document which detects the recommended sizes for tap targets, where we can read that “a minimum recommended touch target size is around 48 devices with a properly set mobile viewport. For example, when an icon may only have a width and height of 24px, you can use additional padding to bring the tap target size up to 48px. The 48 × 48 pixel area corresponds to around 9mm, which is the size of a person’s finger pad area ”.
Google then tells us that a minimum recommended size for touch targets is about 48 pixelsregardless of the device we use.
For example, while an icon can only have a width and a height of 24px, you can use an additional padding to bring the size of the touch target up to 48px.
The area of 48 × 48 pixels corresponds to about 9 mm, which is about the size of a person’s finger area .
The minimum distance between the touch targets should be at least 8 pixels, both horizontally and vertically, so that users do not inadvertently touch another touch target.
So now there is another thing to check when running a Lighthouse audit, although it is important to be aware of it.
Proper sizing of tap targets will help SEOs and webmasters to ensure a better user experience and help publishers ensure that their content is clicked as intended.