Reference Document · Locked
The spine the build and any later usability audit grade against. The behavioral counterpart to the Visual Standard: principle and the band, not pixel values.
What this is. The standard I design against, written from settled UX research and my own practice. It is the target the build works toward and the reference a usability audit can grade against. It leans on the discipline's established findings and does not invent a rule where the research already answers the question.
The through-line. A usable interface is one a person can predict, and one that keeps them in charge. Nearly every principle below reduces to two habits: meet the conventions and mental models people already carry, so attention goes to the decision in front of them and never to operating the page; and author the flow to the user's task, never to the system's, so the interface carries what the person cannot and leaves them holding the goal. The work is systemic, a behavioral spine written into the components, not a checklist bolted on at the end.
The band
Principle, by dimension
The interface answers three questions a person asks without realizing it: where am I, what just happened, and how do I get out. Visibility of system status keeps the answer to the first two always on screen — current location in the nav, immediate response to every action (Nielsen). Underneath sits the deeper target: close the two gaps Norman names. The gulf of execution is the distance between what a person wants to do and what the interface makes them do to act; the gulf of evaluation is the distance between what the system is doing and whether the person can tell. Good design narrows both. A match between system and the real world means the page speaks the person's language, not the org chart's: "estimate your costs," not "initiate intake." And user control means every path has a visible way back, an undo, an escape from a state entered by mistake. These are not features to add; they are the conditions for a page to be operable at all.
Too generic: a button that fires with no confirmation or change on screen, system-shaped labels, a flow a person can enter but not reverse.
Too much: a confirmation dialog on every trivial action, status chatter that narrates what the person can already see.
The cost of an action is predictable from research, so design to it rather than discovering it in testing. Targets are sized and placed for the effort they ask — a primary action large and reachable, never a small tap target at a screen edge (Fitts). Choices are grouped and staged so a person is never made to scan a flat list of everything at once (Hick). And the page holds to the conventions a person built on every other site they use, because familiarity is the cheapest usability there is — a link looks like a link, the logo returns home, the nav sits where nav sits (Jakob). Novelty is spent only where it earns its cost.
Too generic: identical visual weight on every action so nothing reads as primary, a fifteen-item menu with no grouping, invented controls where a standard one was expected.
Too much: a bespoke navigation metaphor a person has to learn, interaction friction styled as delight.
Structure is a promise about where things live, and the promise has to hold across the whole site (Covert). Where a site serves more than one audience under one umbrella, the architecture does the routing the person would otherwise have to do themselves: labels that name the path, an index that groups rather than flattens, a route from any entry point to the right destination in one or two confident moves. Navigation is consistent on every page, current state always shown. The test is whether a person dropped onto an interior page by a direct link knows where they are and what sits around them.
Too generic: a flat grid of unrelated destinations, labels that describe the company rather than route the visitor, an interior page with no sense of its place in the whole.
Too much: taxonomy so deep the person navigates a tree instead of reaching a destination, segmentation that fragments a small site.
Two things fail on any real flow: a person slips, and a system falters. The standard answers both, because not everything can be prevented — a fat-finger can be designed out of existence, a dropped connection cannot. Prevent the avoidable error first (Norman): forcing functions and constraints that make the wrong action impossible rather than merely discouraged, sensible defaults, formats shown before entry. For the slip that gets through, keep the cost low: make the irreversible recoverable, confirm before commit on the action that cannot be taken back, and never nag on the one that can. For the failure the interface cannot prevent, plan the fallback in advance — a request that times out preserves the person's work and tells them plainly what happened, a state that cannot complete degrades to a defined safe one, and no failure ever dead-ends or silently swallows what the person just did. The distinction that matters is Norman's: a slip is the right goal reached by the wrong action, a mistake is the wrong goal from a poor mental model. Prevention narrows the first; clarity narrows the second; recovery catches whatever remains. A person is never stranded — not by their own hand, not by the system's.
Too generic: easy to do the wrong thing, no confirm on the irreversible action, a failure that dead-ends or eats the person's input without a word.
Too much: guardrails, confirmations, and warnings so dense the interface nags and blocks the person out of the ordinary task. Prevention that performs instead of serving.
The grid is read before it is noticed: proximity groups what belongs together, alignment signals relationship, and consistent rhythm lets the eye move without re-orienting at each section (Gestalt; Müller-Brockmann). Layout derives from one spacing scale — the Visual Standard's eight-pixel base — and every responsive value is derived from it, not re-eyeballed at a breakpoint. Reading measure is held so long lines never tire the eye. The layout also carries a load, not just a look: working memory is limited (Sweller), so a screen puts the thing the moment needs most in front and lets the secondary defer until reached for. Clearing away is not deleting; it is holding back until needed. Behavior across viewports is the UX concern here, distinct from the Visual Standard's compositional one: where content reflows, the reading order stays logical and nothing essential moves out of reach on a small screen.
Too generic: related items spread apart and unrelated ones crowded, a layout that reflows into an illogical reading order on mobile, off-scale spacing at the phone breakpoint.
Too much: a grid so intricate the structure competes with the content, alignment precision no reader will ever feel.
Accessibility is the floor the whole document stands on, not a dimension among others — WCAG 2.2 AA is met across every page and component, non-negotiable, with AAA reached wherever it does not fight the Visual Standard. The four principles hold throughout: perceivable (text alternatives, captions, contrast that clears AA against the agreed palette), operable (full keyboard reach, visible focus never obscured, target sizes met, no motion-only or drag-only paths, no timing traps), understandable (predictable behavior, labeled inputs, errors named and recoverable), robust (semantic markup and ARIA only where semantics fall short, named and tested with a screen reader). The one live tension is contrast: the palette is explored in Claude Design, so the AA ratio is the fixed constraint the palette must satisfy, not a value this document sets.
Too generic: keyboard traps and invisible focus, contrast left to chance, alt text auto-filled or absent, ARIA pasted over broken semantics, conformance deferred to a pass that never comes.
Too much: ARIA layered onto elements that were already accessible, an accessibility overlay widget standing in for real markup.
Wherever a person is entering data to make a decision, the input is the moment they can be lost. Prevent the error before correcting it (Nielsen): sensible defaults, clear formats shown before entry, constraints expressed in the field rather than punished after submit. Validate at the moment that helps — on the person leaving a field, not on every keystroke, and never only at the end of a long form. Every input carries a persistent visible label, never placeholder-as-label. When something does go wrong, the message names what happened and how to fix it, in the interface's plain voice, beside the field it concerns.
Too generic: placeholder text standing in for labels, a single error summary at the top after submit, formats a person can only discover by failing.
Too much: validation firing on every keystroke, a form that interrupts to praise correct entries.
Motion is felt, not watched (the same restraint the Visual Standard asks of detailing). It earns its place only by communicating: a state change, a spatial relationship, where a thing came from or went. Response stays under the threshold where a person feels the system is keeping up — sub-second to acknowledgment, never an unexplained wait (Doherty). Perceived performance is the target, not raw speed alone: an immediate acknowledgment beats a faster-but-silent response. Every animation respects the person's reduced-motion preference, and nothing essential is conveyed by motion alone.
Too generic: an action that fires with no feedback, a wait with no indication anything is happening, motion that ignores the reduced-motion preference.
Too much: decorative animation on load and scroll, transitions long enough that a person waits on the motion itself.
Constraints the build must hold
Every page and component clears AA. AAA is reached where it does not fight the Visual Standard. This is the constraint the Visual Standard routed here; it is fixed. The contrast ratio binds the palette, not the other way around.
Accessibility · A-1 · A-2 · A-3 · routed from Visual Standard
The site meets the patterns a person already carries — link affordances, nav placement, logo-home, standard form behavior (Jakob). Novelty is spent only where it demonstrably serves the person, and never on core navigation or input.
Interaction laws · IX-3
Each page resolves to a single primary action, visible and unambiguous, and the page does not compete with itself. A visitor lands, understands, and knows how to engage — the page makes the next step obvious rather than offering many of equal weight.
H-1 · IX-1
This document specifies behavior; it does not re-architect. Where a site structure is already locked, behavior is written against it rather than in place of it — navigation, hierarchy, and routing hold, and the principles here describe how those settled structures should behave.
IA-1
Load-bearing for any human-centered product: no forced continuity, no confirm-shaming, no disguised ads, no manufactured urgency. The persuasive work is done by the clarity of the value, never by working against the person's interest.
H-2 · routed to the behavioral spine
A bar every dimension clears, not a dimension of its own. If the product is too complex for the person in front of it, they fall back on what they already know, and the product has failed — the same failure whether it is someone who cannot find the button or an expert abandoning the new tool for the old way. So two things hold on every flow. It works on the person's terms without assuming prior fluency: full capability, no required expertise, the fix for the struggling user is never a weaker product but one that does not ask them to be someone else (Holmes, exclusion as mismatch, not deficiency; WCAG as the operational floor). And a person can always take over: on any flow that acts on the user's behalf, there is a reachable way to stop it and take control. A product where the human becomes optional was built wrong.
Constraint · grounded in Holmes, WCAG · a bar on all dimensions
Forks the build resolves
On-blur inline validation is the research-backed default and the lean here. Whether any specific field warrants on-input feedback — a value updating live as a person types — is a per-flow call made against the actual interaction, not set globally.
F-1 · F-2
Open, per criterion. Which AAA criteria are taken beyond the AA floor — enhanced contrast, no images of text, context-sensitive help — is decided where it is feasible without constraining the Visual Standard's palette and type. AA is the fixed floor; the AAA reach is free.
A-1 · A-3
That a multi-audience index should group rather than flatten is the principle; the mechanism is open. Whether the routing is done by labeled sections, a segment toggle, or an entry question is a layout-and-interaction call resolved in the build against the real content.
IA-1 · IA-2 · L-1
That motion communicates and respects reduced-motion is fixed. How far the site goes beyond functional feedback toward atmosphere — a restrained page-load reveal, scroll-triggered moments on a landing page — is a direction the build proposes against the Visual Standard's restraint ceiling.
M-1 · M-2
Pipeline. Principle here. Exploration in Claude Design, where flows and components are tried as mockups for review. Back here to verify against this standard. Then a Claude Code handoff codifies the agreed behavior — focus order, ARIA, validation logic, reduced-motion handling — into the components, never as a later patch.
On reading this document. It pairs with the Visual Standard and shares its quiet reference register so the two read as one authored system. The Visual Standard owns how the site looks; this one owns how it behaves and who it includes. Where they meet — contrast, spacing rhythm, motion restraint — each names the seam rather than redrawing the other's line.
Locked 2026-06-12. The disposition holds. Pairs with the Visual Standard of 2026-06-11 as the handoff set; agreed behavior is codified into the components at the Claude Code handoff that follows review.