Week 7: Reading an Interface Without Looking at It

Status as text and semantics rather than as picture — ARIA values when there is no value, live regions that do not flood, and what reduced motion reveals about what your animation was carrying.

20 April 2027

Open the slides

This is the lecture Assignment 2 is marked against. Everything on the audit sheet appears here first.

Slides

What this lecture carries#

Semantics for a value you may not have. role="progressbar" with aria-valuenow, aria-valuemin and aria-valuemax when a value exists; aria-valuetext when the raw number needs words around it (“3 of 7 files”, not “43”). And the case the specification handles but most implementations do not: what to do when there is genuinely no value. Omitting aria-valuenow states that progress is indeterminate. Setting it to 0 states that nothing has happened. These are different claims, and by week 4 you have three registers that each need a different one.

Live regions, and the announcement flood. A polite live region reports changes without interrupting. The failure mode is not silence, it is volume: a bar wired to announce aria-valuenow on every update produces a hundred announcements for one upload, which is worse than announcing nothing, because the state changes that mattered are now buried in the count. The rule this course uses: announce state transitions, never increments.

Focus as a state machine. A keyboard path is not a tab order. When a state changes underneath the user — a transfer completes, a stall begins, a control disappears — something has to happen to focus, and “nothing” is a decision with consequences.

Reduced motion as a diagnostic. prefers-reduced-motion is usually taught as a courtesy. Treat it instead as a test: turn the animation off and ask what information left with it. If something did, that information was never in your interface — it was in the animation, and an animation is not something everybody gets. This is the week your week 6 treatments are examined for whether they were carrying meaning or carrying atmosphere.

What it builds on#

Everything visible you have made. Week 4 supplied the three indeterminate registers; week 6 supplied three motion treatments. Both are inputs today, and both are about to be tested for whether they were information.

What it sets up#

A worked example#

The announcement flood, in numbers, because the scale is the argument.

A 40 MB upload on a slow connection emits a progress event roughly every 200 ms: about 450 events. Wire a live region to aria-valuenow and a screen-reader user hears a number read aloud, over and over, for ninety seconds.

Wire it to state transitions instead and the same upload announces five things: reading, hashing, transferring, verifying, stored.

Both interfaces are “accessible” in the sense that the information reaches the accessibility tree. Only one of them is usable, and the difference is not a missing attribute — it is a decision about what counts as a change worth reporting.

What this lecture cannot settle#

Conformance is not usability, and this lecture only gets you the first.

Every criterion covered here can be satisfied by an interface that is still unpleasant to use without sight. A checklist is a record of failures somebody has already had and written down; it cannot report one nobody has. The audit on Thursday will find real defects and will not tell you whether the result is good — nobody in the room uses a screen reader daily, and saying so on the sheet is part of the work.

If you miss the hour#

The slides carry the argument in the order it was made, and this week’s reading is listed on the studio page. The studio on Thursday assumes the vocabulary above rather than re-teaching it, so read the deck before you arrive rather than after.