Google Lighthouse имеет функцию под названием Tap Target Spacing , которая проверяет, достаточно ли ссылки для щелчка по пальцу, без вероятности нажатия на любую другую ссылку ближе.
Как описано здесь :
«Минимальный рекомендуемый размер цели касания составляет около 48 независимых от устройства пикселей на сайте с правильно установленным мобильным окном просмотра.Например, хотя значок может иметь ширину и высоту только 24 пикселя, вы можете использовать дополнительные отступы, чтобы довести размер метки до 48 пикселей.Область 48 × 48 пикселей соответствует примерно 9 мм, что примерно соответствует размеру области подушечки пальца человека ».
Чтобы проверить надежность этого инструмента, я создал этот простой HTML-файл, который содержит двассылки:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div>
<a href="#h" >Home</a>
<a href="#f" id="current">Fruit</a>
</div>
</body>
</html>
Когда я тестирую этот HTML-код в Google Lighthouse , я не получаю предложение Нажмите, цели не имеют соответствующего размера **, в этом случае моя страницаиметь ** "хороший" интервал между нажатиями.
Если я удаляю <meta name="viewport"...
из своего кода и повторяю попытку, я получаю предложение реализовать окно просмотра и исправить Цели нажатияне имеет соответствующего размера **.В этом случае моя страница имеет ** плохой интервал между нажатиями (и в этом случае инструмент работает правильно).
Теперь, если я оберну свои ссылки тегами ul
и li
,как показано в приведенном ниже коде:
<ul>
<li><a href="#h" >Home</a></li>
<li><a href="#f" id="current">Fruit</a></li>
</ul>
Я получаю предложение Размеры метчиков не имеют соответствующего размера .Но если мы думаем больше, без тегов переноса, таких как ul
и li
, Lighthouse ничего мне не скажет (если у вас нет проблем с пробелами между ссылками, хотя на самом деле есть).
Так чтоGoogle Lighthouse обладает надежностью LOW и оставляет желать лучшего в некоторых тестах?
Что вы думаете?