Accessibility (a11y)

Busted

• :focus-visibleThe CSS rule that shows the focus ring when the browser reckons it is needed: tabbing yes, a casual mouse click usually not.
• Accessibility treeThe browser's parallel structure of names, roles, values, and states that assistive technology uses instead of the visual page.
• Accessible authenticationA login that works with password managers, paste, passkeys, and autofill instead of demanding memory, transcription, or puzzles.
• Accessible data tableA real data table whose caption and row and column headers give every cell enough context when a screen reader reaches it.
• Accessible descriptionExtra help attached to a control for assistive tech, such as format instructions or an error, without replacing its name.
• Accessible nameThe string assistive tech announces for a control, computed by the browser from label, text, alt, or ARIA.
• Alt textThe short written description of an image that a screen reader reads aloud, and that shows up when the image won't load.
• ARIA live regionA patch of the page marked so screen readers read out any update to it, without stealing the user's place.
• ARIA roleThe role attribute tells assistive technology whether a custom control is a button, tab, dialog, or another kind of widget.
• aria-expanded and aria-controlsaria-expanded says whether a disclosure is open, while aria-controls identifies the panel that its button operates.
• aria-hiddenaria-hidden keeps visible but redundant or decorative content out of the accessibility tree so screen readers skip it.
• aria-labelAn HTML attribute that gives a nameless control, like an icon-only button, a name assistive tech can read but nobody sees.
• aria-live politenessThe polite or assertive setting that decides whether a screen reader waits for a pause or interrupts to announce an update.
• Assistive technologyUmbrella term for the tools people use to operate a computer differently: screen readers, magnifiers, switches, voice control, braille.
• Audio descriptionA narration track that explains important action, settings, expressions, and on-screen text that blind viewers cannot see.
• Autoplay control and flashing contentControls that stop unwanted motion and limits that keep blinking or flashing content from creating distraction or seizure risk.
• Braille displayA device with pins that continually reshape into braille, turning text and interface details into tactile output.
• CaptionsTimed on-screen text of everything you would hear in a video: the dialogue, who is speaking, and the sounds that matter.
• Captions and transcriptsCaptions follow audio in time on a video; a transcript is the whole recording as readable text you can scan without pressing play.
• Character key shortcutsA shortcut fired by one letter, number, or symbol, which can accidentally hijack typing, voice input, or screen reader commands.
• Color contrast ratioA number scoring how readable text is against its background. WCAG wants 4.5:1 for normal text, 3:1 for large text and controls.
• Content on hover or focusTooltips and hover cards must stay open long enough to reach and read, remain under the pointer, and close without forcing focus to move.
• Decorative imageAn image that adds nothing beyond looks, marked empty on purpose so screen readers skip it instead of reading out the file name.
• Dragging alternativeButtons, menus, or taps that do the same job as holding and dragging, so moving a pointer along a path is never the only option.
• Error identificationWhen a form rejects input, saying in plain text which field broke and why. A red outline tells a screen reader absolutely nothing.
• Error preventionA safety step for high-stakes submissions: let people reverse, correct, or review the action before money, data, or legal commitments change.
• Error suggestionA form error that tells you how to correct the problem, not merely that your input was invalid.
• Focus managementDeliberately moving keyboard focus after an action (route change, dialog open, row deleted) so nobody gets dumped at the top.
• Focus ringThe visible outline or glow marking which control the keyboard is on right now. Kill it and tabbing becomes a guessing game.
• Focus trapLooping the Tab key inside an open modal so focus cannot wander to the page behind it, with Escape as the way out.
• Form label associationActually wiring a label to its input (for + id) so screen readers name the field and clicking the text focuses it.
• Heading hierarchyUsing H1 to H6 as a real outline, not as font sizes, so screen readers and skimmers can jump around the page.
• Inclusive designDesigning with people commonly excluded from the start, so the result works across a wider range of bodies, senses, and situations.
• Input modality supportThe same task works by mouse, touch, stylus, keyboard, switch, or voice instead of assuming one way of operating the screen.
• Keyboard navigationBeing able to run the whole interface with just Tab, arrows, Enter, and Escape, with no mouse or trackpad involved.
• Label in nameThe words visible on a control also appear in its accessible name, so voice-control users can activate what they see.
• Landmark regionsThe named zones of a page (banner, nav, main, footer) that screen reader users can jump between like chapters.
• Link purposeLink text that tells you where it goes or what it does, even when it is pulled out of the sentence around it.
• Modal dialog semanticsThe markup that makes a popup a real dialog: dialog role, a name, focus moved in and trapped, Escape to close, focus returned.
• Name, role, valueThe identity, type, and current state a control exposes so assistive technology can understand and operate it.
• Non-text contrastThe 3:1 contrast needed for meaningful control edges, icons, state indicators, and graphic details, not just words.
• Pointer gesturesPinches, swipes, and traced shapes need a simple one-pointer option, such as zoom buttons or Previous and Next controls.
• Prefers-reduced-motionThe system setting where users ask sites to calm the animation down, usually because motion makes them dizzy or sick.
• Reading orderThe order in which assistive technology reads a page, usually DOM order even when CSS puts the boxes somewhere else.
• Resize text and reflowYour layout still works when someone enlarges text or narrows the window to 320px: it rewraps, nothing clips, no sideways scrolling.
• Roving tabindexA group with one Tab stop where arrow keys move focus among its items, so Tab can enter once and leave once.
• Screen magnifierSoftware that enlarges part of the screen, leaving users with a small viewport where distant controls and updates can vanish.
• Screen readerSoftware that speaks the interface aloud (or sends it to a braille display) so people can use a site without seeing it.
• Semantic HTMLUsing the HTML element that matches the meaning (button, nav, main, ul) instead of styling a div to look like one.
• Skip linkA link hidden until you Tab to it that jumps keyboard users straight past the nav into the main content.
• Switch accessA scanning interface that highlights choices in turn so someone can operate the device with one or a few simple switches.
• Tab orderThe path the Tab key walks through a page's controls. It follows DOM order, not the order things appear on screen.
• Target sizeHow big a control's tappable area actually is, not how big it looks. Aim for 44px; WCAG's 24px rule has real exceptions.
• Text spacing overrideThe layout still works when a user increases line, paragraph, letter, and word spacing to make text easier to read.
• Timeout extensionA warning before time runs out, plus a simple way to ask for more time without losing work or being signed out.
• Use of colorNever let color be the only thing carrying a message. If red is the only clue that something failed, colorblind users get no clue.
• Visually hidden (sr-only)Text hidden from the screen but still in the accessibility tree, so screen readers read it and sighted users never see it.
• Voice control (speech input)Operating an interface with spoken commands, usually by saying the visible name of a button, link, field, or menu item.
• WCAGThe W3C's numbered rulebook for accessible web content, graded A, AA, and AAA. When someone says 'accessible', they usually mean AA.

The territory

28 core terms mapped for this field, ranked by how often builders reach for them. Each one is a future entry. Want to bust one? One entry, one file, one pull request.

• Alt textWritten description of an image read aloud by screen readers"the words a blind person hears instead of the picture" · "image caption for screen readers"
• Screen readerSoftware that speaks or brailles on-screen content for blind users"the voice that reads the page" · "blind people's software"
• Keyboard navigationOperating the whole interface with Tab, arrows, Enter, Escape"using it without a mouse" · "tabbing through everything"
• Focus ringVisible outline showing which element the keyboard is currently on"that blue glow when you tab" · "the box around the button"
• Color contrast ratioNumeric measure of text legibility against its background"is this gray too light" · "readability score for colors"
• Semantic HTMLUsing meaningful elements instead of generic divs and spans"using real buttons not divs" · "proper tags"
• aria-labelInvisible accessible name attached to an unlabeled control"name for the icon button" · "hidden label for the X button" · "ARIA label"
• Accessible nameThe string assistive tech announces for a control"what the screen reader calls it" · "the button's real name"
• Tab orderSequence in which Tab moves focus through interactive elements"the order things get selected" · "the tabbing path"
• Focus managementDeliberately moving focus after route changes or actions"sending focus to the right place" · "where the cursor goes after you click"
• Focus trapConfining keyboard focus inside a modal until it's dismissed"keeping tab stuck inside the popup" · "not tabbing behind the dialog"
• Modal dialog semanticsrole="dialog", aria-modal, return focus on close"making the popup accessible" · "proper markup for a dialog"
• ARIA live regionZone that announces dynamic updates without moving focus"make the screen reader say the toast" · "announce when it changes"
• Heading hierarchyOrdered H1-H6 outline screen readers use to navigate"the H1 H2 H3 structure" · "using headings in the right order"
• Landmark regionsHeader, nav, main, footer roles screen readers jump between"page sections a screen reader can skip to" · "structural areas"
• Skip linkHidden top link that jumps past nav straight to main content"jump to content thing" · "skip the menu shortcut"
• Form label associationBinding a label to its input so clicks and readers work"connecting the text to the box" · "label that belongs to the field"
• Visually hidden (sr-only)Text hidden on screen but still read by screen readers"invisible text for screen readers" · "off-screen label"
• Use of colorNot relying on hue alone to convey meaning"don't just turn it red" · "color-blind safe"
• WCAGGlobal standard defining accessibility success criteria and levels"the accessibility rules" · "the checklist auditors use"
• :focus-visibleShowing the focus ring only for keyboard, not mouse clicks"outline only when tabbing" · "no ugly ring on click" · "focus-visible"
• Target sizeMinimum tappable area so controls aren't too small to hit"the button's too tiny to tap" · "fat finger space"
• Error identificationNaming what went wrong in a form, not just coloring it red"tell them what's broken" · "actual error message"
• Prefers-reduced-motionSystem setting asking sites to tone down animation"for people who get motion sick" · "turn off the animations setting"
• Resize text and reflowLayout still works at 200-400% magnification without horizontal scroll"when they blow up the text" · "browser zoom doesn't break it" · "zoom and reflow"
• CaptionsSynchronized on-screen text of speech and sound in video"subtitles for deaf people" · "the words on the video"
• Decorative imageMarking purely visual images empty so readers skip them"images that shouldn't be announced" · "ignore this picture"
• Assistive technologyUmbrella for screen readers, magnifiers, switches, voice control"the gear disabled users use" · "special software and devices"

Deeper in the field

• ARIA role Attribute declaring what a custom widget is
• aria-expanded and aria-controls State attributes telling readers a disclosure is open
• aria-hidden Removes decorative content from the accessibility tree
• aria-live politeness Whether an update interrupts the screen reader
• Text spacing override Layout survives user-increased line height and letter spacing
• Input modality support Supporting switch, stylus, and voice input equally
• Voice control (speech input) Operating UI by spoken commands matching visible labels
• Switch access Single-button scanning input for motor-impaired users
• Captions and transcripts Timed text versus a full readable text version
• Autoplay control and flashing content Seizure and distraction risks from motion or blinking
• Timeout extension Letting users request more time before a session expires
• Character key shortcuts Single-key shortcuts hijacking assistive tech input
• Screen magnifier Zoom tool where offscreen or low-contrast UI disappears
• Braille display Refreshable tactile output driven by the accessibility tree
• Accessible data table Header scope and captions so cells are announced meaningfully
• Roving tabindex Pattern where arrow keys move within a group, Tab exits it
• Accessibility tree Browser's parallel structure exposing UI to assistive tech
• Audio description Narration track describing key visuals for blind viewers
• Inclusive design Designing for the full range of human ability from the start
• Reading order Sequence in which assistive technology encounters page content
• Link purpose Descriptive link text that clarifies destinations outside surrounding context
• Label in name Visible control text also appears in its accessible name
• Accessible description Extra control instructions exposed to assistive tech, often via aria-describedby
• Name, role, value Controls expose identity, type, state, and changes to assistive technology
• Non-text contrast Contrast requirements for controls, icons, indicators, and meaningful graphics
• Accessible authentication Login flows that avoid memory, transcription, or puzzle barriers
• Error suggestion Telling users how to correct a detected input error
• Error prevention Confirmation or reversal for submissions having serious consequences
• Dragging alternative Non-drag control for actions otherwise requiring pointer dragging
• Pointer gestures Alternatives to multipoint or path-based gestures
• Content on hover or focus Revealed content remains dismissible, hoverable, and persistent when needed