Novinka v Agoře · MCP server
Vestavěný MCP server v Agoře dává nástrojům Claude Code, Cursor, GitHub Copilot i jakémukoli jinému agentovi s podporou MCP skutečný nástroj pro testování přístupnosti. Agent otestuje stránku, kterou právě vytvořil, přesně uvidí, co selhává a proč, opraví kód a znovu ji otestuje, aby opravu prokázal – ještě než vůbec vznikne pull request.
Animovaná ukázka programovací relace: vývojář požádá svého AI agenta, aby zkontroloval přístupnost na localhost:3000/checkout a opravil nalezené chyby. Agent zavolá nástroj scan_url v Agoře a získá skóre 58 ze 100 se čtyřmi problémy: tlačítko bez názvu, obrázek bez alternativního textu, text s nízkým kontrastem a pole bez popisku. Opraví kód ve třech souborech, znovu spustí sken a dosáhne 100 ze 100.
Funguje s
Slabina UI psaného umělou inteligencí
Programovací agenti se učili z webu a většina webu přístupná není: tlačítka jen s ikonou, chybějící popisky, text s nízkým kontrastem. Bez možnosti testování váš agent nepozná, zda komponenta, kterou právě vygeneroval, funguje pro uživatele klávesnice nebo čtečky obrazovky. Teď to ověřit může – stejným testovacím jádrem, kterému už důvěřuje váš tým pro přístupnost.
Nastavení za minutu
MCP server se spouští společně s Agorou a naslouchá pouze na vašem počítači. Stránka AI Agents zobrazuje jeho stav a adresu, kterou máte použít.
Zkopírujte z Agory jeden příkaz nebo úryvek konfigurace, nebo použijte instalaci jedním kliknutím pro Cursor a VS Code.
„Otestuj localhost:3000 a oprav, co najdeš.“ Agent zavolá Agoru, použije opravy a ověří je.
Uvnitř volání nástroje
Žádná vágní skóre. Agora vrací každé porušení s příslušným kritériem WCAG, přesným prvkem, jeho HTML a konkrétní opravou – ve formátu, podle kterého může agent okamžitě jednat.
Agent → Agora
Čeština 
English 
Deutsch 
Español 
Italiano 
Български 
简体中文 
Polski 
Nederlands 
Dansk 
Svenska 
Français 
Português 
Ελληνικά 
Català 
Română 
Suomi 
Magyar 
{ "method": "tools/call", "params": { "name": "scan_url", "arguments": { "url": "localhost:3000/checkout", "selector": "#payment-form", "viewports": ["desktop", "mobile"] } }}Agora → agent
http://localhost:3000/checkout
3 problémy · 5 prvky · WCAG 2.2 AA
button-name WCAG 4.1.2 Buttons must have discernible text
button.pay-apple
<button class="pay-apple"><svg …/></button>Jak opravit: Element does not have inner text that is visible to screen readers; aria-label attribute does not exist or is empty
label WCAG 4.1.2 Form elements must have labels
#card-cvc
<input id="card-cvc" placeholder="CVC">Jak opravit: Element does not have an explicit <label>; aria-label attribute does not exist or is empty
color-contrast WCAG 1.4.3 Elements must meet minimum color contrast ratio thresholds
.total__hint
<p class="total__hint">Taxes included</p>Jak opravit: Element has insufficient color contrast of 2.9 (foreground color: #a3a3a3, background color: #ffffff). Expected contrast ratio of 4.5:1
Agent → Agora
{ "method": "tools/call", "params": { "name": "scan_html", "arguments": { "html": "<nav class=\"tabs\">…</nav>", "baseUrl": "http://localhost:3000/", "mode": "component" } }}Agora → agent
HTML component (2.4 KB)
3 problémy · 4 prvky · WCAG 2.2 AA
aria-required-children WCAG 1.3.1 Certain ARIA roles must contain particular children
nav.tabs > ul[role="tablist"]
<ul role="tablist">…</ul>Jak opravit: Element has children which are not allowed: li[tabindex]
aria-valid-attr-value WCAG 4.1.2 ARIA attributes must conform to valid values
#tab-billing
<a id="tab-billing" aria-controls="billing">Jak opravit: Invalid ARIA attribute value: aria-controls="billing"
heading-order Best Practice Heading levels should only increase by one
.panel > h4
<h4>Billing address</h4>Jak opravit: Heading order invalid
Čtyři nástroje, jakýkoli pracovní postup
scan_url Lokální vývojové servery, staging, produkce nebo soubor na disku.
scan_html Proveďte audit komponenty ještě předtím, než ji zapojíte do stránky, a to bez serveru.
validate_attributes Skenery najdou chybějící názvy. Tento nástroj ověří, zda názvy, které existují, opravdu dávají smysl.
simulate_screen_reader Poslechněte si stránku nebo komponentu tak, jak ji slyší nevidomí uživatelé, přímo ze stromu přístupnosti Chrome.
Přístupnost jako výchozí stav
Místo samostatného auditu o týdny později probíhá testování ve stejné smyčce, kterou už váš agent spouští pro typy, testy a linting.
Vytvořit
Agent napíše nebo upraví UI.
Skenovat
Zavolá Agoru na stránku nebo komponentu.
Opravit
Použije opravy, na které Agora upozorní.
Ověřit
Skenuje znovu, dokud problémy nezmizí.
Proč si ho týmy vybírají
Server přijímá spojení pouze z vašeho počítače a stránky se vykreslují a skenují lokálně přímo v Agoře.
axe-core s pravidly A a AA z WCAG 2.0, 2.1 a 2.2 a volitelnými kontrolami AAA: stejná pravidla jako při každém jiném skenu v Agoře.
Stránky se vykreslují v Chromu, takže styly, skripty i vykreslování na straně klienta jsou součástí testu.
Vývojové servery se samopodepsanými certifikáty, cesty file:// i stránky za základním ověřením uloženým v Agoře prostě fungují.
Sdílený, stále připravený prohlížeč udržuje skeny rychlé, takže agent může kontrolovat po každé změně.
Claude Code, Cursor, VS Code s rozšířením GitHub Copilot, Windsurf, Claude Desktop, Codex CLI a Gemini CLI, s postupem nastavení pro každý z nich přímo v Agoře.
Vyzkoušejte Agoru zdarma, připojte svého programovacího agenta během minuty a sledujte, jak opravuje chyby přístupnosti dřív, než se dostanou do code review.