Keep background controls inactive while a modal is open

What to change

Require a modal interaction to keep the active task distinct from the temporarily unavailable page behind it.

A worked example

Illustrative example

While choosing contact preferences in a modal, the visitor cannot accidentally follow a dimmed service link underneath it. Closing restores the normal page.

How to check the result

Accept when background content is appropriately inactive during the modal task and becomes fully usable again when the dialog closes.

A mistake to avoid

A dark translucent backdrop changes appearance but does not by itself prevent background controls from receiving focus or activation.

Your action checklist

Use these checks to prepare a discussion with your team or supplier. Tick a check when you have recorded the decision or evidence, rather than when a feature has simply been promised.

Decisions to recordOpen the modal and tab through all its controls in both directions. Check whether focus reaches hidden background links or browser-level positions unexpectedly.Ask the supplier to demonstrate screen reader navigation while the modal is open. The active dialog should remain the relevant interaction area.Try scrolling and tapping the background on a phone. Compare the behaviour with the intended dismissal rules and ensure no obscured action is activated.

Evidence, open questions and decisionsNext action and responsible role

Entries stay in this page and are not submitted to Kay & Co. Download your notes before leaving; the page does not save them.