Skip to content
Обучение Измерение Блог Case studies О сайте
Содержание
  • Аудит целей касания в Lighthouse
  • Как исправить цели касания
  • Материалы

Неверный размер целей касания (Tap targets are not sized appropriately)

May 2, 2019 — Обновлено Aug 21, 2019
Available in: Español, 日本語, 한국어, Português, 中文, English
Appears in: SEO-аудиты
Содержание
  • Аудит целей касания в Lighthouse
  • Как исправить цели касания
  • Материалы

Цели касания — это области веб-страницы, с которыми пользователи на сенсорных устройствах могут взаимодействовать. Цели касания есть у кнопок, ссылок и элементов форм.

Многие поисковые системы ранжируют страницы по тому, насколько они удобны для пользователей мобильных устройств. Достаточный размер целей касания и адекватное расстояние между ними делают страницу более удобной для использования с мобильных устройств.

Аудит целей касания в Lighthouse #

Lighthouse помечает страницы, на которых цели касания слишком малы или расположены слишком близко друг к другу.

Аудит Lighthouse, показывающий цели касания неправильного размера

Если на странице будут цели, размер которых менее 48 × 48 пкс или расстояние между которыми менее 8 пкс, аудит будет считаться непройденным. В этом случае Lighthouse выводит результаты в таблице с тремя столбцами:

Цель касания (Tap Target)Цель касания с неверным размером.
Размер (Size)Размер ограничивающего прямоугольника цели в пикселях.
Перекрывающаяся цель (Overlapping Target)Другие цели касания, находящиеся слишком близко (если таковые имеются).
Each SEO audit is weighted equally in the Lighthouse SEO Score, except for the manual Structured data is valid audit. Learn more in the Lighthouse Scoring Guide.

Как исправить цели касания #

Шаг 1. Увеличьте размер слишком маленьких целей касания. Цели касания размером 48 ×48 пкс аудит не проходят. Если какие-то элементы не должны выглядеть больше этого размера (например, значки), попробуйте увеличить свойство padding:

Цели касания правильного размера
Свойство padding увеличивает цель касания, не изменяя внешний вид элемента

Шаг 2. Увеличьте расстояние между целями касания, которые находятся слишком близко друг к другу. Для этого можно использовать, например, свойство margin. Обеспечьте расстояние как минимум 8 пкс.

Материалы #

  • Удобство использования целей касания: подробнее о том, как сделать так, чтобы всем посетителям было удобно пользоваться целями касания.
  • Исходный код аудита Неверный размер целей касания (Tap targets are not sized appropriately).
Последнее обновление: Aug 21, 2019 — Улучшить статью
Return to all articles
Поделиться
подписаться

Contribute

  • Сообщить об ошибке
  • Просмотреть исходный код

Дополнительная информация

  • developer.chrome.com
  • Новости Chrome
  • Web Fundamentals
  • Разборы конкретных случаев
  • Подкасты
  • Шоу

Соцсети

  • Twitter
  • YouTube
  • Google Developers
  • Chrome
  • Firebase
  • Google Cloud Platform
  • Все продукты
  • Условия и конфиденциальность
  • Правила сообщества

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