Time to hit a target depends on how far away it is and how big it is, which makes size and distance the two levers you control.
Law · Motor control
Tag
accessibility
Entries tagged accessibility, drawn from across the library. Tags cut through the section structure, which is where most of the useful connections are.
109 entries across 10 sections
Type
Category
Level
109 entries
Moving a pointer along a constrained path takes time proportional to the path length divided by its width, which is why nested menus are hard.
Law · Motor control
The interface should always tell the user what is going on, through timely and appropriate feedback.
Heuristic · Nielsen heuristics
Error messages should say what happened, why, and what to do next, in plain language.
Heuristic · Nielsen heuristics
Every action needs a perceivable response that says it was received and what it did.
Principle · Interaction
An affordance is what an object makes possible. A signifier is the cue that tells you so.
Principle · Interaction
Focused attention makes people miss things in plain sight, including changes to the interface they are using.
Psychology · Attention
Difference is what makes anything perceivable, and it is measurable for text against its background.
UI foundation · Visual design
The attribute that names a colour, and the one that carries cultural and semantic meaning.
UI foundation · Color
The dimension that determines contrast, hierarchy and whether text can be read at all.
UI foundation · Color
Colours assigned a fixed meaning, which only works if the assignment is consistent and never the only signal.
UI foundation · Color
A brand colour chosen for a logo usually needs adjustment before it can survive as an interface accent.
UI foundation · Color
Not an inversion. A second theme with its own contrast, elevation and saturation rules.
UI foundation · Color
Around one in twelve men has a colour vision deficiency, so colour has to be reinforced by something else.
UI foundation · Color
Charts need three kinds of palette, and the choice between them is determined by the data, not by taste.
UI foundation · Color
A fixed set of sizes derived from one ratio, so type decisions become selections rather than inventions.
UI foundation · Typography
Using size, weight, colour and space to make the structure of text visible before it is read.
UI foundation · Typography
The space between lines, which governs whether a paragraph is readable and is a WCAG requirement.
UI foundation · Typography
Small adjustments that matter most at the extremes of size, and that should be left alone in between.
UI foundation · Typography
How easily continuous text can be read, governed mostly by size, line length, leading and contrast.
UI foundation · Typography
Type that adapts to viewport and container without breaking user zoom or the accessible minimum.
UI foundation · Typography
One layout that reflows across sizes, ideally driven by content limits rather than by device categories.
UI foundation · Layout
Icons speed recognition for concepts users already know and create guesswork for everything else.
UI foundation · Form and depth
Images either carry information or they do not, and the ones that do not are costing you load time.
UI foundation · Form and depth
Animation should explain a change, and anything that does not explain something is delay.
UI foundation · Form and depth
Every interactive element needs a defined appearance for every state it can be in, and most designs specify only two.
UI foundation · Form and depth
The structure that tells people what exists and where they are, which is an information architecture problem before it is a layout one.
Pattern · Structure
The escape hatch from navigation, and often the primary path for users who know what they want.
Pattern · Finding
Suggestions as the user types, which turns recall into recognition when it is fast enough.
Pattern · Finding
Reordering a set, where the default order is the decision that matters most.
Pattern · Finding
Checking input at the right moment, which is rarely while the user is still typing.
Pattern · Forms
What to show while waiting, chosen by how long the wait is and whether its length is known.
Pattern · Content states
Grey placeholders in the shape of the content that is coming, which reads as progress rather than as waiting.
Pattern · Content states
Telling users something happened, where the default should be not to interrupt.
Pattern · Communication
Breaking a long task into steps, which reduces per-screen load but adds navigation cost and abandonment points.
Pattern · Forms
Three ways to handle long result sets, each with a different cost, and the right choice depends on the task.
Pattern · Finding
Triggers an action. If it navigates somewhere, it should be a link instead.
Component · Actions
Free-form entry, where the label, the hint and the error placement do most of the work.
Component · Forms
Choosing one option from a known set, which is the wrong control below about five options.
Component · Forms
One choice from a small visible set, where seeing all the options is the point.
Component · Forms
An immediate on or off setting, which must actually take effect immediately.
Component · Forms
Selecting from a continuous range, which is imprecise by nature and needs a numeric partner.
Component · Forms
One of the hardest components to get right, and one where typing is often faster than picking.
Component · Forms
Blocks everything else, which is why it should be reserved for things that genuinely cannot wait.
Component · Overlays
A panel that slides in from an edge, keeping context visible while offering more room than a popover.
Component · Overlays
A small panel anchored to a trigger, for interactive content that does not deserve a modal.
Component · Overlays
A short description on hover or focus, which must never be the only place information lives.
Component · Overlays
A brief confirmation that disappears, which makes it unsuitable for anything the user must act on.
Component · Feedback
A persistent message tied to a context, which is where anything requiring action belongs.
Component · Feedback
Parallel views in one space, which works only when users never need to compare across them.
Component · Navigation
Collapsible sections that shorten a page, at the cost of hiding content from scanning and from search.
Component · Navigation
A list of actions revealed on demand, which is where infrequent operations belong.
Component · Navigation
Content revealed below a trigger, a term that covers three different components and causes confusion.
Component · Navigation
A trail showing where you are in a hierarchy, useful when the hierarchy is deeper than two levels.
Component · Navigation
Splitting results into pages, which preserves position and keeps the footer reachable.
Component · Navigation
A container that groups content about one object, and the most over-applied component in modern UI.
Component · Containers
A small marker of status, category or count, which must not look like something you can press.
Component · Containers
A visual identifier for a person or entity, which needs a name alongside it more often than not.
Component · Containers
The right tool for comparing many records across many attributes, and a large amount of behaviour to specify.
Component · Data
Communicating how far through something the user is, which requires honesty about what you can measure.
Component · Feedback
Rotating content in one space, which performs poorly for anything the user needs to see.
Component · Containers
A visual encoding of data, which is only useful if the encoding matches the question being asked.
Component · Data
Signing in is a gate in front of the thing people came for, so every decision is about removing steps without removing safety.
Pattern · Account
Shows where the reader is in a sequence, how much is left, and whether they can move between steps.
Component · Navigation
Say what happened, why if you know, and what to do next, in that order and in plain language.
UX writing · UX writing
Deciding what content a user needs and in what order, which is a design activity rather than a writing one.
UX writing · UX writing
Writing that does not exclude, misgender or make assumptions about the person reading it.
UX writing · UX writing
Making content findable by search engines, which overlaps almost entirely with making it good for people.
UX writing · Content
Say what the field wants, why it is needed, and what format is acceptable, before the reader gets it wrong.
UX writing · UX writing
Explain the thing that cannot be made obvious, and put the explanation where the decision happens.
UX writing · UX writing
What the standard is, which version applies, and how the levels translate into design decisions.
Accessibility · Standards
Everything must be operable with a keyboard alone, which is the single most load-bearing accessibility requirement.
Accessibility · Operable
The visible marker showing where keyboard focus is, which must never be removed.
Accessibility · Operable
Deliberately moving focus when the interface changes, so keyboard and screen reader users are not stranded.
Accessibility · Operable
Software that reads the interface aloud, navigating by structure rather than by layout.
Accessibility · Perceivable
Headings are the table of contents screen reader users navigate by, so levels must follow structure rather than appearance.
Accessibility · Perceivable
The text equivalent of an image, which depends on the image's purpose in that specific context.
Accessibility · Perceivable
What assistive technology announces for a control, which must match what a user would call it.
Accessibility · Robust
Telling assistive technology that something changed, when focus did not move to say so.
Accessibility · Robust
Colour may reinforce meaning but must never be the only thing carrying it.
Accessibility · Perceivable
Interactive targets need to be large enough and spaced enough to hit reliably.
Accessibility · Operable
Large-scale motion can cause nausea and dizziness, so the system preference must be honoured.
Accessibility · Operable
Content must work at 400 percent zoom without horizontal scrolling, which is the same as working at 320 pixels wide.
Accessibility · Perceivable
Text must scale to 200 percent without breaking, which means never sizing type in absolute units.
Accessibility · Perceivable
Users must be able to increase spacing without content being clipped or lost.
Accessibility · Perceivable
Errors must be identified in text, described specifically, and accompanied by a suggested fix where one is known.
Accessibility · Understandable
Every input needs a persistent label, and format requirements must be stated before the user types.
Accessibility · Understandable
Content that appears on hover or focus must be dismissible, hoverable and persistent.
Accessibility · Perceivable
Single-character shortcuts must be switchable off, remappable, or active only on focus.
Accessibility · Operable
Supporting several visual identities from one system, which is a token architecture problem before it is a design problem.
Design system · Foundations
Checking the built thing against the intent, before release rather than after.
Workflow · Practice
A structured assessment against WCAG, combining automated tooling with the manual testing that finds most real problems.
Workflow · Practice
Deciding what to fix first, using evidence rather than the volume of the most recent complaint.
Workflow · Practice
Using a model alongside automated tooling, which extends coverage a little and does not approach a real audit.
AI workflow · Evaluation
Use a model as a fast first reviewer against a named framework, then treat every point as a hypothesis rather than a finding.
AI workflow · Review
Hiding columns on small screens made the table tidy and removed the data field staff had opened it to see.
Case study · Data products
A review pass for any form, covering structure, labelling, validation, errors and accessibility.
Checklist · Forms
A practical WCAG 2.2 AA review pass, ordered so the checks that find the most problems come first.
Checklist · Accessibility
Touch targets, reach, input, performance and the assumptions that only fail on a phone.
Checklist · Mobile
The pass before shipping, covering states, edge cases, accessibility, performance and the things that only break in production.
Checklist · Release
The most widely used automated accessibility testing engine, available in browsers and in CI.
Tool · accessibility
Built into Chrome, covering performance, accessibility, SEO and best practices in one run.
Tool · accessibility
Guided manual accessibility testing, not just an automated scan.
Tool · accessibility
Free, widely used Windows screen reader, and the most practical starting point for manual testing.
Tool · accessibility