Сервер MCP для тестирования веб-доступности (A11y MCP)

значок кузнеца

a11ymcpwide

A11y MCP — это сервер MCP (Model Context Protocol), который предоставляет LLM-специалистам доступ к API-интерфейсам тестирования веб-доступности.

Этот сервер использует API Deque Axe-core и Puppeteer, чтобы позволить магистрам права анализировать веб-контент на предмет соответствия WCAG и выявлять проблемы доступности.

ПРИМЕЧАНИЕ: Это не официальный сервер MCP от Deque Labs.

Поставьте звездочку, если вам понравился проект! 🌟

Функции

Тестовые веб-страницы : проверка любого общедоступного URL-адреса на наличие проблем с доступностью.
Тестовые фрагменты HTML : проверка необработанных строк HTML на наличие проблем с доступностью
Тестирование на соответствие WCAG : проверка контента на соответствие различным стандартам WCAG (2.0, 2.1, 2.2)
Настраиваемые тесты : укажите, какие теги/стандарты доступности следует тестировать.
Исследование правил : получение информации о доступных правилах доступности.
Анализ цветового контраста : проверка цветовых сочетаний на соответствие WCAG
Проверка ARIA : проверка правильности использования атрибутов ARIA.
Обнаружение блокировки ориентации : определение контента, который заставляет менять конкретную ориентацию экрана.

Related MCP server: Web Accessibility MCP Server

Установка

Чтобы использовать этот сервер с Claude Desktop, вам необходимо настроить его в настройках MCP:

Для macOS: отредактируйте файл '~/Library/Application Support/Claude/claude_desktop_config.json'

{ "mcpServers": { "a11y-accessibility": { "command": "npx", "args": [ "-y", "a11y-mcp-server" ] } } }

Для Windows: отредактируйте файл %APPDATA%\Claude\settings\claude_mcp_settings.json

Для Linux: отредактируйте файл ~/.config/Claude/settings/claude_mcp_settings.json Замените /path/to/axe-mcp-server/build/index.js фактическим путем к скомпилированному файлу сервера.

Доступные инструменты

тест_доступности

Проверяет URL-адрес на наличие проблем с доступностью.

Параметры:

url (обязательно): URL-адрес веб-страницы для тестирования.
tags (необязательно): Массив тегов WCAG для проверки (например, ["wcag2aa"])

Пример

{ "url": "https://example.com", "tags": ["wcag2aa"] }

тестовая_html_строка

Проверяет HTML-строку на наличие проблем с доступностью. Параметры:

html (обязательно): HTML-контент для тестирования.
теги (необязательно): Массив тегов WCAG для проверки (например, ["wcag2aa"])

Пример

{ "html": "<div><img src='image.jpg'></div>", "tags": ["wcag2aa"] }

получить_правила

Получите информацию о доступных правилах доступности с дополнительной фильтрацией.

проверка_контраста_цвета

Проверьте, соответствует ли сочетание цветов переднего плана и фона требованиям контрастности WCAG.

Параметры:

foreground (обязательно): цвет переднего плана в шестнадцатеричном формате (например, "#000000")
background (обязательно): цвет фона в шестнадцатеричном формате (например, "#FFFFFF")
fontSize (необязательно): размер шрифта в пикселях (по умолчанию: 16)
isBold (необязательно): Выделен ли текст жирным шрифтом (по умолчанию: false)

Пример

{ "foreground": "#777777", "background": "#EEEEEE", "fontSize": 16, "isBold": false }

проверка_контраста_цвета

Проверьте правильность использования атрибутов ARIA в HTML.

Параметры:

html (обязательно): HTML-контент для проверки использования атрибута ARIA

Пример

{ "html": "<div role='button' aria-pressed='false'>Click me</div>" }

проверка_ориентации_блокировки

Проверьте, не навязывает ли контент определенную ориентацию.

Параметры:

html (обязательно): HTML-контент для проверки проблем с ориентацией

Пример

{ "html": "<html><head><meta name='viewport' content='width=device-width, orientation=portrait'></head><body>Content</body></html>" }

Формат ответа

Сервер возвращает результаты теста доступности в структурированном формате JSON:

{ "violations": [ { "id": "color-contrast", "impact": "serious", "description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds", "help": "Elements must meet minimum color contrast ratio thresholds", "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast", "affectedNodes": [ { "html": "<div style=\"color: #aaa; background-color: #eee;\">Low contrast text</div>", "target": ["div"], "failureSummary": "Fix any of the following: Element has insufficient color contrast of 1.98 (foreground color: #aaa, background color: #eee, font size: 12.0pt, font weight: normal)" } ] } ], "passes": 1, "incomplete": 0, "inapplicable": 2, "timestamp": "2025-04-25T16:45:33.655Z", "url": "about:blank", "testEngine": { "name": "axe-core", "version": "4.10.3" }, "testRunner": { "name": "axe" }, "testEnvironment": { "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/135.0.0.0 Safari/537.36", "windowWidth": 800, "windowHeight": 600, "orientationAngle": 0, "orientationType": "portrait-primary" } }

Зависимости

@modelcontextprotocol/sdk
кукловод
@axe-core/кукловод
топор-сердцевина

A11y MCP Server

Сервер MCP для тестирования веб-доступности (A11y MCP)

Функции

Установка

Доступные инструменты

тест_доступности

тестовая_html_строка

получить_правила

проверка_контраста_цвета

проверка_контраста_цвета

проверка_ориентации_блокировки

Формат ответа

Зависимости

Resources

Tools

Appeared in Searches

New MCP Servers

Latest Blog Posts

MCP directory API