Неверный размер целей касания (Tap targets are not sized appropriately)
Цели касания — это области веб-страницы, с которыми пользователи на сенсорных устройствах могут взаимодействовать. Цели касания есть у кнопок, ссылок и элементов форм.
Многие поисковые системы ранжируют страницы по тому, насколько они удобны для пользователей мобильных устройств. Достаточный размер целей касания и адекватное расстояние между ними делают страницу более удобной для использования с мобильных устройств.
Аудит целей касания в Lighthouse #
Lighthouse помечает страницы, на которых цели касания слишком малы или расположены слишком близко друг к другу.
Если на странице будут цели, размер которых менее 48 × 48 пкс или расстояние между которыми менее 8 пкс, аудит будет считаться непройденным. В этом случае Lighthouse выводит результаты в таблице с тремя столбцами:
Как исправить цели касания #
Шаг 1. Увеличьте размер слишком маленьких целей касания. Цели касания размером 48 ×48 пкс аудит не проходят. Если какие-то элементы не должны выглядеть больше этого размера (например, значки), попробуйте увеличить свойство padding:
padding увеличивает цель касания, не изменяя внешний вид элемента
Шаг 2. Увеличьте расстояние между целями касания, которые находятся слишком близко друг к другу. Для этого можно использовать, например, свойство margin. Обеспечьте расстояние как минимум 8 пкс.
Материалы #
- Удобство использования целей касания: подробнее о том, как сделать так, чтобы всем посетителям было удобно пользоваться целями касания.
- Исходный код аудита Неверный размер целей касания (Tap targets are not sized appropriately).