Не каждый, кому трудно читать ваш сайт, незрячий. Гораздо больше ваших клиентов - слабовидящие: они видят экран, но им нужен более крупный текст, более широкие интервалы между строками или увеличенная страница целиком, прежде чем они смогут читать. Они не тянутся к экранному чтецу. Они тянутся к управлению масштабом, или их браузер уже настроен увеличивать каждую открытую страницу. Настоящий вопрос - что происходит с вашим сайтом, когда они это делают. На хорошо сделанной странице текст растёт, а раскладка перестраивается в одну читаемую колонку. На плохо сделанной текст обрезается, колонки наезжают друг на друга, кнопки уезжают за экран, и клиенту приходится тащить страницу вбок, чтобы дочитать одно предложение. Большинство просто уходит. А поскольку это проявляется только когда кто-то действительно увеличивает страницу, беглый взгляд на сайт такого нарушения никогда не покажет.
Ключевые факты
- WCAG 1.4.4 Изменение размера текста - уровень AA, часть WCAG 2.0 (Web Content Accessibility Guidelines): текст должен увеличиваться до 200% без потери контента или функциональности и без необходимости во вспомогательных технологиях (W3C).
- WCAG 1.4.10 Перекомпоновка - уровень AA, введён в WCAG 2.1: контент должен перестраиваться в одну колонку при ширине 320 CSS-пикселей (это эквивалент увеличения до 400% на экране шириной 1280 пикселей), не заставляя пользователя прокручивать в двух направлениях (W3C).
- WCAG 1.4.12 Интервалы текста - уровень AA, тоже из WCAG 2.1: ничего не должно ломаться, когда читатель задаёт свои интервалы: высота строки 1,5×, интервал между абзацами 2×, межбуквенный интервал 0,12× и интервал между словами 0,16× размера шрифта (W3C).
- WCAG 1.4.5 Изображения текста - уровень AA, часть WCAG 2.0: используйте настоящий текст, а не картинки с текстом, чтобы при увеличении он оставался чётким и масштабируемым (W3C).
- Раздел 14 IASR Онтарио (Регламент об интегрированных стандартах доступности, O. Reg. 191/11) требует от организаций с 50 и более сотрудниками обеспечить соответствие публичных сайтов WCAG 2.0 уровня AA, а следующий ACR (отчёт о соответствии требованиям доступности) для организаций с 20 и более сотрудниками нужно подать до 31 декабря 2026 года (ontario.ca).
Что AODA Онтарио на самом деле требует для увеличения текста и масштаба?
AODA (Accessibility for Ontarians with Disabilities Act) Онтарио задаёт политику, а IASR - техническую планку: WCAG 2.0 уровня AA для публичных сайтов организаций с 50 и более сотрудниками. Два критерия, на которые опираются слабовидящие пользователи, прямо входят в этот юридический минимум. 1.4.4 Изменение размера текста значит, что ваш текст должен пережить удвоение размера без поломок, а 1.4.5 Изображения текста - что нельзя впекать заголовки, цены или подписи кнопок в JPG, который размывается и не увеличивается. Это уже требуется сегодня, на уровне WCAG 2.0 AA.
Два критерия, которые важнее всего, когда человек сильно увеличивает масштаб, - 1.4.10 Перекомпоновка и 1.4.12 Интервалы текста - появились позже, в WCAG 2.1, и входят в действующую WCAG 2.2. В голом минимуме WCAG 2.0, который называет закон, их нет. Это тот же разрыв между законом и лучшей практикой, что описан в статьях WCAG 2.0 или 2.2 в Онтарио и что изменилось в WCAG 2.2: юридический минимум - 2.0, но делать стоит по 2.2, и раскладка, которая чисто перестраивается, - одна из самых ясных причин почему.
Как слабовидящие клиенты читают ваш сайт и где он ломается?
У слабовидящего посетителя три привычки, и каждая соответствует одному из критериев выше.
- Они увеличивают всю страницу (Ctrl-плюс в Windows, Cmd-плюс в Mac), часто сильно. При 400%, что эквивалентно области просмотра в 320 пикселей, страница должна сложиться в одну колонку, которую читают, прокручивая только вниз. Раскладка фиксированной ширины, которая отказывается перестраиваться, заставляет прокручивать влево и вправо на каждой строке, и именно это призван предотвратить 1.4.10 Перекомпоновка.
- Они увеличивают только текст - через настройки браузера или инструмент чтения, до 200% и больше. Если в дизайне блоки фиксированной высоты или плотно уложенные ряды, увеличенный текст обрезается или наезжает, и это нарушает 1.4.4. Та же хрупкость проявляется, когда читатель задаёт свои интервалы из-за дислексии или усталости глаз, - случай, который покрывает 1.4.12 Интервалы текста.
- Они рассчитывают, что настоящий текст остаётся чётким. Промо-баннер с ценой распродажи, впечённой в изображение, превращается в кашу при первом же увеличении, а настоящий текст остаётся чётким при любом масштабе. Это 1.4.5, и тот же принцип стоит за тем, чтобы держать заголовки и структуру настоящей разметкой, а не стилизованными картинками.
Это сильно пересекается с адаптивным дизайном. Сайт, который аккуратно перестраивается на узком телефоне, обычно так же аккуратно перестраивается и при большом увеличении, потому что оба случая сжимают контент в узкую область просмотра, поэтому эта тема стоит рядом с мобильной и сенсорной доступностью. И она из того же семейства, что цветовой контраст: обе - слабовидящая половина доступности, клиенты, которые видят вашу страницу, но не могут комфортно её читать. Чем это точно не является - тем, что может решить прикрученный виджет. Кнопка «крупнее текст» поверх раскладки фиксированной ширины не заставляет эту раскладку перестраиваться, потому что оверлей не может перестроить ваш CSS; адаптивная структура должна жить в самой странице.
Как проверить, переживает ли ваш сайт увеличение, и чем рискуете, если нет?
Суть можно проверить самому примерно за две минуты, вообще без инструментов:
- Откройте важную страницу (главную, страницу товара, оформление заказа или контактную форму). Зажмите Ctrl или Cmd и нажимайте плюс, пока браузер не покажет 400%. Перестраивается ли контент в одну колонку, которую можно читать, прокручивая прямо вниз, или вы тащите страницу вбок, чтобы дочитать каждую строку (1.4.10)?
- Сбросьте масштаб, потом увеличьте до 200% и проверьте, что ничего не обрезано, не наезжает и не уходит за край экрана (1.4.4).
- Поищите текст, впечённый в изображения: баннеры, графику с ценами, значки «распродажа». Размывается ли он при увеличении? Этот текст должен быть настоящим, выделяемым текстом (1.4.5).
- Пройдите реальную задачу при большом увеличении - найти товар, заполнить форму, дойти до оформления заказа, - ту же сквозную проверку, что и для клавиатурного доступа.
Ставки те же, что при любом барьере доступа. В Онтарио у AODA нет права частного иска, поэтому частное лицо не может подать по нему в суд напрямую. Действующий путь для человека - HRTO (Трибунал по правам человека Онтарио), который рассматривает жалобы по Кодексу прав человека Онтарио, и у слабовидящего клиента, который не может прочитать ваши цены или завершить покупку, которую может завершить зрячий, есть правдоподобная претензия о неравном доступе к товарам и услугам - путь, описанный в статье как проходит жалоба в HRTO. Если вы продаёте в США, раскладка, которая разваливается при увеличении, входит в число проблем, на которые ссылаются иски по ADA (Americans with Disabilities Act), - часть из более чем 5 000 исков о цифровой доступности, поданных в суды США в 2025 году (UsableNet). Долговечный ответ тот же, что и для любого пробела: задокументированное исправление, датированная запись того, что вы нашли и исправили, - и это же должен отражать честный ACR к 31 декабря 2026 года. А поскольку то, действительно ли страница читаема при 400%, - человеческое суждение, это ещё одна причина, почему сканирование - не аудит: робот может отметить изображение текста или фиксированную ширину, но не может сказать, сможет ли реальный клиент прочитать вашу страницу после увеличения.
Узнайте, не находит ли проверка на вашем сайте проблем с увеличением, раскладкой или другой доступностью, - бесплатный отчёт Vayle, примерно 30 секунд: vayle.art. Он обнаруживает виджеты-оверлеи, показывает реальные нарушения WCAG и точно говорит, что юридически относится к вашей организации в Онтарио. Без обязательств.
Vayle работает удалённо и занимается инженерной доступностью сайтов для бизнеса Онтарио. Общая информация, а не юридическая консультация.