Збільшення тексту, масштаб і перекомпонування: що вимагають AODA Онтаріо і WCAG, щоб клієнти зі слабким зором могли читати ваш сайт (2026)

Не кожен, кому важко читати ваш сайт, незрячий. Набагато більше ваших клієнтів мають слабкий зір: вони бачать екран, але їм потрібен більший текст, ширші інтервали між рядками чи збільшена сторінка цілком, перш ніж вони зможуть читати. Вони не тягнуться до екранного читача. Вони тягнуться до керування масштабом, або їхній браузер уже налаштований збільшувати кожну відкриту сторінку. Справжнє питання - що відбувається з вашим сайтом, коли вони це роблять. На добре зробленій сторінці текст росте, а розкладка перебудовується в одну читабельну колонку. На погано зробленій текст обрізається, колонки наїжджають одна на одну, кнопки з'їжджають за екран, і клієнтові доводиться тягти сторінку вбік, щоб дочитати одне речення. Більшість просто йде. А оскільки це проявляється лише тоді, коли хтось справді збільшує сторінку, побіжний погляд на сайт такого порушення ніколи не покаже.

Ключові факти

• 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; адаптивна структура має жити в самій сторінці.

Як перевірити, чи переживає ваш сайт збільшення, і чим ризикуєте, якщо ні?

Суть можна перевірити самому приблизно за дві хвилини, взагалі без інструментів:

1. Відкрийте важливу сторінку (головну, сторінку товару, оформлення замовлення чи контактну форму). Затисніть Ctrl чи Cmd і натискайте плюс, поки браузер не покаже 400%. Чи перебудовується контент в одну колонку, яку можна читати, прокручуючи прямо вниз, чи ви тягнете сторінку вбік, щоб дочитати кожен рядок (1.4.10)?
2. Скиньте масштаб, потім збільште до 200% і перевірте, що нічого не обрізано, не наїжджає й не йде за край екрана (1.4.4).
3. Пошукайте текст, впечений у зображення: банери, графіку з цінами, значки «розпродаж». Чи розмивається він під час збільшення? Цей текст має бути справжнім, виділюваним текстом (1.4.5).
4. Пройдіть реальне завдання за великого збільшення - знайти товар, заповнити форму, дійти до оформлення замовлення, - ту саму наскрізну перевірку, що й для клавіатурного доступу.

Ставки ті самі, що за будь-якого бар'єра доступу. В Онтаріо в AODA немає права приватного позову, тож приватна особа не може подати за ним до суду напряму. Чинний шлях для людини - HRTO (Трибунал із прав людини Онтаріо), який розглядає скарги за Кодексом прав людини Онтаріо, і в клієнта зі слабким зором, який не може прочитати ваших цін чи завершити покупку, яку може завершити зрячий, є правдоподібна претензія про нерівний доступ до товарів і послуг - шлях, описаний у статті як проходить скарга в HRTO. Якщо ви продаєте в США, розкладка, яка розвалюється під час збільшення, входить до проблем, на які посилаються позови за ADA (Americans with Disabilities Act), - частина з понад 5 000 позовів щодо цифрової доступності, поданих до судів США у 2025 році (UsableNet). Довговічна відповідь та сама, що й для будь-якої прогалини: задокументоване виправлення, датований запис того, що ви знайшли й виправили, - і це ж має відображати чесний ACR до 31 грудня 2026 року. А оскільки те, чи справді сторінка читабельна за 400%, - людське судження, це ще одна причина, чому сканування - не аудит: робот може позначити зображення тексту чи фіксовану ширину, але не може сказати, чи зможе реальний клієнт прочитати вашу сторінку після збільшення.

Дізнайтеся, чи не знаходить перевірка на вашому сайті проблем зі збільшенням, розкладкою чи іншою доступністю, - безкоштовний звіт Vayle, приблизно 30 секунд: vayle.art. Він виявляє віджети-оверлеї, показує реальні порушення WCAG і точно каже, що юридично стосується вашої організації в Онтаріо. Без зобов'язань.

Vayle працює віддалено й займається інженерною доступністю сайтів для бізнесу Онтаріо. Загальна інформація, а не юридична консультація.