Web Accessibility Testing MCP
Ronan Takizawa · 程式設計
Web Accessibility Testing MCP 是一套開源的 Model Context Protocol 伺服器，讓 AI 用戶端具備檢查網頁無障礙問題的能力。它把 Deque 的 Axe-core 引擎與 Puppeteer 結合，因此像 Claude Desktop 或 Cursor 這樣的助理，可以測試實際的 URL 或原始 HTML 片段，並回報 WCAG 2.0、2.1 與 2.2 的合規情況。你給它一個頁面。它回你一份清單，告訴你哪裡壞了、壞在哪裡。
關於 Web Accessibility Testing MCP
什麼是 Web Accessibility Testing MCP
Web Accessibility Testing MCP 常被簡稱為 a11y MCP，是一套小巧的 MCP 無障礙測試伺服器，把 AI 程式助理連上許多專業稽核團隊早已使用的同一套引擎。它包裝了 Deque Labs 的 Axe-core 函式庫，並透過 Puppeteer 驅動真正的無頭瀏覽器，因此檢查是針對實際算繪後的頁面，而不是靜態標記。
重點在於它擺放的位置。沒有額外的儀表板。不用在分頁之間複製結果。取而代之的是，你請助理看一下某個 URL，結果就以一般聊天回覆的形式回來。當你正在交付某個元件、想在送出 pull request 前快速跑一次 WCAG 合規檢查時，這點就很有價值。
最大的限制值得直接講明。它是社群專案，不是 Deque 的官方產品。支援來自 GitHub 儲存庫，而不是廠商的客服。此外，它只測試 Axe-core 能自動偵測到的部分，這涵蓋了許多真實問題，但永遠抓不到人類審查者會看到的一切。
開始使用
- 確認你的電腦裝有 Node.js 18 或更新版本，並挑選一個支援 MCP 的用戶端，例如 Claude Desktop、Claude Code、VS Code 或 Cursor。
- 打開用戶端的 MCP 設定檔，這個檔案在 macOS、Windows 與 Linux 上的路徑各不相同。
- 在 mcpServers 底下新增一個名為 a11y-accessibility 的項目，指令用 npx，參數用 -y a11y-mcp-server。
- 重新啟動用戶端工作階段，讓新的工具註冊進來，然後確認伺服器出現在你的工具清單裡。
- 請助理用像 wcag2aa 這樣的標籤測試某個 URL，也可以視需要設定 viewport 的寬度與高度，做行動版或桌面版檢查。
產品資訊
快速了解 Web Accessibility Testing MCP 的定價、支援平台與效能。
適合對象
這項工具最適合的使用者、任務與情境。
使用者
- 前端開發者：在元件還很新鮮時就抓到無障礙問題。你需要一套 Node.js 環境與一個 MCP 用戶端。
- QA 與無障礙測試人員：對同一批測試環境 URL 反覆執行 WCAG 檢查，不必離開助理。
- 沒有專職稽核員的小團隊：在付錢做人工審查之前，先跑一次 Axe-core 初篩。
任務
- 測試實際頁面：把伺服器指向公開 URL，讀取一份結構化的違規清單與對應的 WCAG 標籤。
- 測試 HTML 片段：貼上原始標記，在它正式上線前先檢查。
- 色彩對比分析：對照 WCAG 門檻，驗證文字與背景的搭配。
- ARIA 驗證：找出用錯或填不完整的 ARIA 屬性，這些會破壞螢幕閱讀器的輸出。
情境
- 提交前檢查：在剛編輯過的頁面上快速跑一次無障礙檢查，就在同一個開發工作階段裡完成。
- 響應式檢視：用行動版 viewport 測試版面，例如 iPhone 12 的寬度，再切到桌面版尺寸測一次。
- 回歸追蹤：重新設計後再次測試同一個 URL，比較規則引擎還會標出哪些問題。
主要功能
URL 與 HTML 片段測試
伺服器能測試任何公開 URL 或原始 HTML 字串。這同時涵蓋了你難以手動檢視的實際頁面，以及還躺在編輯器裡的片段。每次執行都會回傳結構化報告。沒有截圖。助理可以直接摘要出違規項目。
Axe-core 與 Puppeteer 整合
檢查透過 Deque 的 Axe-core 引擎執行，跑在由 Puppeteer 驅動的真正無頭瀏覽器裡。這些是 Axe-core 無障礙檢查，與專業稽核團隊執行的是同一種。因為頁面完整算繪過，結果反映的是使用者實際載入的內容，而不只是原始 HTML。這正是許多專業工具所依賴的同一套偵測邏輯。
WCAG 2.0、2.1 與 2.2 合規測試
你可以用像 wcag2aa 這樣的標籤選擇要對照哪些標準。伺服器會依 2.0、2.1 與 2.2 的規則檢查內容，讓你能對準專案真正要達到的等級，而不是全部跑一遍。
可自訂的 viewport 尺寸
寬度與高度都可設定，預設為 1280 x 800。設定成手機大小的 viewport，會浮現出只在小型螢幕上才出現的問題。例如過於狹窄的點擊目標。或是內容在窄寬度下破版。
色彩對比與 ARIA 檢查
兩個常見的失誤領域各有專屬工具。色彩對比分析器驗證文字與背景的配對，ARIA 驗證則檢視屬性的使用是否正確且完整。兩者都能抓到用眼睛核對起來很費事的問題。
規則探索
規則探索工具會說明有哪些無障礙規則存在，以及它們代表什麼。當報告標出一個你不認識的項目，而你想在判斷它是不是真問題之前先了解背景，這就很有用。
螢幕方向鎖定偵測
伺服器會標出強制指定螢幕方向的內容。這對使用平板或是有動作障礙的使用者很重要，因為被鎖定的方向可能讓頁面完全無法使用。
優缺點
優點
- 在你現有的 AI 用戶端裡執行，不必另外管理儀表板或帳號。
- 免費且開源，完整程式碼公開在 GitHub 上。
- 建構於 Axe-core 之上，這是一套廣受信任的無障礙規則引擎。
- 同時測試實際 URL 與原始 HTML，涵蓋開發的早期與後期階段。
- 可設定的 WCAG 標籤與 viewport 尺寸，讓你控制測試範圍。
缺點
- 自動檢查會漏掉需要人類判斷的問題，因此無法取代人工稽核。
- 需要 Node.js 18+ 與支援 MCP 的用戶端，這把一般非技術使用者排除在外。
- 它是社群專案，不是 Deque 的官方產品，因此沒有廠商支援專線。
常見問題
它是一套 AI 無障礙測試工具，把 AI 助理連上 Deque 的 Axe-core 引擎，讓助理能測試網頁與 HTML 片段，檢查無障礙問題與 WCAG 合規情況。這對不想離開編輯器的開發者來說很方便。你提問，它就回傳一份結構化的違規清單。
相關內容
探索與 Web Accessibility Testing MCP 相關的工具、技能與文章。
Web Accessibility Testing MCP 替代方案
Forefront
Forefront · 程式設計Forefront 是一個用來打造開源 AI 的網頁平台。你可以用自己的資料微調主流的開源語言模型、評估它們的表現，再透過 API 執行，或匯出後自行架設。想要封閉式平台的便利、卻堅持要自己擁有模型與資料的開發者，就是這裡的目標客群。
Startkit
StartKit.AI · 程式設計Startkit 是一套用來打造 AI SaaS 與 AI 包裝產品的樣板。可以把它想成一個 AI 新創樣板，把枯燥的部分都先接好了：驗證、Stripe 與 Lemon Squeezy 付款、用量限制、交易型電子郵件，以及一套能與 OpenAI、Anthropic、Groq 或 Llama 溝通的 AI API 啟動套件。你複製儲存庫、設定價格，然後專心在產品中使用者真正願意付費的部分。它建構於 React 與 Tailwind 之上的 Next.js，所以大部分的樣板程式碼對你來說並不陌生。
Testim
Tricentis · 程式設計Testim 是專為網頁、行動與 Salesforce 應用程式打造的 AI 測試自動化平台，用來建立並執行端到端測試。它靠機器學習在介面變動時維持測試穩定，團隊因此少花時間修補壞掉的定位器。對於一款今天就能開始使用的自動化測試工具來說，這表現不算差。你透過在瀏覽器錄製動作來建立測試，需要更多控制時再補上 JavaScript。對忙碌的 QA 團隊來說，這是個可靠的選擇。