The size of tap targets and the distance between them can affect the success of your site. Remember that the same text may appear differently on laptops and smartphones.
What does “Not size tap targets appropriately” mean?
This means that the page in question has buttons and links (tap targets) that are too close and small to each other. For the web version, this situation is not critical. But if users see this when using smartphones, the site needs to be fixed. Why? Because users may not be able to tap the right link with their fingers the first time. And they can get annoyed about it and leave such a site.
What triggers this issue?
You created the site first for the web version, where all the elements look harmonious together. But then you noticed that the pages look different on the mobile version: Some small tap targets are close to each other. You even used small clickable elements, but they are far enough apart. Below are some typical reasons:
- Using a different scale on the mobile version
- Adding new links
- Add or remove words or sentences
How to check the issue?
If you think that some tap targets on your site are close/small, then you need to do the following:
- Find all clickable elements within the chosen page
- Ensure that each tap target is a minimum 48x48dp in size or approximately 9mm in each dimension. But if there are smaller elements, they should be spaced about 32 pixels apart, both horizontally and vertically
We recommend that you use separate programs for Android and IOS to check for this problem.
You can find out more details about the touch target size here:
Find out not only the information about Tap targets being too small and close, but also the presence of technical errors on it!
Conduct a full audit to find out and fix all the site level and page level issues on your website.
Why is this important?
You’ve done SEO for your site, but some new users may not be happy with the mobile version because tap targets are not sized appropriately on your pages. And users can accidentally click on a neighboring element instead of the desired one. You’d better avoid placing tap targets close to each other.
How to fix the issue?
After you have found the problem tap targets, then you need to do the following:
- Increase the size of these tap targets as much as possible
- See how close tap targets are to each other
- Check all tap targets in special programs for Android and IOS for problematic ones again. And check if any error occurs with your page after making changes
And so on until the moment when everything will suit you with your page.
It would help if you also made sure that the new big tap targets don’t harm the quality of the content on your page.