Что это
Эта проверка конкретно смотрит, включает ли мета-тег viewport страницы настройки, отключающие масштабирование — чаще всего user-scalable=no или maximum-scale=1, добавленные к тому же тегу, который иначе требуется для мобильной адаптивности. Эти дополнения иногда использовались в прошлом, чтобы предотвратить случайное увеличение масштаба при двойном касании, но у них есть серьёзный, непреднамеренный побочный эффект: они полностью блокируют масштабирование, даже когда посетитель намеренно хочет увеличить масштаб щипком.
Это отличается от простого отсутствия тега viewport вообще (что вызывает другую, чисто визуальную проблему, рассмотренную в других наших руководствах по viewport) — здесь конкретно рассматривается тег viewport, который присутствует, но настроен так, чтобы активно предотвращать масштабирование.
Почему это важно
Многие слабовидящие посетители полагаются на зум щипком как на свой обычный способ комфортно читать любой веб-контент, регулируя уровень масштабирования до того, что работает для их собственного зрения на данной странице. Блокировка этой возможности не просто создаёт неудобство — для того, кому это действительно нужно, это может сделать содержимое страницы совершенно нечитаемым, полная точка, независимо от того, насколько хорошо оформлена остальная часть страницы.
Это явно упомянуто в WCAG (стандартных руководствах по веб-доступности), которые требуют, чтобы зум не был отключён, именно из-за того, насколько прямо это влияет на людей со слабым зрением — это считается одним из более серьёзных, предотвратимых сбоев доступности именно потому, что это отнимает возможность, которую сам браузер уже предоставляет по умолчанию.
Как это исправить
- Проверьте мета-тег viewport вашей страницы на наличие
user-scalable=noили значенияmaximum-scale, равного1или ниже. - Удалите обе эти конкретные части, если они присутствуют, сохранив остальную часть тега (
width=device-width, initial-scale=1) нетронутой. - Если исходной целью было предотвращение случайного зума от двойного касания на конкретном интерактивном элементе, решите эту проблему с помощью более целевого стиля на этом элементе, а не отключая зум для всей страницы.
- Если вы используете конструктор сайтов, это редко что-то, что платформа устанавливает по умолчанию — проверьте любые пользовательские фрагменты кода, которые вы добавили в раздел
<head>страницы. - Протестируйте затем на реальном телефоне, пытаясь увеличить масштаб щипком на странице, чтобы убедиться, что теперь она реагирует нормально.