Kerning

HomeArticles → UX

UX

When not to use a modal

Four situations where the dialogue is the wrong container, and what replaces it.

The modal is the default answer to “where do we put this?” and it is the wrong answer about half the time. It is worth knowing the specific cases, because each has a straightforward replacement.

Do not use one for anything the person needs to refer back to. A modal covers the page, so a dialogue asking you to name something based on information now hidden behind it forces you to cancel, read, and reopen. Use an inline panel or a side sheet.

Do not use one for a task longer than about three fields. Long forms in modals lose their scroll position, sit awkwardly on phones, and cannot be linked to. A form that takes two minutes deserves a page with a URL, so a person can come back to it.

Four situations where the dialogue is the wrong container, and what replaces it.

Do not use one for errors that the person can fix on the page. An error modal interrupts, demands a dismissal, and then leaves them to find the field it was talking about. Put the message next to the field.

Do not use one to confirm something reversible. Confirmation dialogues on undoable actions train people to click through without reading, which means the confirmation on the one destructive action gets clicked through too. Delete, then offer undo for ten seconds. It is faster and it is safer.

What remains is the genuine case: a short, focused decision that blocks progress and cannot be undone. That is what the pattern is for, and it works well there precisely because it is rare.

AO
Ada Okonkwo

Contributing editor · Lagos

Runs usability sessions for banks and health services, which means she has watched more people fail to complete a form than almost anyone alive.

Read next

Get this in your inbox

One email on Thursdays with what we published and what else was worth reading.

One email on Thursdays. Unsubscribe in a click.