Interface

People also encounter empty lists, slow requests, partial results, errors and content that does not fit the ideal layout. These states need enough information to explain what is happening and what to do next.

Map the transitions around a real task. Distinguish an empty account from a search with no matches, and a retryable failure from a permission problem. Use realistic long names and large datasets to check wrapping and overflow. Keep existing work visible when a temporary problem does not require removing it.

Give controls enough room to activate without accidentally hitting a neighbour, especially on touch screens. Check the real hit area rather than judging the artwork alone.

WCAG 2.2 Level AA specifies a minimum target size of 24 by 24 CSS pixels, with exceptions including qualifying spacing and inline targets. A 44 by 44 target can be a useful touch design goal, but it is not a universal AA requirement. Review the applicable criterion and test the finished controls in context.

Feedback might be a pressed state, a pending label or an updated view. Avoid leaving a silent gap that encourages repeated submissions.

For longer work, explain what is happening and provide accurate progress when it is available. Do not invent a percentage when the system cannot measure it. Let people cancel or return later when the operation supports that safely. If an optimistic update fails, preserve their input and explain how to recover.

Decide which changes need a draft, recovery history or undo, and make the saved state accurate. Show a save failure rather than implying that unsaved work is safe.

Match the recovery mechanism to the consequence. Undo works well for reversible edits; an irreversible action may need a specific confirmation naming what will be lost. Draft storage also needs an appropriate retention and privacy policy. Do not persist sensitive inputs indiscriminately or restore stale content without context.