accessibility

A set of rules for making websites usable with keyboards and screen readers. It covers semantic HTML, accessible headings and landmarks, correctly labeled form fields, and appropriate controls for actions and links.

In plain words
What is it for?
Use it when building or reviewing page structure, navigation, forms, buttons, links, tables, keyboard behavior, and ARIA attributes.
Why use it?
It prevents interfaces from being difficult or impossible to use for people with disabilities. It also avoids common problems such as clickable elements that cannot receive keyboard input or inputs without labels.

Cursor rule

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add rules/nedcodes-ok/cursorrules-collection/accessibility
Clone the repo
git clone --depth 1 https://github.com/nedcodes-ok/cursorrules-collection
Per session 1,145 This file is loaded in full into every session.
When invoked 1,145 The same file — it is already loaded in full.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5 $0.01145 $0.01145
Opus 5 $0.00573 $0.00573
Sonnet 5 $0.00229 $0.00229
Haiku 4.5 $0.00114 $0.00114

Measured yesterday against content hash d6436141e01f, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

accessibility scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured yesterday.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

Origin

Copies of this mod

1 near-identical copy found in the catalogue:

rules-mdc/practices/accessibility.mdc · 40 lines

How it starts

The opening of the file, as written. The whole thing — 40 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Accessibility Rules

Semantic HTML (the foundation)

  • Heading hierarchy: h1h2h3, never skip levels. Screen readers use headings to navigate — a page that goes h1 → h3 → h2 is like a book with shuffled chapters
  • Semantic elements: <nav> for navigation, <main> for primary content, <article> for standalone content, <aside> for related info, <footer> for footer. These create landmarks that screen readers use for quick navigation — a <div> with a class name does nothing
  • <button> for actions (submit, toggle, delete), <a> for navigation (go to another page/section). Never <div onClick> — it has no keyboard support, no focus, no role announcement. If you must use a div, you need role="button", tabIndex={0}, onKeyDown for Enter+Space — or just use <button>
  • Every <input> needs a visible <label> with htmlFor/for matching the input's id. Placeholder text is NOT a label — it disappears on focus, isn't announced by all screen readers, and has poor contrast
  • <table> for tabular data, not layout. With <caption>, <thead>, <th scope="col"> — screen readers announce "row 3, column 2: $45.00" which is useless without headers

ARIA (last resort, not first)

  • ARIA is a repair tool — use it when HTML semantics can't express the pattern. <nav aria-label="Main"> is correct (distinguishes multiple navs). <div role="navigation"> instead of <nav> is wrong — use the HTML element
  • Icon-only buttons MUST have accessible text: <button aria-label="Close"><CloseIcon /></button>. Without it, screen readers announce "button" with no indication of what it does
  • aria-live="polite" for dynamic content updates (toast notifications, form validation messages, loading states). Without it, screen readers don't announce content that changes after page load
  • aria-expanded="true/false" on toggles (accordion headers, dropdown triggers) — tells users whether the controlled content is visible
  • aria-hidden="true" on decorative elements (icons next to text labels, background SVGs) — removes them from the accessibility tree so screen readers don't announce noise

Read the full file on GitHub · 40 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. yesterday First seen · 40 lines · 1,145 tokens per session scan A d6436141e01f

Subscribe to this mod's changes

accessibility is a cursor rule published in the GitHub repository nedcodes-ok/cursorrules-collection (37 stars, last pushed 6mo ago), licensed MIT. It adds 1,145 tokens to every session, about $0.0057 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.