ДОСТУПНІСТЬ САЙТУ / WCAG 2.2 AA
Зробіть сайт доступним - виправлено в коді, а не прикрито віджетом
Аудит за WCAG 2.2 AA і справжні виправлення в коді для малого бізнесу. Дізнайтеся, що заважає клієнтам з інвалідністю користуватися вашим сайтом.
Безкоштовно. Без дзвінків від продажників. Результати прийдуть на email за кілька хвилин.
ВІД ЗАСНОВНИКА
Привіт, я Олексій.
Я інженер, який стоїть за add.black. Понад 9 років створюю сайти на WordPress, WooCommerce і Laravel і досі сам пишу та перевіряю код.
Я займаюся доступністю, бо хороший бізнес не має втрачати клієнтів через кнопку, яка не працює з клавіатури, форму, яку не може прочитати скрінрідер, чи віджет, що обіцяє виправлення, але нічого не змінює в коді.
Якщо у вас є питання щодо результатів, ви пишете мені, а не відділу продажів. Відповідаю просто: що заважає вашим відвідувачам і що потрібно, щоб це виправити.
Олексій Денисюк, засновник add.black
01 ПРОБЛЕМА
Чому це важливо
Серед ваших клієнтів є люди з інвалідністю
Понад кожен четвертий дорослий у США має певну форму інвалідності. Якщо сайт не працює з клавіатурою чи скрінрідером, багато з них не зможуть купити, записатися чи зв'язатися з вами.
Джерело: CDC: Disability Impacts All of Us
Скарги на недоступність - звична справа
Позови щодо доступності сайтів за законом ADA трапляються часто, і малий бізнес - частий об'єкт. Виправити проблеми заздалегідь дешевше, ніж реагувати на претензійний лист.
Сайт стає кращим для всіх
Проблеми доступності зазвичай перетинаються з проблемами SEO і зручності. Зрозуміла структура, читабельний текст і робочі форми допомагають кожному відвідувачу.
02 КОД, А НЕ ВІДЖЕТИ
Чому б просто не поставити віджет?
03 ЯК ЦЕ ПРАЦЮЄ
Чотири кроки, перший безкоштовний
Безкоштовна перевірка
Автоматичне сканування головної сторінки на комп'ютері й телефоні, головні проблеми пояснені простими словами.
Кілька хвилин
Повний аудит
Автоматичне і ручне тестування - клавіатура, скрінрідер, контраст, форми - зі звітом за пріоритетами.
Близько тижня
Виправлення
Виправляємо проблеми у вашому коді. WordPress, WooCommerce, Shopify, Laravel і сайти на власному коді.
Фіксована ціна
Моніторинг
Щомісячні перевірки, щоб новий контент і оновлення плагінів знову не зламали доступність.
Щомісяця
04 WCAG 2.2 AA
Що ми перевіряємо
Навігація з клавіатури
Кожне посилання, меню і кнопка працюють без миші.
Підтримка скрінрідерів
Вміст і елементи керування озвучуються зрозуміло і по порядку.
Колірний контраст
Текст і елементи керування читаються людьми зі слабким зором.
Форми й оформлення замовлення
Підписи, помилки й обов'язкові поля зрозумілі кожному.
Зображення й alt-текст
Змістовні зображення описані, декоративні - приховані.
Заголовки і структура
Сторінки мають логічну структуру, яку легко переглянути й якою легко переходити.
Фокус та інтерактивні елементи
Фокус завжди видно, а спливні вікна ніколи не затримують користувача.
Субтитри до відео і медіа
Відео мають субтитри, а аудіо - текстову альтернативу.
05 ГАЛУЗІ
Для кого це
Інтернет-магазини
Фільтри товарів, кошик, оформлення замовлення і спливні вікна.
Школи й автори курсів
Сторінки курсів, документи, відео і запис на навчання.
Клініки й медицина
Запис на прийом, контакти і форми для пацієнтів.
Юридичні фірми
Форми звернень, профілі юристів і напрями практики.
Для будь-якого бізнесу із сайтом: якщо люди через нього дізнаються, купують, записуються чи зв'язуються з вами, він має працювати для всіх.
06 ПРИКЛАД ЗВІТУ
Приклад звіту
Так виглядає звіт аудиту. Сайт і результати нижче вигадані.
Аудит доступності - приклад
example-store.com
Перевірено за WCAG 2.2, рівень AA
62/100
Оцінка доступності
27 проблем за рівнем серйозності
- 3 Критична
- 7 Серйозна
- 12 Помірна
- 5 Незначна
Приклади проблем
Критична
Кнопка "Оформити замовлення" недоступна з клавіатури
- Що не так
- Кнопка - це стилізований
<div>, тому клавіша Tab її пропускає, а скрінрідери не оголошують її як кнопку. - Кого стосується
- Користувачі клавіатури, скрінрідерів і пристроїв-перемикачів.
- Як ми виправляємо
- Замінити її справжнім елементом
<button>і додати чітко помітний стиль фокусу.
Серйозна
Поля оформлення замовлення без підписів
- Що не так
- Поля мають лише текст-підказку, який зникає під час введення і читається ненадійно.
- Кого стосується
- Користувачі скрінрідерів, люди з порушеннями пам'яті чи когнітивними порушеннями.
- Як ми виправляємо
- Додати видимі елементи
<label>, атрибути autocomplete і повідомлення про помилки, пов'язані з кожним полем.
Помірна
Акційні ціни з низьким контрастом
- Що не так
- Світло-сірий текст ціни на білому має контраст 2.8:1 (мінімум - 4.5:1).
- Кого стосується
- Люди зі слабким зором і всі, хто читає з телефона на вулиці.
- Як ми виправляємо
- Затемнити колір тексту до контрасту щонайменше 4.5:1 без зміни дизайну.
07 ЦІНИ
Ціни
Безкоштовна перевірка
$0
- Автоматичне сканування головної сторінки
- Результати на email за кілька хвилин
- Без дзвінків від продажників
Аудит доступності
від$490
- Повний звіт за WCAG 2.2 AA
- Список виправлень за пріоритетами
- 30-хвилинний дзвінок з розбором
Моніторинг
$99/міс
- Щомісячні сканування
- Виправлення нових проблем
- Оновлений звіт щомісяця
Виправлення оцінюємо після аудиту - фіксована ціна, без погодинних сюрпризів.
08 ПРО НАС
Хто виконує роботу
add.black - невелика студія сеньйорів: інженер з понад 10 роками досвіду створення сайтів на WordPress, WooCommerce і Laravel та дизайнер, який стежить, щоб виправлення не ламали ваш бренд. Ми використовуємо AI, щоб пришвидшити тестування й виправлення; кожну зміну перевіряє і тестує людина.
Alex Denysiuk
Founder & lead engineer
10+ years in WordPress, WooCommerce and Laravel. Plans, writes and reviews the code on every project.
LinkedIn: Alex Denysiuk
Mary Nesterchuk
Designer & illustrator
7+ years of design and illustration. Interfaces, brand visuals and custom artwork that make sites feel human.
LinkedIn: Mary Nesterchuk
09 ПИТАННЯ
Питання
Чи зробить це мій сайт відповідним вимогам ADA?
Ніхто не може чесно гарантувати юридичний результат. WCAG 2.2 AA - стандарт, за яким найчастіше оцінюють доступність сайтів, і ми проводимо аудит і виправляємо саме за ним. З юридичних питань зверніться до юриста.
Ви використовуєте оверлей чи плагін?
Ні. Ми виправляємо вихідний код.
Скільки це триває?
Безкоштовна перевірка: кілька хвилин, результати приходять на email. Аудит: близько тижня для типового сайту малого бізнесу. Виправлення залежать від сайту.
З якими платформами ви працюєте?
WordPress, WooCommerce, Shopify, Laravel і більшість сайтів на власному коді.
Чи потрібно давати вам доступ до сайту?
Для перевірки чи аудиту - ні. Для виправлень - так, або ми можемо передати виправлення вашому розробнику.
Де ви знаходитеся?
Ми віддалена студія з Європи, доступна в робочі години США.
10 БЕЗКОШТОВНА ПЕРЕВІРКА
Дізнайтеся, що заважає вашим відвідувачам - безкоштовно.
Безкоштовно. Без дзвінків від продажників. Результати прийдуть на email за кілька хвилин.