Перейти до вмісту
Pandus
uk Змінити мову
Меню

WCAG тестер: безкоштовна перевірка за WCAG 2.2 AA

Надіслати мені результат на e-mail (необов’язково)

Надішліть мені результат на e-mail. Мою адресу використовують лише для цієї перевірки, як описано в політиці конфіденційності. Політика конфіденційності

Одна сторінка, WCAG 2.2 AA, близько хвилини. Автоматична перевірка, не повний аудит. Не є юридичною консультацією.

  • Без реєстрації
  • WCAG 2.2 A і AA + EN 301 549
  • Результат приблизно за хвилину

Оновлено 13 жовтня 2026

WCAG тестер відкриває вебсторінку і перевіряє її код за Web Content Accessibility Guidelines — міжнародними настановами з доступності вебконтенту для людей з інвалідністю. Введіть адресу однієї сторінки у формі вище: ми завантажимо її у справжньому браузері, запустимо автоматичні перевірки WCAG 2.2 рівнів A і AA та покажемо кожну знайдену помилку з критерієм, до якого вона належить, і порадою, як її виправити. Це безкоштовно, без реєстрації і займає приблизно хвилину. Це автоматична перевірка, а не повний аудит, і не юридична консультація.

Що ви побачите в результаті

Результат містить проблеми, знайдені на сторінці, від найсерйозніших. До кожної проблеми є:

  • пояснення простою мовою, що вона означає для ваших відвідувачів;
  • елемент на сторінці: селектор, фрагмент коду і, де можливо, знімок екрана;
  • порада, як виправити, з підказками для Shopify, WooCommerce, PrestaShop і Shoptet;
  • посилання на картку правила з критерієм WCAG і пунктом EN 301 549.
Критично trail-shop.eu/products/trail-2

Кнопка кошика не має назви

Що це означає для ваших відвідувачів

Покупець, який користується програмою зчитування з екрана, чує лише «кнопка» і не розуміє, що вона додає товар у кошик.

Як виправити в Shopify

У шаблоні товару додайте до кнопки з іконкою текст «Додати в кошик», видимий або через aria-label.

Елемент: .product-form > button.cart-icon

Правило: button-name · WCAG 4.1.2 Name, Role, Value (A) · EN 301 549 9.4.1.2

Приклад: одна проблема з результату. Справжній результат показує всі знайдені на сторінці проблеми, згруповані за серйозністю, зі знімком елемента.

Результат показується мовою цієї сторінки, тож його можна просто переслати власнику магазину чи замовнику, який не читає англійською.

Що перевіряє WCAG тестер

Тестер запускає axe-core — відкритий рушій правил від Deque Systems, на якому побудовано більшість інструментів перевірки доступності, — і зіставляє кожну знахідку з карткою з нашої бібліотеки правил. Типові знахідки: зображення без альтернативного тексту (1.1.1), текст із недостатнім контрастом (1.4.3), посилання і кнопки без доступної назви (2.4.4 і 4.1.2), поля форм без підпису, не вказана мова сторінки (3.1.1) і замалі цілі для натискання (2.5.8).

У таблиці нижче — усі 55 критеріїв успіху WCAG 2.2 рівнів A і AA і те, які з наших автоматичних правил перевіряють частину кожного з них. Критерій, до якого є правила, автоматизовано лише частково: правила ловлять типові помилки, але не можуть оцінити все, чого вимагає критерій.

Для 22 із 55 критеріїв успішності WCAG 2.2 рівнів A і AA у нашій бібліотеці є хоча б одна автоматична перевірка. Решту позначено «ручна перевірка»: їх має перевірити людина.

Критерій успішності Рівень Що перевіряє тестер
1.1.1 Non-text Content A Частково автоматично: Деякі індикатори рівня не мають назви, Деякі індикатори прогресу не мають назви, Зображення не мають текстового опису, Кнопка-зображення не має текстового опису і ще 3 (усі правила)
1.2.1 Audio-only and Video-only (Prerecorded) A Ручна перевірка
1.2.2 Captions (Prerecorded) A Частково автоматично: Відео не мають субтитрів
1.2.3 Audio Description or Media Alternative (Prerecorded) A Ручна перевірка
1.2.4 Captions (Live) AA Ручна перевірка
1.2.5 Audio Description (Prerecorded) AA Ручна перевірка
1.3.1 Info and Relationships A Частково автоматично: Уся сторінка прихована від програм зчитування з екрана, Нестандартні меню або списки зібрано неправильно, Пункти меню або вкладки стоять поза своєю групою, Список «назва — значення» побудовано неправильно і ще 8 (усі правила)
1.3.2 Meaningful Sequence A Ручна перевірка
1.3.3 Sensory Characteristics A Ручна перевірка
1.3.4 Orientation AA Частково автоматично: Сайт працює лише в одній орієнтації екрана
1.3.5 Identify Input Purpose AA Частково автоматично: Поля оформлення замовлення не заповнюються автоматично
1.4.1 Use of Color A Частково автоматично: Посилання в тексті виглядають як звичайний текст
1.4.2 Audio Control A Частково автоматично: Деякі відео чи звуки вмикаються самі зі звуком
1.4.3 Contrast (Minimum) AA Частково автоматично: Текст важко прочитати через низький контраст
1.4.4 Resize Text AA Частково автоматично: Відвідувачі не можуть збільшити сторінку на смартфоні
1.4.5 Images of Text AA Ручна перевірка
1.4.10 Reflow AA Ручна перевірка
1.4.11 Non-text Contrast AA Ручна перевірка
1.4.12 Text Spacing AA Частково автоматично: Інтервали в тексті неможливо змінити
1.4.13 Content on Hover or Focus AA Ручна перевірка
2.1.1 Keyboard A Частково автоматично: Користувачі клавіатури не можуть дістатися до вбудованого вмісту, Деякими областями з прокруткою не можна користуватися з клавіатури, Клікабельне зображення працює лише з мишею
2.1.2 No Keyboard Trap A Ручна перевірка
2.1.4 Character Key Shortcuts A Ручна перевірка
2.2.1 Timing Adjustable A Частково автоматично: Сторінка сама перезавантажується або переадресовує
2.2.2 Pause, Stop, Hide A Частково автоматично: Сторінка містить застарілу розмітку миготливого тексту, Деякий текст рухається, і його не можна зупинити
2.3.1 Three Flashes or Below Threshold A Ручна перевірка
2.4.1 Bypass Blocks A Частково автоматично: Немає швидкого способу перейти до основного вмісту
2.4.2 Page Titled A Частково автоматично: Сторінка не має заголовка
2.4.3 Focus Order A Ручна перевірка
2.4.4 Link Purpose (In Context) A Частково автоматично: Клікабельні ділянки зображення не мають опису, Деякі посилання не повідомляють, куди ведуть
2.4.5 Multiple Ways AA Ручна перевірка
2.4.6 Headings and Labels AA Ручна перевірка
2.4.7 Focus Visible AA Ручна перевірка
2.4.11 Focus Not Obscured (Minimum) (нове у 2.2) AA Ручна перевірка
2.5.1 Pointer Gestures A Ручна перевірка
2.5.2 Pointer Cancellation A Ручна перевірка
2.5.3 Label in Name A Частково автоматично: Прихована назва кнопки відрізняється від видимого тексту
2.5.4 Motion Actuation A Ручна перевірка
2.5.7 Dragging Movements (нове у 2.2) AA Ручна перевірка
2.5.8 Target Size (Minimum) (нове у 2.2) AA Частково автоматично: Кнопки й посилання замалі, щоб на них було легко натиснути
3.1.1 Language of Page A Частково автоматично: Сторінка не вказує, якою мовою вона написана, Мову сторінки вказано неправильно, Сторінка оголошує дві різні мови
3.1.2 Language of Parts AA Частково автоматично: Частину тексту позначено неправильним кодом мови
3.2.1 On Focus A Ручна перевірка
3.2.2 On Input A Ручна перевірка
3.2.3 Consistent Navigation AA Ручна перевірка
3.2.4 Consistent Identification AA Ручна перевірка
3.2.6 Consistent Help (нове у 2.2) A Ручна перевірка
3.3.1 Error Identification A Ручна перевірка
3.3.2 Labels or Instructions A Частково автоматично: Деякі поля форм мають кілька підписів
3.3.3 Error Suggestion AA Ручна перевірка
3.3.4 Error Prevention (Legal, Financial, Data) AA Ручна перевірка
3.3.7 Redundant Entry (нове у 2.2) A Ручна перевірка
3.3.8 Accessible Authentication (Minimum) (нове у 2.2) AA Ручна перевірка
4.1.2 Name, Role, Value A Частково автоматично: Клікабельні ділянки зображення не мають опису, Атрибути доступності використано не на тих елементах, Деякі елементи мають підпис для шрифту Брайля, але не мають звичайної назви, Нестандартні кнопки не мають назви і ще 23 (усі правила)
4.1.3 Status Messages AA Ручна перевірка

Чого не знайде жоден автоматичний тест

Дослідження по-різному оцінюють, яку частку проблем доступності знаходить автоматика (тест GOV.UK, дослідження Deque), але сходяться в одному: далеко не всі. Машина бачить, що в зображення є альтернативний текст, але не може сказати, чи він має сенс. Вона бачить стиль фокуса, але не знає, чи логічний порядок переходу між елементами.

Після автоматичної перевірки пройдіть вручну такі кроки:

  1. Клавіатура: до кожного посилання, кнопки й поля можна дістатися клавішею Tab, активувати їх клавішею Enter або пробілом і ніде не застрягти (2.1.1, 2.1.2, 2.4.3, 2.4.7).
  2. Масштаб і перекомпонування: збільште сторінку до 200 % і 400 %; нічого не повинно обрізатися чи вимагати горизонтальної прокрутки (1.4.4, 1.4.10).
  3. Екранний читач: прослухайте сторінку в NVDA, VoiceOver або TalkBack; заголовки, кнопки і повідомлення про помилки у формах мають бути зрозумілими (1.3.1, 3.3.1, 4.1.3).
  4. Форми й оформлення замовлення: навмисно припустіться помилок; повідомлення має пояснювати, що не так і як це виправити (3.3.1, 3.3.3).
  5. Медіа: відео потребують субтитрів, і ніщо не повинно саме вмикати звук (1.2.2, 1.4.2).

Кожен із цих кроків для інтернет-магазинів докладно розібрано в нашому чек-листі WCAG 2.2.

Що нового у WCAG 2.2

WCAG 2.2 додав шість критеріїв успіху рівнів A і AA — серед них 2.4.11 «Фокус не закрито», 2.5.7 «Рухи перетягування», 2.5.8 «Розмір цілі» і 3.3.8 «Доступна автентифікація» — і вилучив 4.1.1 «Синтаксичний аналіз». Із нових критеріїв наші автоматичні правила перевіряють лише 2.5.8 «Розмір цілі»; решта потребує людини. Докладніше — у статті про EN 301 549 V4.1.1 і WCAG 2.2.

Чим тестер відрізняється від WAVE, Lighthouse і axe DevTools

Це добрі інструменти, а Lighthouse і axe DevTools працюють на тому самому рушії axe-core. Різниця в тому, що відбувається після перевірки:

  • результат пояснює кожну проблему для власника бізнесу, а не лише для розробника;
  • він доступний сімома мовами, зокрема українською;
  • кожне правило зіставлено з EN 301 549 — європейським стандартом, на який спираються закони про доступність;
  • з тарифом ті самі перевірки виконуються на всіх сторінках сайту щотижня, і ви бачите, що змінилося.

Щоб перевіряти сторінки просто в браузері, за входом в обліковий запис або на тестовому сервері, скористайтеся нашим розширенням для браузера (Chrome, Edge, Firefox). Для WordPress і WooCommerce є плагін для WordPress, який показує проблеми біля кожної сторінки й товару.

WCAG, EN 301 549 і закон

Сам WCAG не є законом, але закони на нього посилаються. У Європейському Союзі Європейський акт про доступність (EAA) спирається на гармонізований стандарт EN 301 549, розділ якого про веб переймає критерії успіху WCAG рівня AA. Акт втілюють національні закони: BFSG у Німеччині, закон про доступність продуктів і послуг у Польщі, закон № 424/2023 Sb. у Чехії і закон 232/2022 у Румунії. У США звичним мірилом за ADA є WCAG 2.1 або 2.2 рівня AA.

Для українських компаній це важливо, коли вони продають споживачам у ЄС або коли вебстудія робить сайти для європейських замовників: про це — у статті що українській студії треба знати про EAA. Водночас EAA стосується лише B2C-послуг у визначених секторах і не поширюється на мікропідприємства. Перш ніж хвилюватися через закон, перевірте, чи стосується він вас.

В Україні є власний стандарт: ДСТУ EN 301 549:2022, ідентичний європейському EN 301 549 V3.2.1, тобто для вебу це критерії WCAG 2.1 рівнів A і AA. Пов'язаний нормативний акт — постанова Кабінету Міністрів України №757 від 21.07.2023 про доступність інформаційно-комунікаційних систем і документів в електронній формі; вона стосується передусім публічного сектору. Оскільки WCAG 2.2 містить усі критерії 2.1, крім вилученого 4.1.1, перевірка за WCAG 2.2 AA охоплює й автоматизовану частину вимог ДСТУ. Що це означає для підрядників держсайтів — у статті про ДСТУ EN 301 549 і постанову №757.

Результат тестера — не декларація відповідності, але корисні вихідні дані для розділу «відомі обмеження» у вашій заяві про доступність.

Перевіряйте всі сторінки щотижня

Одна сторінка — це лише зразок. Проблеми зазвичай повторюються в шаблонах — картках товарів, кошику, оформленні замовлення — і повертаються після оновлень теми. З тарифом Pandus щотижня перевіряє всі сторінки вашого сайту, надсилає зрозумілий звіт і повідомляє, коли з'являються нові проблеми. Вебстудії отримують звіти під власним брендом.

Відповіді на часті питання

Що таке WCAG тестер?

Інструмент, який відкриває вебсторінку і перевіряє її код за критеріями успіху WCAG. Він знаходить проблеми, які машина може надійно виявити: відсутній альтернативний текст, низький контраст, кнопки без назви.

Чи безкоштовний цей WCAG тестер? Чи потрібна реєстрація?

Так, він безкоштовний і працює без реєстрації. Email — за бажанням. Щоб запобігти зловживанням, кількість перевірок на годину обмежена, а результат для тієї самої адреси зберігається 24 години. Перевіряйте лише ті сайти, на які у вас є право.

Тестер перевіряє за WCAG 2.2 чи WCAG 2.1?

За WCAG 2.2 рівнів A і AA. WCAG 2.2 містить усі критерії 2.1, крім вилученого 4.1.1 «Синтаксичний аналіз». Який рівень потрібен? Рівень AA: саме на нього спираються EN 301 549, EAA і національні закони. AAA суворіший і цими законами не вимагається. Якщо вам треба перевірити лише кольори, скористайтеся перевіркою контрасту.

Чи може автоматичний тестер підтвердити відповідність WCAG?

Ні. Чистий результат не означає, що сторінка відповідає WCAG, а результат із помилками не означає, що ви порушуєте якийсь закон. Ручна перевірка з клавіатурою та екранним читачем однаково потрібна.

Чи потрібна відповідність ДСТУ EN 301 549 для мого сайту?

Залежить від того, чий це сайт. ДСТУ EN 301 549:2022 і постанова КМУ №757 стосуються передусім державних інформаційно-комунікаційних систем, тож вимоги з'являються в ТЗ тендерів на держсайти. Для приватного бізнесу в Україні такі вимоги наразі прямо не встановлені. Якщо ж ви продаєте споживачам у ЄС, для вас може бути актуальним EAA — почніть із путівника по EAA. Це не юридична консультація: у конкретному випадку зверніться до юриста.

Чи це офіційний валідатор W3C?

Ні. W3C не має офіційного валідатора WCAG. Наш тестер побудований на axe-core і наших власних картках правил. Якщо у вас магазин і вас більше цікавлять покупці, ніж номери критеріїв, почніть із безкоштовної перевірки доступності сайту: той самий тест, але пояснений для власників бізнесу.