--- name: accessible-content description: Use when writing or structuring any user-facing content — interface copy, labels, error messages, help text, headings, alt text, link text, or form instructions — ensures content is readable, navigable, and meaningful for everyone --- # Accessible Content Words are interface. Every label, every heading, every error message is a design decision. This skill ensures content works for screen readers, for people reading in a second language, for people under stress, and for people who just need things to be clear. ## When to Use - Writing interface labels, button text, or form instructions - Structuring headings and page hierarchy - Writing error messages or help text - Creating alt text for images - Writing link text - Structuring data tables - Any time words appear on screen ## Process ### Step 1: Plain Language First Every piece of content should meet these criteria: - **Reading level:** aim for a reading age of 12-14 (roughly 6th-8th grade). Use short sentences and common words - **One idea per sentence.** If a sentence has "and" in the middle, consider splitting it - **Active voice.** "We sent your confirmation" not "Your confirmation has been sent" - **Specific over vague.** "Save your changes" not "Submit" or "OK" - **No jargon** unless the audience demonstrably uses it. When jargon is necessary, provide a plain explanation ### Step 2: Heading Structure Headings are navigation for screen readers. Get the structure right: - **One H1 per page** — describes the page purpose - **Headings follow a logical hierarchy** — H1 → H2 → H3, never skip levels - **Headings are descriptive** — a screen reader user scanning headings alone should understand the page structure - **Do not use headings for visual styling** — if you need big bold text that is not a heading, use CSS ### Step 3: Form Labels and Instructions Every form input must have: - **A visible label** — placeholders are not labels (they disappear on focus) - **Programmatic association** — `