Проверка доступности в вашем браузере (WCAG 2.2, EAA)
Pandus расширение для браузера 1.0.0
Бесплатно. Chrome, Edge, Brave, Opera и Firefox. В магазинах расширений: скоро.
Расширение Pandus проверяет страницу, на которой вы сейчас находитесь, по WCAG 2.2 AA — уровню, на который опираются Европейский акт о доступности, немецкий BFSG и ADA, — и объясняет каждую проблему простыми словами на русском, английском, украинском, немецком, польском, чешском или румынском. Оно работает в вашем браузере, поэтому проверяет и страницы после входа: корзину с товарами, оформление заказа, личный кабинет покупателя, тестовый сайт.
Что оно делает
- Проверка страницы в один клик. Более 90 автоматических правил — те же, что и в еженедельной проверке Pandus. Проблемы сгруппированы по правилам, самые серьёзные — первыми, с объяснением, почему это важно для ваших покупателей и как это исправить.
- Показ элемента. Нажмите «Показать» — страница прокрутится к элементу и обведёт его.
- Обязательное отдельно от советов. Сначала проблемы WCAG 2.2 A/AA; AAA и лучшие практики показаны отдельно как советы.
- Копировать для разработчика. Весь список в формате Markdown для задачи в Jira, Trello или сообщения.
Инструменты для ручного просмотра
Автоматика находит только часть проблем. Инструменты помогают с остальным:
| Инструмент | Что он показывает | WCAG |
|---|---|---|
| Порядок Tab | Номера и линия в порядке, в котором движется фокус клавиатуры | 2.4.3, 2.1.1 |
| Заголовки | Структура, по которой переходят пользователи скринридеров, пропущенные уровни красным | 1.3.1, 2.4.6 |
| Ориентиры | Шапка, навигация, основное содержимое, подвал | 1.3.1 |
| Изображения и alt-текст | Текст, который зачитывается для каждого изображения, отсутствующий — красным | 1.1.1 |
| Интервалы текста | Увеличенные межстрочные, межбуквенные и межсловные интервалы | 1.4.12 |
| Масштаб 200% | Страница, увеличенная вдвое | 1.4.4 |
| Узкий экран (320 px) | Страница в окне шириной 320 px | 1.4.10 |
| Восприятие цвета | Протанопия, дейтеранопия, тританопия, без цвета, размытие | 1.4.1 |
| Контраст | Соотношение двух цветов, взятых со страницы | 1.4.3, 1.4.11 |
С аккаунтом Pandus
Подключите расширение к своему аккаунту в один клик (вы подтверждаете это в аккаунте; расширение может только читать результаты и сохранять проверки):
- смотрите, что нашла еженедельная проверка на странице, где вы находитесь, со ссылкой на отчёт;
- сохраняйте проверку страницы после входа к сайту — она появится на странице сайта в блоке «Проверки из браузера»;
- добавляйте сайт, который просматриваете, в Pandus.
Создайте бесплатный аккаунт или посмотрите, как работает Pandus.
Как установить
Пока расширения нет в Chrome Web Store и на addons.mozilla.org, установите его из zip-архива выше:
- Chrome, Edge, Brave, Opera: распакуйте zip, откройте
chrome://extensions, включите Developer mode (Режим разработчика), нажмите Load unpacked (Загрузить распакованное расширение) и выберите папку. - Firefox: откройте
about:debugging#/runtime/this-firefox, нажмите Load Temporary Add-on (Загрузить временное дополнение) и выберитеmanifest.jsonв распакованной папке. Временное дополнение удаляется после перезапуска Firefox; публикация на addons.mozilla.org уберёт этот шаг. - Закрепите значок Pandus на панели инструментов. Нажмите на него или Alt+Shift+A на любой странице.
Конфиденциальность
Без трекинга, без аналитики, без cookie. Расширение запрашивает доступ только к активной вкладке, когда вы его нажимаете, и к pandus.online для связи с вашим аккаунтом. Проверки остаются в вашем браузере, пока вы их не сохраните.
Смотрите также наш плагин для WordPress, код для любого сайта и бесплатные инструменты.