Skip to main content
Glama
shawnmcb

a11y-mcp-server

by shawnmcb

a11y-mcp-server

アクセシビリティ監査、WCAG基準検索、修正ガイダンスのためのMCPサーバー。現在は廃止されています。

機能

  • a11y_lookup_wcag: 番号、キーワード、またはレベルでWCAG 2.2基準を検索

  • a11y_check_pattern: HTMLスニペットを分析し、一般的なアクセシビリティの問題を特定

  • a11y_suggest_fix: 修正前後のコード例を含む修正パターンを取得

  • a11y_document_component: 18種類以上のUIコンポーネントのアクセシビリティドキュメントを生成

  • a11y_audit_summary: 問題リストから専門的な監査レポートを生成

Related MCP server: @accesslint/mcp

ローカル開発

# Install dependencies
npm install

# Build
npm run build

# Run locally
npm start

# Server runs on http://localhost:8080
# Health check: http://localhost:8080/health
# MCP endpoint: http://localhost:8080/mcp

NFSNへのデプロイ

私の環境での前提条件(環境により異なる場合があります):

  1. NFSNアカウントと資金(初回デポジット約10ドル)

  2. SSHアクセスの設定

セットアップ手順

1. NFSNサイトの作成

  1. NFSNメンバーインターフェースにログイン

  2. Sites → Create a New Site

  3. Site type: Custom (Node.jsデーモンに必要)

  4. サイトのホスト名をメモする (例: yoursite.nfshost.com)

2. コードのアップロード

# From project directory
rsync -avz --exclude node_modules --exclude .git --exclude dist \
  ./ USERNAME_SITENAME@ssh.phx.nearlyfreespeech.net:/home/protected/a11y-mcp-server

3. SSH設定

ssh USERNAME_SITENAME@ssh.phx.nearlyfreespeech.net

# Navigate to project
cd /home/protected/a11y-mcp-server

# Check Node.js version (should be 18+)
node --version

# Install dependencies
npm install --production

# Build
npm run build

# Make run.sh executable
chmod +x run.sh

# Test locally
./run.sh
# Ctrl+C to stop

4. NFSNデーモンの設定

  1. NFSNサイトコントロールパネルに移動

  2. Sites → Your Site → Site Information → Daemons

  3. デーモンを追加:

    • Tag: node

    • Command Line: /home/protected/a11y-mcp-server/run.sh

    • Working Directory: /home/protected/a11y-mcp-server

5. NFSNプロキシの設定

  1. Sites → Your Site → Site Information → Proxies

  2. プロキシを追加:

    • Protocol: http

    • Base URI: /mcp

    • Document Root: (空のまま)

    • Target Port: 8080

6. デプロイの確認

# Check health endpoint
curl https://yoursite.nfshost.com/health

# Test MCP endpoint
curl -X POST https://yoursite.nfshost.com/mcp \
  -H "Content-Type: application/json" \
  -H "Accept: application/json, text/event-stream" \
  -d '{"jsonrpc":"2.0","method":"tools/list","id":1}'

トラブルシューティング

デーモンログの確認:

ssh USERNAME_SITENAME@ssh.phx.nearlyfreespeech.net
cat /home/protected/a11y-mcp-server/daemon.log

デーモンの再起動: NFSNコントロールパネル経由: Sites → Daemons → Restart

デーモンが実行中か確認:

ps aux | grep node

Claude Codeの設定

~/.config/claude/claude_desktop_config.json に追加:

{
  "mcpServers": {
    "a11y": {
      "url": "https://yoursite.nfshost.com/mcp"
    }
  }
}

その後、Claude Codeを再起動します。

Claude Codeによるローカルテスト

NFSNデプロイ前にテストを行うには、サーバーをローカルで実行し、Claude Codeが接続するように設定します:

  1. サーバーを起動:

npm start
  1. ~/.config/claude/claude_desktop_config.json に追加:

{
  "mcpServers": {
    "a11y-local": {
      "url": "http://localhost:8080/mcp"
    }
  }
}
  1. Claude Codeを再起動

評価用質問

サーバーが正しく動作しているか確認するために、以下の質問を使用してください:

  1. WCAG検索: "What WCAG criterion covers keyboard navigation and what level is it?"

    • 期待される結果: 2.1.1 キーボード (レベルA) と詳細情報が返される

  2. 修正パターン: "What's the remediation pattern for missing alt text on decorative images?"

    • 期待される結果: 空の alt="" を含むパターン例が返される

  3. コンポーネントドキュメント: "Generate accessibility documentation for a modal dialog component."

    • 期待される結果: キーボード操作、ARIA属性、スクリーンリーダーの期待動作が返される

  4. WCAG 2.2検索: "Which WCAG 2.2 criteria are specific to mobile/touch interactions?"

    • 期待される結果: 2.5.x 入力モダリティの基準が返される

  5. 一般的な失敗: "What are the common failures for criterion 1.4.3 Contrast?"

    • 期待される結果: F24、F83 失敗手法が返される

使用例

WCAG基準の検索

Query: "What WCAG criterion covers keyboard navigation?"
Tool: a11y_lookup_wcag
Args: { "query": "keyboard" }

HTMLの問題チェック

Query: "Check this HTML for accessibility issues"
Tool: a11y_check_pattern
Args: { "html": "<img src='logo.png'><button><svg>...</svg></button>" }

修正パターンの取得

Query: "How do I fix missing alt text on decorative images?"
Tool: a11y_suggest_fix
Args: { "issueType": "missing-alt-decorative" }

コンポーネントドキュメントの生成

Query: "Generate accessibility documentation for a modal dialog"
Tool: a11y_document_component
Args: { "componentType": "modal" }

WCAGデータの更新

WCAG基準は src/data/wcag-criteria.json にバンドルされています。更新手順:

  1. JSONファイルを編集して新しい基準を追加

  2. ビルド: npm run build

  3. NFSNへ再デプロイ

ライセンス

MIT

A
license - permissive license
Not graded
quality - not tested
C
maintenance

Maintenance

Maintainers
Response time
Release cycle
Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Related MCP Servers

  • A
    license
    Not graded
    quality
    F
    maintenance
    An MCP server for WCAG accessibility auditing in AI coding agents, providing tools to audit HTML, files, URLs, and diffs, plus a prompt for React component auditing.
    306
    6
    MIT
  • A
    license
    A
    quality
    D
    maintenance
    An MCP server for web accessibility testing that enables scanning, auditing, and fixing WCAG, ADA, and other compliance issues directly from your IDE, with free local scans, AI-generated framework-aware fixes, and verification capabilities.
    14
    206
    MIT

View all related MCP servers

Related MCP Connectors

  • Augments MCP Server - A comprehensive framework documentation provider for Claude Code

  • Website QA for your coding agent: audit SEO, performance, security, accessibility over MCP.

  • A paid remote MCP for CodeG, built to return verdicts, receipts, usage logs, and audit-ready JSON.

View all MCP Connectors

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/shawnmcb/a11y-mcp-server'

If you have feedback or need assistance with the MCP directory API, please join our Discord server