ARIA

Designing so that people with disabilities can use a thing, and the standards that make it checkable.

Checking that people using screen readers, keyboards, magnification, or other assistive technology can actually use an interface, through a mix of automated scans and hands-on testing.

A stack of headings that each expand to reveal a section of content, saving space on long pages and small screens at the cost of hiding what readers might have needed to see.

The short text that stands in for an image for people who can't see it, read aloud by screen readers and shown when images fail, which works best when it describes what the image is for rather than what it looks like.

Suggesting completions while someone types, which needs prefix-friendly indexes, ranking by likely intent, and careful handling of latency, typos, and accessibility.

The short row of links near the top of a page that shows where it sits in a site's hierarchy, such as Home › Shoes › Running, letting people orient themselves and step back up a level in one click.

A keyboard-summoned search box that finds and runs any command by typing part of its name, giving power users speed without forcing every feature into menus.

A menu of actions for the thing under the pointer, opened by right-click or long press, which saves travel and narrows choices but is invisible until summoned, so it should never be the only route to an action.

An interface control for entering a date, usually a calendar grid, which suits booking next week's appointment and frustrates anyone entering a birthday, with time zones and regional formats hiding classic bugs underneath.

A control that hides a list of options until it's opened, saving space at the cost of hiding choices, which ranges from desktop menu bars to the web's notoriously hard-to-style select element and the sprawling mega menus of retail sites.

Writing and placing the messages that tell people something went wrong, so they understand what happened and how to recover without feeling blamed.

Deliberately controlling which element receives keyboard focus as an interface changes.

Confining keyboard focus inside a modal surface so it cannot wander behind it.

A component supplying behavior and accessibility with no styling of its own.

The design and use of small symbolic images in interfaces and signage, which are quick to recognize when familiar and surprisingly ambiguous when not.

Making every interactive affordance reachable and operable without a pointer.

A window that blocks the rest of the interface until it is dealt with, useful for decisions that truly demand attention and overused for almost everything else.

Rendering an element into a different part of the document than its logical parent.

Spinners, progress bars, and step counters that tell people a system is working and how long is left, which changes how long a wait feels more than how long it is.

Software that turns an interface into speech or braille for people who can't see the screen, which navigates by structure rather than reading top to bottom, and exposes every shortcut a sighted design took.

Using elements for their meaning, so the document conveys structure without extra description.

A gray outline of the layout shown while content loads, so the page feels faster and doesn't jump when the real content arrives.

A control that sets a value by dragging a handle along a track, borrowed from the faders of audio equipment, ideal for adjusting something approximate with instant feedback and poor for entering an exact number.

The nested coordinate system that decides what paints above what, and why z-index often does nothing.

A row of labels that switch between panels of content occupying the same space, borrowed from paper folder tabs, suited to parallel sections viewed one at a time, and governed by a specific keyboard pattern.

A brief, non-blocking message that slides in to confirm an action or report a background event, then disappears on its own.

An on-screen control for a single on-or-off setting that takes effect immediately, borrowed from light switches, distinct from checkboxes and radio buttons, and notorious for leaving people unsure which state it is in.

A small label that appears when hovering or focusing an element, useful for naming icons and easy to make inaccessible, unreachable on touch, or covered by other layers.

The small set of typed components through which all interface markup is expressed.

Rendering only the rows of a long list that are on screen and recycling them as the user scrolls, so a list of a million items costs about as much to display as a list of thirty.